iOS WKWebView实现H5跳转微信支付,并返回原APP

最近做的一个需求,实现H5界面跳转微信支付功能,尽管官方不推荐用这种方法,但有时候需求并不是我们程序员能说的算,So就这样入坑了。如果有条件还是用APP跳转支付吧,坑比较少,官方文档写的很详细。这篇文章仅为自己总结下来之不易的成果,如有错误的地方,欢迎指点。

一、H5跳转微信支付

说白点就是应用间的跳转,用openURL。
WKWebView的navigationDelegate代理方法拦截URL

#pragma mark - WKNavigationDelegate
- (void)webView:(WKWebView *)webView decidePolicyForNavigationAction:(nonnull WKNavigationAction *)navigationAction decisionHandler:(nonnull void (^)(WKNavigationActionPolicy))decisionHandler {

    WKNavigationActionPolicy actionPolicy = WKNavigationActionPolicyAllow;
    // 拦截的url字符串
    NSString *urlString = navigationAction.request.URL.absoluteString;
    urlString = [urlString stringByRemovingPercentEncoding];

    // 判断是否为支付链接,可能会加载多个链接,只有包含"weixin://wap/pay?"才是可以跳转微信APP的链接,注意应用间跳转关键的scheme:"weixin://"
    if([urlString containsString:@"weixin://wap/pay?"]) {
        actionPolicy = WKNavigationActionPolicyCancel; // 不允许webView加载

        // 判断是否安装微信
        if (![[UIApplication sharedApplication] canOpenURL:[NSURL URLWithString:@"weixin://"]]) {
            UIAlertController *alertVC = [UIAlertController alertControllerWithTitle:@"提示" message:@"未检测到微信客户端,请安装后重试" preferredStyle:UIAlertControllerStyleAlert];
            UIAlertAction *sureAction = [UIAlertAction actionWithTitle:@"确定" style:UIAlertActionStyleDefault handler:^(UIAlertAction * _Nonnull action) {
                [self.navigationController popViewControllerAnimated:YES];
            }];
            [alertVC addAction:sureAction];
            [self presentViewController:alertVC animated:YES completion:nil];
            
            decisionHandler(actionPolicy);
            return;
        }

        // 跳转微信进行支付
        if (@available(iOS 10.0, *)) { // 10.0以上的版本
            if([[UIApplication sharedApplication] respondsToSelector:@selector(openURL:options:completionHandler:)]) {
                [[UIApplication sharedApplication] openURL:url options:@{UIApplicationOpenURLOptionUniversalLinksOnly: @NO} completionHandler:nil];
            }
        } else { // 10.0以下的版本
            if ([[UIApplication sharedApplication] respondsToSelector:@selector(openURL:)]) {
                [[UIApplication sharedApplication] openURL:url];
            }
        }
    }
    // 必须加的一行代码,不然会Crash
    decisionHandler(actionPolicy);
}

二、微信APP跳转回原APP

跳转到微信APP比较容易,但你会惊奇的发现,在你点击左上角的取消按钮或完成支付之后,微信APP跳转的是Safari浏览器,而不是从哪来回哪去的跳转回原APP(注意:取消按钮上面有一个返回原APP的按钮,在一个应用上打开另一个应用都会出现。点击就直接返回原APP了,但不会调用微信支付的回调链接,就是回到上一个APP,没有其他操作了)。这个跟后端给我们的加载链接有关系,在加载包含“weixin://wap/pay?”的微信跳转链接之前,还会加载一个类似清单的链接(参数包含了支付ID之类的,当然还有最重要的回调链接)。链接长如图这样:

图片.png

我们要做的就是修改回调链接redirect_url这个参数,如果没有这个参数,可以直接拼接,微信支付取消和支付完成都会调用redirect_url这个参数里面的链接。

1.设置Schemes,Info->URL Types
格式为:www.xxxx.com,注意:www.xxxx.com 此域名是H5授权的域名,如果是二级域名,可以写成:aaa.xxxx.com(aaa随便写)。可以直接问申请微信支付的人要。

E12D8BBE-FBBC-4FBB-B4FB-B1C6E9F2D6E9.png

2.修改redirect_url这个参数
目的是保证redirect_url这个回调链接能跟设置的URL Schemes一致。
比如:URL Schemes为www.company.com(瞎写的),则redirect_url=www.company.com://www.baidu.com
按以上格式设置,(这段代码我处理的比较渣,哈哈哈,就不给大家看了。)

3.设置webView请求header中的Referer字段,微信支付结束后默认回调Referer字段中地址。
Referer设置为www.company.com://,这样的格式。

    #pragma mark - WKNavigationDelegate
- (void)webView:(WKWebView *)webView decidePolicyForNavigationAction:(nonnull WKNavigationAction *)navigationAction decisionHandler:(nonnull void (^)(WKNavigationActionPolicy))decisionHandler 

    // 修改参数 redirect_url的方法
    .....(这个就不贴了,换成这种格式redirect_url=www.company.com://www.baidu.com,修改完后调用 [webView loadRequest:request];)
    注意:做个判断redirect_url修改过后就直接跳过,不用再调用[webView loadRequest:request];
  
    // 设置webView的头部参数Referer
    if (!navigationAction.request.allHTTPHeaderFields[@"Referer"]) {
        NSMutableURLRequest *request = [NSMutableURLRequest requestWithURL:navigationAction.request.URL];
        [request setValue:@"wechat.baiwanmeng.com://" forHTTPHeaderField:@"Referer"];
        [webView loadRequest:request];
    }

    // 打开微信
    if([urlString containsString:@"weixin://wap/pay?"]) {
        ..... (上面贴的代码)
    }

到这里,应该就已经可以实现在微信支付界面点击取消按钮或者完成支付后会跳转回原APP。(每个人的代码或者逻辑都不一样。如果您还不能跳回原APP,我们可以一起探讨,若您有更优秀的代码或方法,也可以跟我分享下,谢谢!!)

三、结尾

跳转回原APP后,在Appdelegate.m文件中会有回调方法。在方法里,可以写一些其他的逻辑代码。

// 仅支持iOS9以上系统,iOS8及以下系统不会回调
- (BOOL)application:(UIApplication *)app openURL:(NSURL *)url options:(NSDictionary<UIApplicationOpenURLOptionsKey, id> *)options {
    //6.3的新的API调用,是为了兼容国外平台的调用[如果用6.2的api调用会没有回调],对国内平台没有影响
    BOOL result = [[UMSocialManager defaultManager]  handleOpenURL:url options:options];
    if (!result) {
        // 其他如支付等SDK的回调
        
        // H5微信支付的回调
        if ([url.scheme isEqualToString:@"www.xxxx.com"]) {
            // 发送通知加载页面
            [[NSNotificationCenter defaultCenter] postNotificationName:kWeChatComeBackKey object:nil userInfo:@{@"url" : url.absoluteString}];
        }
    }
    return result;
}

就这样吧!!!

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

推荐阅读更多精彩内容