公司做微信和支付寶支付時(shí)采用了h5的方式。我是使用swift開發(fā)的镀虐，所以選擇使用WKWebView箱蟆。
1.使用webview必然會(huì)有js交互沟绪。就會(huì)使用到evaluateJavaScript為h5傳參數(shù)刮便。
2.做h5支付寶支付的時(shí)候，我們必須使用到WKWebView這個(gè)代理方法绽慈，就是一個(gè)截取navigationAction.request.url?.scheme的值為alipay恨旱。這個(gè)是我們進(jìn)行app間跳轉(zhuǎn)的URLScheme辈毯，通過白名單跳轉(zhuǎn)。當(dāng)然支付完成后我們也需要返回到自己的app 中搜贤。在獲取alipay的網(wǎng)址中會(huì)有一個(gè)fromAppUrlScheme字段谆沃，這個(gè)就是我們app自己的URLScheme。直接上代碼仪芒。
func webView(_ webView: WKWebView, decidePolicyFor navigationAction: WKNavigationAction, decisionHandler: @escaping (WKNavigationActionPolicy) -> Void){
let urlScheme = navigationAction.request.url?.scheme ?? ""
let urlStr = navigationAction.request.url?.absoluteString ?? ""
if urlScheme == "alipay"{
UIApplication.shared.open(handleAlipayUrl(url: URL.init(string: urlStr)!)!, options: [:]) { (bo) in
}
print("dsfsdf ====\(urlScheme) ======\(urlStr)")
decisionHandler(WKNavigationActionPolicy.cancel)
}
else{
decisionHandler(WKNavigationActionPolicy.allow)
}
}
fileprivate func handleAlipayUrl(url: URL) -> URL? {
if url.absoluteString.hasPrefix("alipay://alipayclient/") {
// 更換scheme
var decodePar = url.query ?? ""
decodePar.urlDecode()
var dict = ValidateManager.jsonToDictionary(jsonString: decodePar)
dict["fromAppUrlScheme"] = "myappScheme"
if let strData = try? JSONSerialization.data(withJSONObject: dict , options: []) {
var param = String(data: strData, encoding: .utf8)
param?.urlEncode()
let finalStr = "alipay://alipayclient/?\(param ?? "")"
if let finalUrl = URL(string: finalStr) {
return finalUrl
}
}
return url
}
return nil
}
2.微信的比較坑吧唁影，第一個(gè)坑就是支付完成后會(huì)跳轉(zhuǎn)到Safari瀏覽器中，第二個(gè)坑是不會(huì)有支付回調(diào)掂名。先解決第一個(gè)坑吧据沈，就是先要根據(jù)支付域名設(shè)置自己APP的URLScheme，這樣的話就可以在支付完成后返回到的我們自己的app中饺蔑，當(dāng)然需要在APPdelegate中處理這個(gè)回調(diào)锌介。
func webView(_ webView: WKWebView, decidePolicyFor navigationAction: WKNavigationAction, decisionHandler: @escaping (WKNavigationActionPolicy) -> Void) {
let urlScheme = navigationAction.request.url?.scheme ?? ""
let urlStr = navigationAction.request.url?.absoluteString ?? ""
if urlScheme == "weixin"{
if UIApplication.shared.canOpenURL(URL.init(string: urlStr)!){
UIApplication.shared.open(URL.init(string: urlStr)!, options: [:]) { (bo) in
}
print("dsfsdf ====\(urlScheme) ======\(urlStr)")
decisionHandler(WKNavigationActionPolicy.cancel)
}else{
let url = URL.init(string: PayUrl)
let request = NSURLRequest(url: url!)
//加載請(qǐng)求
webView.load(request as URLRequest)
let alert = JLAlertView.init(title: "溫馨提示", detailText: "請(qǐng)先現(xiàn)在微信客戶端", customView: nil, cancelButtonTitle: "取消", otherButtonTitles: ["去下載"])
alert?.show({ (index) in
if index == 1{
UIApplication.shared.open(URL.init(string: "https://apps.apple.com/cn/app/wei-xin/id414478124")!, options: [:]) { (bo) in
}
}
})
decisionHandler(WKNavigationActionPolicy.allow)
}
}else{
if urlStr.range(of: "https://wx.tenpay.com/cgi-bin/mmpayweb-bin/checkmweb") != nil && !self.isload{
let array : Array = urlStr.components(separatedBy: "redirect_url=")
self.redirect_url = array[1]
let rs = "******.cn://".urlDecoded
let mNewUrl = array[0] + "redirect_url=\(rs)"
let newURLS = URL(string: mNewUrl)
var mRequest = URLRequest.init(url: newURLS!, cachePolicy: .useProtocolCachePolicy, timeoutInterval: 60)
mRequest.setValue("******.cn://", forHTTPHeaderField: "Referer")
webView.load(mRequest)
self.isload = true
decisionHandler(WKNavigationActionPolicy.cancel)
return
}
self.isload = false
decisionHandler(WKNavigationActionPolicy.allow)
}
}
3.js調(diào)用原生方法這個(gè)就需要使用到WKWebview中WKUserScript和WKScriptMessageHandler的代理方法。我使用的最笨的方案猾警，因?yàn)榍岸藳]有時(shí)間處理孔祸，我只能通過頁面控件的id進(jìn)行處理點(diǎn)擊事件。
let baiduButtonId = "back"
let baiduMessage = "jsCallIOS"
let scriptStr = "function fun(){window.webkit.messageHandlers.\(baiduMessage).postMessage(\"\(baiduButtonId)\");}(function(){var btn=document.getElementById(\"\(baiduButtonId)\");btn.addEventListener('click',fun,false);}());"
let userScript = WKUserScript(source: scriptStr, injectionTime: .atDocumentEnd, forMainFrameOnly: true)
let baiduButtonId1 = "back2"
let baiduMessage1 = "jsCallIOS"
let scriptStr1 = "function fun(){window.webkit.messageHandlers.\(baiduMessage1).postMessage(\"\(baiduButtonId1)\");}(function(){var btn=document.getElementById(\"\(baiduButtonId1)\");btn.addEventListener('click',fun,false);}());"
let userScript1 = WKUserScript(source: scriptStr1, injectionTime: .atDocumentEnd, forMainFrameOnly: true)
webView.configuration.userContentController.addUserScript(userScript1)
webView.configuration.userContentController.addUserScript(userScript)
webView.configuration.userContentController.add(self, name: baiduMessage)
func userContentController(_ userContentController: WKUserContentController, didReceive message: WKScriptMessage) {
print(message.body)
let mess = message.body as! String
if mess == "back" {
}
if mess == "back2" {
}
}
4.為webview添加加載進(jìn)度條和獲取標(biāo)題 在viewDidLoad中添加
webView.addObserver(self, forKeyPath: "title", options: .new, context: nil)
webView.addObserver(self, forKeyPath: "estimatedProgress", options: .new, context: nil)
實(shí)現(xiàn)觀察方法
//添加觀察者方法
override func observeValue(forKeyPath keyPath: String?, of object: Any?, change: [NSKeyValueChangeKey : Any]?, context: UnsafeMutableRawPointer?) {
//設(shè)置進(jìn)度條
if keyPath == "estimatedProgress"{
progressView.alpha = 1.0
progressView.setProgress(Float(webView.estimatedProgress), animated: true)
if webView.estimatedProgress >= 1.0 {
UIView.animate(withDuration: 0.3, delay: 0.1, options: .curveEaseOut, animations: {
self.progressView.alpha = 0
}, completion: { (finish) in
self.progressView.setProgress(0.0, animated: false)
})
}
}
//重設(shè)標(biāo)題
else if keyPath == "title" {
self.title = self.webView.title
}
}
