WKWebView对接h5微信与支付宝支付
2021-04-14 本文已影响0人
青菜白玉堂
本文需要解决的三个问题
1.打开微信支付
2.微信支付后，无法跳转回APP
3.打开支付宝支付
遗留问题
1.本文只做了调起支付与返回app的逻辑没有处理支付完成后的逻辑。
1.支付宝支付跳转订单结果页的逻辑未处理。
设置schemes
1.在项目的Info.plist中添加一个URL Schemes（用于跳回我们项目）
2.cm.manniuhealth.com【manniuhealth.com这个域名必须和 微信H5商家后台提交的授权域名一致，不然会报[商家参数格式有误，请联系商家解决]，cm 为前缀，可任意填写】
截屏2021-04-09 下午2.34.04.png
支付有关的全部代码
- (void)webView:(WKWebView *)webView decidePolicyForNavigationAction:(WKNavigationAction *)navigationAction decisionHandler:(void (^)(WKNavigationActionPolicy))decisionHandler {
//微信支付后，无法跳转回APP【解决问题2】
NSURLRequest *request = navigationAction.request;
NSString *absoluteString = [navigationAction.request.URL.absoluteString stringByRemovingPercentEncoding];
// 拦截WKWebView加载的微信支付统一下单链接, 将redirect_url参数修改为唤起自己App的URLScheme
if ([absoluteString hasPrefix:@"https://wx.tenpay.com/cgi-bin/mmpayweb-bin/checkmweb"] && ![absoluteString containsString:[NSString stringWithFormat:@"redirect_url=cm.manniuhealth.com://"]]&&!self.isOpenWxPay) {
decisionHandler(WKNavigationActionPolicyCancel);
NSString *redirectUrl = nil;
if ([absoluteString containsString:@"redirect_url="]) {
NSRange redirectRange = [absoluteString rangeOfString:@"redirect_url"];
self.WxPayOrderResultUrl = [absoluteString substringFromIndex:redirectRange.location+13];
redirectUrl = [[absoluteString substringToIndex:redirectRange.location] stringByAppendingString:[NSString stringWithFormat:@"redirect_url=cm.manniuhealth.com://"]];
} else {
redirectUrl = [absoluteString stringByAppendingString:[NSString stringWithFormat:@"redirect_url=cm.manniuhealth.com://"]];
}
NSMutableURLRequest *newRequest = [NSMutableURLRequest requestWithURL:[NSURL URLWithString:redirectUrl] cachePolicy:NSURLRequestUseProtocolCachePolicy timeoutInterval:30];
newRequest.allHTTPHeaderFields = request.allHTTPHeaderFields;
NSLog(@"处理前的支付链接---%@",absoluteString);
NSLog(@"处理后的支付链接---%@",redirectUrl);
newRequest.URL = [NSURL URLWithString:redirectUrl];
[webView loadRequest:newRequest];
return;
}else{
//微信支付完成后，跳转入订单结果页
if (self.isOpenWxPay) {
NSMutableURLRequest *orderResultRequest = [NSMutableURLRequest requestWithURL:[NSURL URLWithString:self.WxPayOrderResultUrl] cachePolicy:NSURLRequestUseProtocolCachePolicy timeoutInterval:30];
orderResultRequest.allHTTPHeaderFields = request.allHTTPHeaderFields;
orderResultRequest.URL = [NSURL URLWithString:self.WxPayOrderResultUrl];
[webView loadRequest:orderResultRequest];
decisionHandler(WKNavigationActionPolicyAllow);
self.isOpenWxPay = false;
return;
}
}
//打开微信支付【解决问题1】
if ([navigationAction.request.URL.scheme isEqualToString:@"weixin"]) {
NSLog(@"处理后的支付链接--跳转微信支付---%@",navigationAction.request.URL.absoluteString);
self.isOpenWxPay = true;
// 2.微信支付
[[UIApplication sharedApplication] openURL:navigationAction.request.URL options:@{} completionHandler:nil];
decisionHandler(WKNavigationActionPolicyCancel);
return;
}
//打开支付宝支付【解决问题3】
if ([navigationAction.request.URL.host isEqualToString:@"mclient.alipay.com"]) {
// 1.支付宝支付
[[AlipaySDK defaultService] payInterceptorWithUrl:navigationAction.request.URL.absoluteString fromScheme:@"CMPatientZFB" callback:^(NSDictionary *resultDic) {
// 支付成功或者失败的 回调处理
}];
decisionHandler(WKNavigationActionPolicyCancel);
return;
}
decisionHandler(WKNavigationActionPolicyAllow);
}
处理微信支付的返回逻辑
因为微信h5支付有个weixin重定向中间页，不处理的话，从订单结果页返回到weixin中间页时，会再次调起微信支付。
//返回按钮事件-多层h5跳转后的判断
-(void)leftBackBtnAction{
if ([self.bgWebView canGoBack]) {
YuToolNSLog(@"backListURL数组---%ld",self.bgWebView.backForwardList.backList.count);
YuToolNSLog(@"forwardListURL数组---%ld",self.bgWebView.backForwardList.forwardList.count);
BOOL isWxpay = false;
BOOL isAppointmentResult = false;
for (int i=0; i<self.bgWebView.backForwardList.backList.count; i++) {
WKBackForwardListItem * item = self.bgWebView.backForwardList.backList[i];
NSLog(@"h5页面栈---%@",item.URL);
if ([item.URL.absoluteString containsString:@"https://wx.tenpay.com"]) {
isWxpay = true;
}
if ([item.URL.absoluteString containsString:@"redirect_url=cm.manniuhealth.com"]) {
isAppointmentResult = true;
}
if (isWxpay&&isAppointmentResult) {
if (self.bgWebView.backForwardList.backList.count>=2) {
WKBackForwardListItem * itemBack = self.bgWebView.backForwardList.backList[self.bgWebView.backForwardList.backList.count-2];
[self.bgWebView goToBackForwardListItem:itemBack];
}else{
[self.navigationController popViewControllerAnimated:YES];
}
return;
}
}
//如果有则返回
[self.bgWebView goBack];
} else {
[self.navigationController popViewControllerAnimated:YES];
}
}
处理前的支付链接
处理后的支付链接
解释
必须为格式 cm.manniuhealth.com:// 用来解决微信支付后，无法回到app的问题，如何配置在文章开头
redirect_url=https://member-test.manniuhealth.com/h5-appointment/appointmentResult?orderId=84044138093326399&isShow=true&order_no=CCPE84044148715630621&amount=3000&channel=wechat_wap&txnmode=1后跟的是订单结果页，支付调起后，回到app时需要跳转该页面
