问题：

在iOS中使用WWebView检测Javascript方法

须巴英

2023-03-14

我正在尝试实现WKWebView来检测我的应用程序中的javascript事件，并在此基础上执行应用程序中的下一个操作。

所以我有以下html页面:

null

    <!DOCTYPE html>
    <html>
    <head>
        <meta http-equiv="Content-Type" content="text/html charset=UTF-8" />
        <!-- <meta name="viewport" content="width=device-width, initial-scale=1.0"> -->
        <title></title>

    </head>

    <body style="background-color: #f8f8f8;font-family: 'Helvetica';margin: 0; overflow: auto;  float: left; width: 100%">

        <div style="max-width:500px;display: block;margin: 30px auto;width: 100%;  padding: 60px 40px; color: #76838f;  font-size: 14px; background-color: #000;border-radius: 6px; ">
            
            <!-- title -->
            <div style="font-size: 24px;font-weight: 600;color: #9d1f2b; text-align: left;font-weight: bold;display: table;border-bottom: 2px solid rgb(255 255 255 / 34%);margin-bottom: 10px;padding-bottom: 20px;width: 100%;">
                <span style="display: table-cell;    vertical-align: middle;font-size: 28px;">Card Successfully Added</span>
            </div>
            <!-- title End-->


            <!-- content-->

            <div style="margin-bottom: 40px;margin-top: 40px;border-bottom: 1px solid #ccc;padding-bottom: 20px;">
                {{-- <p style="color: #eee;line-height: 23px;font-size: 18px;margin-bottom: 0">
                    Payment Token
                </p>
                <h5 style="color: #fff;font-size: 18px;margin-top: 8px">XYZ</h5> --}}
                <p style="color: #eee;line-height: 23px;font-size: 18px;">
                    Card Number
                </p>
                <h5 style="color: #fff;font-size: 18px;margin-top: 8px">123</h5>
                {{-- <p style="color: #eee;line-height: 23px;font-size: 18px;margin-bottom: 0">
                    Reference
                </p>
                <h5 style="color: #fff;font-size: 18px;margin-top: 8px">00000000003</h5> --}}

            </div>

            <!-- content End-->
            <form method="post" name="refer_now_form">
                <div class="refer-now-button" style="cursor: pointer">
                    <a href="{{route('create.successfull')}}" onclick="refer_now.performClick();" id="refernow" style="background: #9d1f2b;color: #fff;display: block;text-align: center;font-weight: bold;text-transform: uppercase;text-decoration: none;height: 50px;line-height: 50px;font-size: 18px;">Back To App</a>
                </div>
            </form>

        </div> <!-- end -->

    </body>
    <script>
        $(document).ready(function() {

        function performClick() {
                try {
                    webkit.messageHandlers.callbackHandler.postMessage("Card Successfully Added");
                } catch (err) {
                    console.log('Card failed');
                }
            }
        });

    </script>
    </html>

null

我还使用解决方案从这里检测javascript事件:如何在iPhone web应用程序中使用jQuery进行单击事件，但这对我不起作用。

下面是我实现的iOS代码。

import UIKit
import WebKit

class ViewController: UIViewController, WKScriptMessageHandler, WKNavigationDelegate, WKUIDelegate {
   
    var webView: WKWebView!
    
    var webConfig:WKWebViewConfiguration {
        
        get {
            
            // Create WKWebViewConfiguration instance
            let webCfg:WKWebViewConfiguration = WKWebViewConfiguration()
            
            // Setup WKUserContentController instance for injecting user script
            let userController:WKUserContentController = WKUserContentController()
            
            // Add a script message handler for receiving  "buttonClicked" event notifications posted from the JS document using window.webkit.messageHandlers.buttonClicked.postMessage script message
            userController.add(self, name: "callbackHandler")
            
            if let filePath = Bundle.main.path(forResource: "Test", ofType: "html") {
                let script = String(format: filePath, locale: Locale.current)
                let userScript =  WKUserScript(source: script, injectionTime: .atDocumentEnd, forMainFrameOnly: false)
                userController.addUserScript(userScript)
            }
            
            // Configure the WKWebViewConfiguration instance with the WKUserContentController
            webCfg.userContentController = userController;
            
            return webCfg;
        }
    }
    
    override func viewDidLoad() {
        super.viewDidLoad()
        
        // Create a WKWebView instance
        webView = WKWebView (frame: self.view.frame, configuration: webConfig)
        
        // Delegate to handle navigation of web content
        webView.navigationDelegate = self
        webView.frame = self.view.frame
        webView.uiDelegate = self
        
        if #available(iOS 10.0, *) {
            webView.configuration.dataDetectorTypes = .all
        }
        view.addSubview(webView)
    }
    
    override func viewDidAppear(_ animated: Bool) {
        super.viewDidAppear(animated)
        loadBundlHtml()
    }
    
    // File Loading
    func loadBundlHtml() {
        guard let fileUrl = Bundle.main.url(forResource: "Test", withExtension: "html") else { return }
        webView.loadFileURL(fileUrl, allowingReadAccessTo: fileUrl)
    }
    
    // WKNavigationDelegate
    private func webView(webView: WKWebView, didFinishNavigation navigation: WKNavigation!) {
        NSLog("%s", #function)
    }
    
    private func webView(webView: WKWebView, didFailNavigation navigation: WKNavigation!, withError error: NSError) {
        NSLog("%s. With Error %@", #function,error)
    }
    
    // WKScriptMessageHandler Delegate
    func userContentController(_ userContentController: WKUserContentController, didReceive message: WKScriptMessage) {
        if let messageBody = message.body as? [String: Any] {
            print(messageBody)
        }
    }
}

请帮我修好这个。

共有1个答案

贺卜霸

2023-03-14

尝试以下代码将值发布到WKWeb视图

function performClick() {
     try {
           var messageBody = {type: "ClickType", value: "performClick"}
           window.webkit.messageHandlers.ports.postMessage(messageBody);
          } catch (err) {
           console.log('Card failed');
          }
    }
}

