[swift]-使用JavaScript解决WKWebView没法发送POST参数问题

时间 2019-11-07

标签 swift 使用 javascript 解决 wkwebview 没法发送 post 参数问题栏目 Swift 繁體版

原文原文链接

基本实现思路:html

将一个包含JavaScript的POST请求的HTML代码放到工程目录中
加载这个包含JavaScript的POST请求的代码到WKWebView
加载完成以后，用Native调用JavaScript的POST方法并传入参数来完成请求
建立包含JavaScript的POST请求的HTML代码

相关代码：web

<html>
 <head>
     <script>
         //调用格式： post('URL', {"key": "value"});
         function post(path, params) {
             var method = "post";
             var form = document.createElement("form");
             form.setAttribute("method", method);
             form.setAttribute("action", path);

             for(var key in params) {
                 if(params.hasOwnProperty(key)) {
                     var hiddenField = document.createElement("input");
                     hiddenField.setAttribute("type", "hidden");
                     hiddenField.setAttribute("name", key);
                     hiddenField.setAttribute("value", params[key]);

                     form.appendChild(hiddenField);
                 }
             }
             document.body.appendChild(form);
             form.submit();
         }
     </script>
 </head>
 <body>
 </body>
</html>

将这段代码拷贝下来，而后粘贴到文本编辑器中，名字能够随意起，好比保存为：JSPOST.html，而后拷贝到工程目录中，记得选择对应的Target和勾选Copy items if needed（默认应该是勾选的）。这时候，就能够用这段JavaScript代码来发送带参数的POST请求了。swift

将对应的JavaScript代码经过加载本地网页的形式加载到WKWebViewapp

=======OC代码：=======编辑器

// JS发送POST的Flag，为真的时候会调用JS的POST方法（仅当第一次的时候加载本地JS） self.needLoadJSPOST = YES;post

// 建立WKWebViewlua

self.webView = [[WKWebView alloc] initWithFrame:[UIScreen mainScreen].bounds];url

//设置代理代理

self.webView.navigationDelegate = self;code

// 获取JS所在的路径

NSString *path = [[NSBundle mainBundle] pathForResource:@"JSPOST" ofType:@"html"];

// 得到html内容

NSString *html = [[NSString alloc] initWithContentsOfFile:path encoding:NSUTF8StringEncoding error:nil];

// 加载js

[self.webView loadHTMLString:html baseURL:[[NSBundle mainBundle] bundleURL]];

// 将WKWebView添加到当前View

[self.view addSubview:self.webView];

======Swift代码：=======

// JS发送POST的Flag，为真的时候会调用JS的POST方法（仅当第一次的时候加载本地JS）

needLoadJSPOST = true

// 建立WKWebView

webView = WKWebView(frame: UIScreen.mainScreen().bounds)

//设置代理

webView.navigationDelegate = self

// 获取JS路径

let path = NSBundle.mainBundle().pathForResource("JSPOST", ofType: "html")

// 得到html内容

do {

    let html = try String(contentsOfFile: path!, encoding: NSUTF8StringEncoding)
    // 加载js
    webView.loadHTMLString(html, baseURL: NSBundle.mainBundle().bundleURL)
} catch { }

// 将WKWebView添加到当前View

view.addSubview(webView)

这段代码就至关于把工程中的JavaScript脚本加载到WKWebView中了，后面就是看怎么用了。（请注意换成您的文件名）

Native调用JavaScript脚本并传入参数来完成POST请求

还记得 WKWebView和JavaScript的交互这一节嘛？如今该Native调用JavaScript了，若是忘记了，请往前翻温故一下：- webView:didFinishNavigation:代理代表页面已经加载完成，咱们在这里操做，下面上代码：

=======OC代码：=======

// 加载完成的代理方法

- (void)webView:(WKWebView *)webView didFinishNavigation:(WKNavigation *)navigation {
    // 判断是否须要加载（仅在第一次加载）
    if (self.needLoadJSPOST) {
        // 调用使用JS发送POST请求的方法
        [self postRequestWithJS];
        // 将Flag置为NO（后面就不须要加载了）
        self.needLoadJSPOST = NO;
    }
}

// 调用JS发送POST请求
- (void)postRequestWithJS {
    // 发送POST的参数
    NSString *postData = @"\"username\":\"aaa\",\"password\":\"123\"";
    // 请求的页面地址
    NSString *urlStr = @"http://www.postexample.com";
    // 拼装成调用JavaScript的字符串
    NSString *jscript = [NSString stringWithFormat:@"post('%@', {%@});", urlStr, postData];

    // NSLog(@"Javascript: %@", jscript);
    // 调用JS代码
    [self.webView evaluateJavaScript:jscript completionHandler:^(id object, NSError * _Nullable error) {

    }];
}

=======Swift代码：=======

// 加载完成的代理方法

func webView(webView: WKWebView, didFinishNavigation navigation: WKNavigation!) {
    // 判断是否须要加载（仅在第一次加载）
    if needLoadJSPOST {
        // 调用使用JS发送POST请求的方法
        postRequestWithJS()
        // 将Flag置为NO（后面就不须要加载了）
        needLoadJSPOST = false
    }
}
// 调用JS发送POST请求
func postRequestWithJS() {
    // 发送POST的参数
    let postData = "\"username\":\"aaa\",\"password\":\"123\""
    // 请求的页面地址
    let urlStr = "http://www.postexample.com"
    // 拼装成调用JavaScript的字符串
    let jscript = "post('\(urlStr)', {\(postData)});"
    // 调用JS代码
    webView.evaluateJavaScript(jscript) { (object, error) in

    }
}

结束.