WKWebView对接h5微信与支付宝支付

本文需要解决的三个问题

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];
    }
}

处理前的支付链接

https://wx.tenpay.com/cgi-bin/mmpayweb-bin/checkmweb?prepay_id=wx09141320308058d028ca6427cebcd60000&package=2761507236&redirect_url=https://member-test.manniuhealth.com/h5-appointment/appointmentResult?orderId=84044138093326399&isShow=true&order_no=CCPE84044148715630621&amount=3000&channel=wechat_wap&txnmode=1

处理后的支付链接

https://wx.tenpay.com/cgi-bin/mmpayweb-bin/checkmweb?prepay_id=wx09141320308058d028ca6427cebcd60000&package=2761507236&redirect_url=cm.manniuhealth.com://

解释

必须为格式 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时需要跳转该页面

©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 217,185评论 6 503
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 92,652评论 3 393
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 163,524评论 0 353
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 58,339评论 1 293
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 67,387评论 6 391
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 51,287评论 1 301
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 40,130评论 3 418
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 38,985评论 0 275
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 45,420评论 1 313
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 37,617评论 3 334
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 39,779评论 1 348
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 35,477评论 5 345
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 41,088评论 3 328
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 31,716评论 0 22
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 32,857评论 1 269
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 47,876评论 2 370
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 44,700评论 2 354

推荐阅读更多精彩内容

  • 今天感恩节哎,感谢一直在我身边的亲朋好友。感恩相遇!感恩不离不弃。 中午开了第一次的党会,身份的转变要...
    迷月闪星情阅读 10,564评论 0 11
  • 彩排完,天已黑
    刘凯书法阅读 4,217评论 1 3
  • 表情是什么,我认为表情就是表现出来的情绪。表情可以传达很多信息。高兴了当然就笑了,难过就哭了。两者是相互影响密不可...
    Persistenc_6aea阅读 125,004评论 2 7