解決iOS微信H5支付跳轉微信後不返回App問題(Swift-WKWebview)(轉)

  • 問題分析

    正常的H5支付流程以下git

     

    按照上面的支付流程會出現 App -> 微信 -> 支付 -> 點擊 完成 -> safari訪問redirect_url設置的URL,這種流程其實用戶體驗是有點糟糕的,咱們指望是 App -> 微信 -> 支付 -> 點擊 完成 -> App訪問redirect_url設置的URLgithub

     

     

    問題分析到上面已經很是明瞭了,無非就是攔截處理,下面講講具體的實施。web

  • 問題分析

    根據上面的分析解決的思路應該很是的清晰

     

     

    攔截請求

    首先在decidePolicyFor 回調裏攔截支付的請求攔截的字符串:https://wx.tenpay.com/cgi-bin/mmpayweb-bin/checkmweb 若是包含了該連接作以下處理,isload變量是控制是不是第一次沒有修改redirect_url參數的請求防止重複請求微信

    if urlString?.range(of: "https://wx.tenpay.com/cgi-bin/mmpayweb-bin/checkmweb") != nil && !self.isload{
          if let mUrlStr = urlString{
              let array : Array = mUrlStr.components(separatedBy: "redirect_url=")
              self.redirect_url =  array[1]
              let rs = "\(WXH5SchemeURL)://".urlEncoded()
              let mNewUrl = array[0] + "redirect_url=\(rs)"
              let newURLS = URL(string: mNewUrl)
              var mRequest = URLRequest.init(url: newURLS!, cachePolicy: .useProtocolCachePolicy, timeoutInterval: 60)
              mRequest.setValue("\(WXH5SchemeURL)://", forHTTPHeaderField: "Referer")
              webView.load(mRequest)
              self.isload = true
              decisionHandler(.cancel)
              return
          }
      }
      self.isload = false
      decisionHandler(.allow)
      }
    複製代碼

    攔截weixin://wap/pay? 打開微信

    if urlString?.range(of: "weixin://wap/pay?") != nil{
          if let mUrlStr = urlString{
              let openWX = URL(string: mUrlStr)
              if (UIApplication.shared.canOpenURL(openWX!)){
                  if #available(iOS 10.0, *){
                      UIApplication.shared.open(openWX!, options: [UIApplicationOpenSettingsURLString:false], completionHandler: nil)
                  }else{
                      UIApplication.shared.openURL(openWX!)
                  }
              }
              decisionHandler(.cancel)
              return
          }
      }
    複製代碼

    這一步的話沒甚好介紹的就是攔截打開微信支付便可。ide

    在項目設置Scheme連接用於支付完後返回App

    具體操做以下圖post

     

     

    到這一步已經成功了一大半了,你會發現如今支付成功後能返回App了可是返回的時候webView是白屏。白屏其實就是網頁沒有任何請求致使的,接下來咱們就要使用上步提早記錄好後臺給的redirect_url的url了。微信支付

    在AppDelegate裏監聽url.scheme的值

    在AppDelegate裏監聽url.scheme的值是否爲咱們以前設置好的xxxx.com 若是是xxxx.com 發起通知 通知webview加載提早記錄好的redirect_url的url了url

    if ([url.scheme rangeOfString:@"quanzidian.net"].length!=0) {
      	[NSNotificationCenter defaultCenter] postNotificationName:@"WX_H5_PAY" object:nil];
      	return YES;
      }
    複製代碼

    在wkWebView接收通知spa

    NotificationCenter.default.addObserver(self, selector: #selector(goBackWhitWXPay), name: NSNotification.Name(rawValue: "WX_H5_PAY"), object: nil)
    複製代碼

    從新刷新WKWebview.net

    @objc func goBackWhitWXPay(){
      	if !self.redirect_url.isEmpty{
          	self.request = URLRequest(url: URL(string: self.redirect_url)!)
          	redirect_url = ""
      	}
      }
    複製代碼

    項目使用的oc/Swift 混編有些地方和你使用的語言不一致時請自行模仿作寫。

    到這裏微信H5支付全部的問題就完美解決了 惟一的坑就是在截取請求時,重寫redirect_url時注意必定時受權的URL://的協議。

    更多詳情請訪問https://siterzzz.github.io

 
 
 
 
做者:Siter 連接:https://juejin.im/post/5b45af6ae51d45198e7217fd
相關文章
相關標籤/搜索