Vue H5 与 APP 交互 （IOS为例）

Swift与H5交互：Swift与JS方法互调

前言
最近做了一个Vue H5页面内嵌APP的的项目，需要进行双方交互的问题，查阅过很多资料博客，细节请自行查阅资料

H5调用IOS的方法

在IOS： swift中WKWebView 的 userContentController属性是专门用来监听JS调用方法的，而userContentController的类WKUserContentController中，有一个专门监听JS方法句柄的方法
WKScriptMessageHandler是需要设置的代理，一般是WebView所在的控制器，name就是JS的方法句柄。

在H5： window.webkit.messageHandlers.name.postMessage(argument);
Name: 就是与IOS约定的方法
argument： 传递给IOS 的数据字符串格式的

IOS调用H5的方法

h5 在Window中定义好方法 window.H5Func = function() { return "这是h5返回的数据" }

IOS 可以直接调用H5的方法获取到数据

IOS传递数据给H5

app需要写的代码

let param = ["uid":GYUserInfo.user_uid()!, "token":GYUserInfo.user_token()!]
            let data = try? JSONSerialization.data(withJSONObject: param, options: JSONSerialization.WritingOptions.prettyPrinted)
            let jsonString = String.init(data: data!, encoding: String.Encoding.utf8)
            let js = "userInfo = \(jsonString!)"
            let script = WKUserScript.init(source: js, injectionTime: WKUserScriptInjectionTime.atDocumentStart, forMainFrameOnly: true)
            configuration.userContentController.addUserScript(script)

H5接收

window.iOSInfo
let iOSInfo = JSON.parse(JSON.stringify(window.iOSInfo));
// iOSInfo. username  iOSInfo. token iOSInfo.avatar