iOS App调用H5微信支付：最全解决方案

最近在原生App使用 WKWebView调用H5支付之微信支付遇到的问题总结。
1、初始化

self.webView =[[WKWebView alloc]initWithFrame:CGRectMake(0,0, SCREEN_WIDTH, SCREEN_HEIGHT) configuration:nil];

2、设置user-Agent，稍后点说明这个用处

WeakSelf
[self._webView evaluateJavaScript:@"navigator.userAgent" completionHandler:^(id _Nullable title, NSError * _Nullable error) {
        NSString *oldUserAgent = [NSString stringWithFormat:@"%@\\%@",title,@"yinxinyunUA"];
        NSString *newUserAgent = [NSString stringWithFormat:@"%@ %@",oldUserAgent,@"TheNewWordForUserAgent"];
        weakSelf._webView.customUserAgent = newUserAgent;
}];

3、设置delegate，并添加到self.view上

self._webView.navigationDelegate = self;
[self.view addSubview:self._webView];

4、要加载Url,并设置Referer，并加载

//    NSURLRequest *request;
//    request=[NSURLRequest requestWithURL:[NSURL URLWithString:self._urlString]];
//    [self._webView loadRequest:request];

NSMutableURLRequest *mrequest =[NSMutableURLRequest requestWithURL:[NSURL URLWithString:self._urlString]];
[mrequest setValue:@"yinxinyunClient.test.aoyond.cn://" forHTTPHeaderField:@"Referer"];
[self._webView loadRequest:mrequest];
[self loadData];

5、delegate,方法

- (void)webView:(WKWebView *)webView decidePolicyForNavigationAction:(WKNavigationAction *)navigationAction decisionHandler:(void (^)(WKNavigationActionPolicy))decisionHandler
{
    if(navigationAction.navigationType == WKNavigationTypeBackForward){    
    NSString * url = navigationAction.request.URL.absoluteString;
    NSString *scheme = [navigationAction.request.URL scheme];
    
    if([url rangeOfString:@"backtohome"].location != NSNotFound)
    {
        [self backToParent];
        decisionHandler(WKNavigationActionPolicyCancel);
        return;
    }

    NSURLRequest *request = navigationAction.request;

    if (![scheme isEqualToString:@"https"] && ![scheme isEqualToString:@"http"]) {
        if ([scheme isEqualToString:@"weixin"]) {//跳到微信
            BOOL canOpen = [[UIApplication sharedApplication] canOpenURL:request.URL];
            if (canOpen) {
                [[UIApplication sharedApplication] openURL:request.URL];
            }
        }
        else if([scheme isEqualToString:@"yinxinyunclient.test.aoyond.cn"]){
            NSString *resultUrl = [url stringByReplacingOccurrencesOfString:@"yinxinyunclient.test.aoyond.cn://" withString:@""];
            
            NSString *resultUrl1 = [resultUrl stringByReplacingOccurrencesOfString:@"https//" withString:@"https://"];
        
            NSMutableURLRequest *mrequest = [NSMutableURLRequest requestWithURL:[NSURL URLWithString:resultUrl1]];
            [webView loadRequest:mrequest];
            decisionHandler(WKNavigationActionPolicyCancel);
            return;
        }
    }
    decisionHandler(WKNavigationActionPolicyAllow);
}

基本的代码都在这里了。

接下来说遇到的问题
一、发现点击微信支付的时候，不会跳转到微信App。这个问题解决方法就是设置Referer。然后把设置URL schema

image.png

image.png

上面的第4步。亲测有效。但为什么要设置为yinxinyunClient.test.aoyond.cn://这个值呢。前面yinxinyunClient可以根据自己的意愿设置一个字符串。test.aoyond.cn就是H5支付的域名，由H5提供方提供，实际上也是微信支付那边注册的域名。
设置完就可以跳转的微信了。当然如果你可以直接跳转到微信请忽略。
二、微信支付完跳转到了safari浏览器，不会跳到自己的App
正常点击微信支付，往微信跳转的是的URL：https://wx.tenpay.com/cgi-bin/mmpayweb-bin/checkmweb?prepay_id=wx241144553258021b372a53b53f54d00000&package=1716194183&redirect_url=yinxinyunClient.test.aoyond.cn://https://test.aoyond.cn/qishi/index.html?id=7787087488&activityId=218&shopId=7&orderId=1732489&sign=7f5b7f5a4a017f6c3e36a925edec77bb#/h5_result

重点redirect_url=yinxinyunClient.test.aoyond.cn://这个就是能跳转回App的关键所在，这个后面的urlhttps://test.aoyond.cn/qishi/index.html?id=7787087488&activityId=218&shopId=7&orderId=1732489&sign=7f5b7f5a4a017f6c3e36a925edec77bb#/h5_result是支付结果的url
如果H5那边没有根据我们App use-agent 值改变这个跳转的url的话。一般实际的跳转微信的url是这样的https://wx.tenpay.com/cgi-bin/mmpayweb-bin/checkmweb?prepay_id=wx241144553258021b372a53b53f54d00000&package=1716194183&redirect_url=https://test.aoyond.cn/qishi/index.html?id=7787087488&activityId=218&shopId=7&orderId=1732489&sign=7f5b7f5a4a017f6c3e36a925edec77bb#/h5_result，没有了yinxinyunClient.test.aoyond.cn:// 这个就不会跳转回App。
当然我们也可以自己加上yinxinyunClient.test.aoyond.cn://

三、支付调回自己的app后显示不出来结果界面。
结果界面https://test.aoyond.cn/qishi/index.html?id=7787087488&activityId=218&shopId=7&orderId=1732489&sign=7f5b7f5a4a017f6c3e36a925edec77bb#/h5_result包含在微信跳转的url里面，但是当我们加上yinxinyunClient.test.aoyond.cn://的时候，支付完成后会自动请求

yinxinyunClient.test.aoyond.cn://https://test.aoyond.cn/qishi/index.html?id=7787087488&activityId=218&shopId=7&orderId=1732489&sign=7f5b7f5a4a017f6c3e36a925edec77bb#/h5_result

但是实际请求的时候url变了，变成了

yinxinyunClient.test.aoyond.cn://https//test.aoyond.cn/qishi/index.html?id=7787087488&activityId=218&shopId=7&orderId=1732489&sign=7f5b7f5a4a017f6c3e36a925edec77bb#/h5_result

这个时候我们需要拦截这个地址先去掉yinxinyunClient.test.aoyond.cn://然后再在https后面添加上冒号:。这就是所有支付过程中遇到的问题。

如果不明白的请联系本人，[email protected]。