Swift代码

设置WKWebView的以下设置

webView.configuration.userContentController.add(self, name: "ports")

若要接收端口消息，请使用下面的委托方法

public func userContentController(_ userContentController: WKUserContentController, didReceive message: WKScriptMessage) {
        guard message.name == "ports" else{
            return
        }
        if let body = message.body as? NSDictionary {
            if let messageType = body["type"] as? String, messageType == "ClickType"{
                if let messages = body["value"] as? String {
                    print("messages : ", messages)
                }
            }
        }
    }

这里ClickType是要发送的类型，value是要发送的消息

类似资料：

使用javascript检测方向变化

问题内容：是否可以使用JavaScript在iPad或Galaxy Tab上检测浏览器方向的变化？我认为使用CSS媒体查询是可能的。问题答案：更新：您可能要签出 jQuery移动方向更改或普通的JS之一： MDN：较旧的答案 http://www.nczonline.net/blog/2010/04/06/ipad-web-development- tips/ iPad上的Safari
检测iOS UIDevice方向

问题内容：我需要检测设备何时处于纵向方向，以便可以触发特殊的动画。但是我不希望我的观点自动旋转。将设备旋转到纵向时，如何覆盖自动旋转的视图？我的应用程序仅需要以横向显示视图，但是如果我想能够检测到纵向旋转，似乎还需要支持纵向。问题答案：当应用程序加载或视图加载时，尝试执行以下操作：然后添加以下方法：以上内容可让您注册设备的方向更改，而无需启用视图的自动旋转。在iOS的所有情况下，当您
如何在iOS上使用Phonegap正确检测方向变化？

问题内容：我在下面找到此定向测试代码，以查找JQTouch参考资料。这可以在移动Safari上的iOS模拟器中正常运行，但在Phonegap中无法正确处理。我的项目遇到了与杀死该测试页相同的问题。有没有办法在Phonegap中使用JavaScript来感知方向变化？问题答案：这是我的工作： * 根据MDN的定义， *2019年5月更新：已弃用，大多数浏览器均不支持。该事件与window.or
使用JavaScript检测文本中的URL

问题内容：有没有人建议检测一组字符串中的URL？更新：我结束了使用此正则表达式进行链接检测……显然几年后。问题答案：首先，您需要一个与网址匹配的优质正则表达式。这很难做到。 …几乎所有内容都是有效的网址。有一些标点符号规则将其拆分。没有标点符号，您仍然有一个有效的URL。仔细检查RFC，看看是否可以构造“无效” URL。规则非常灵活。例如，一个有效的URL。路径是。漂亮的文件名，但是
使用JavaScript检测Java版本

问题内容：是否存在使用JavaScript检测客户端计算机上安装的Java版本的可靠方法？问题答案：在Java Deployment Toolkit中签出代码。
iOS检测用户是否在iPad上

问题内容：我有一个可以在iPhone和iPod Touch上运行的应用程序，可以在Retina iPad上运行，但所有其他操作都需要进行一次调整。我需要检测当前的设备是否为iPad。我可以使用什么代码来检测用户是否正在使用iPad ，然后进行相应更改？问题答案：有很多方法可以检查设备是否为iPad。这是我最喜欢的检查设备是否实际上是iPad的方法：我的使用方式其他例子
在JavaScript中使用“ weakMap.has()”方法？

本文向大家介绍在JavaScript中使用“ weakMap.has()”方法？，包括了在JavaScript中使用“ weakMap.has()”方法？的使用技巧和注意事项，需要的朋友参考一下 weakMap.has() 此方法用于查找弱映射中是否存在元素。此方法返回一个布尔值，该值指示 WeakMap对象中是否存在具有指定键的元素。如果存在该元素，则将执行true 作为输出，否则将显示fal
检测javascript中按键的最简单方法

问题内容：我有一个使用javascript进行游戏的想法（我将使用EaselJS进行开发），我将不得不检测按键。在互联网上四处浏览后，我看到了很多建议（使用window.onkeypress，使用jQuery等），但是几乎每个选项都有一个反对意见。你们有什么建议？使用jQuery听起来很容易，但实际上我没有使用该库的经验（而且我也不是JavaScript的资深人士），所以我宁愿避免使用它。如果j

在iOS中使用WWebView检测Javascript方法

共有1个答案

相关问答

相关文章

相关阅读

相关工具

相关文档