微信H5支付流程
1、發起下單請求(調用統一下單接口)注:交易類型trade_type=MWEB
2、統一下單接口返回支付相關參數給商戶后臺,如支付跳轉url(參數名“mweb_url”),商戶通過mweb_url調起微信支付中間頁。如:https://wx.tenpay.com/cgi-bin/mmpayweb-bin/checkmweb?prepay_id=wx27142704550165900edae5270331515985&package=600759311&redirect_url=http%3a%2f%2www.baidu.com
3、中間頁進行H5權限的校驗,安全性檢查(具體錯誤見微信官方文檔)
4、如果權限校驗成功,微信支付中間頁會發起支付請求。請求完畢跳到回調頁面(由redirect_url決定)。APP需要在webView中監聽這個請求,打開微信進行支付。如:weixin://wap/pay?prepayid%3Dwx2718114258281033efb8751f1574826586&package=2965581453&noncestr=1545905512&sign=cb0f6dbd067549a04aada9c3eef09aac
5、微信支付完畢跳回APP。
Referer和redirect_url說明
HTTP Referer是header的一部分,當瀏覽器向web服務器發起請求的時,一般會帶上Referer,告訴服務器我是從哪個頁面鏈接過來。微信中間頁會對Referer進行校驗,非安全域名將不能正常加載。
redirect_url是微信中間頁喚起微信支付之后,頁面重定向的地址。中間頁喚起微信支付后會跳轉到指定的redirect_url。并且微信APP在支付完成時,也是通過redirect_url回調結果,redirect_url一般是一個頁面地址,所以微信支付完成會打開Safari瀏覽器。本文通過修改redirect_url,實現微信支付完畢跳回當前APP。
注意:微信會校驗Referer(來源)和redirect_url(目標)是否是安全域名。如果不傳redirect_url,微信會將Referer當成redirect_url,喚起支付之后會重定向到Referer對應的頁面。
建議帶上redirect_url。
代碼實現
1、info.plist配置scheme
需要將微信H5支付的安全域名配置成scheme,微信支付完成會通過這個scheme跳轉回APP。
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
|
< key >CFBundleURLTypes</ key > < array > < dict > < key >CFBundleTypeRole</ key > < string >Editor</ string > < key >CFBundleURLName</ key > < string >wxPay</ string > < key >CFBundleURLSchemes</ key > < array > < string >微信scheme(安全域名)</ string > </ array > </ dict > </ array > < key >LSApplicationQueriesSchemes</ key > < array > < string >wechat</ string > < string >weixin</ string > </ array > |
2、攔截微信中間頁,截取redirect_url
再shouldStartLoadWithRequest:方法里面攔截微信中間頁(以“https://wx.tenpay.com”開頭的請求),截取redirect_url,如果redirect_url已經被替換成scheme不攔截,如果沒有被替換,攔截請求,保存當前的redirect_url。創建一個新的微信中間頁請求,將redirect_url替換成“安全域名://”(微信支付完畢會通過openURL打開當前APP,如果不替換redirect_url,微信支付完畢會打開Safari瀏覽器。)。設置“Referer”為安全域名(微信會校驗Referer,不是安全域名會加載失敗),重新load請求。
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
|
//這個referer和安全域名以及配置在info.plist中scheme一致 NSString *referer = [NSString stringWithFormat:@ "%@://" ,wxScheme]; if ([newUrl rangeOfString:@ "https://wx.tenpay.com" ].location != NSNotFound) { //截取redirect_url對應的值 NSDictionary *params = [HJStringHelper getUrlParam:newUrl]; NSString *backUrl = params[@ "redirect_url" ]; if ([backUrl isEqualToString:referer]) { //截取redirect_url被替換成referer,不攔截 return YES; } else { //記錄當前的redirectUrl,并攔截請求 self.redirectUrl = [HJStringHelper decodeURL:backUrl]; dispatch_async(dispatch_get_main_queue(), ^{ NSRange range = [newUrl rangeOfString:@ "redirect_url=" ]; NSString *reqUrl; if (range.length>0) { reqUrl = [newUrl substringToIndex:range.location+range.length]; reqUrl = [reqUrl stringByAppendingString:referer]; } else { reqUrl = [newUrl stringByAppendingString:[NSString stringWithFormat:@ "&redirect_url=%@" ,referer]]; } NSMutableURLRequest* request = [NSMutableURLRequest requestWithURL:[NSURL URLWithString:reqUrl] cachePolicy:NSURLRequestUseProtocolCachePolicy timeoutInterval:60.0]; //設置授權域名 [request setValue:referer forHTTPHeaderField:@ "Referer" ]; [self.webView loadRequest:request]; }); return NO; } } |
2、攔截微信中間頁中打開微信請求
微信中間頁加載成功后,會收到一個打開微信的請求,用openURL:打開這個url實現跳轉到微信支付。
1
2
3
4
5
6
7
8
9
10
11
|
if ([newUrl rangeOfString:@ "weixin://wap/pay" ].location != NSNotFound){ if ([[UIApplication sharedApplication] canOpenURL:url]) { [[UIApplication sharedApplication] openURL:url options:@{} completionHandler:nil]; } else { [[UIApplication sharedApplication] openURL:url]; } } else { } return NO; } |
3、加載重定向地址
微信中間頁跳轉到微信時,會將頁面從定向到redirect_url,由于redirect_url被我們修改為scheme,所以需要攔截這個非法的scheme請求,替換成記錄下的redirect_url。
1
2
3
4
5
6
7
8
9
10
11
12
13
|
if ([newUrl isEqualToString:referer]){ dispatch_async(dispatch_get_main_queue(), ^{ if (self.redirectUrl) { //注意,這個地方需要對redirectUrl解碼,因為截取的redirectUrl被完全編碼了,需要先解碼才能加載 self.redirectUrl = [HJStringHelper decodeURL:self.redirectUrl]; NSMutableURLRequest* request = [NSMutableURLRequest requestWithURL:[NSURL URLWithString:[HJStringHelper encodeURL:self.redirectUrl]] cachePolicy:NSURLRequestUseProtocolCachePolicy timeoutInterval:60.0]; [self.webView loadRequest:request]; self.redirectUrl = nil; } }); return NO; } |
完整代碼如下
以UIWebView為例
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
|
-( BOOL )webView:(UIWebView *)webView shouldStartLoadWithRequest:(NSURLRequest *)request navigationType:(UIWebViewNavigationType)navigationType{ //添加微信支付功能 NSURL *url = [request URL]; NSString *newUrl = url.absoluteString; //獲取微信安全域名 NSString *wxScheme = [h5WXPayScheme copy]; if (wxScheme.length>0) { //使用安全域名拼接referer NSString *referer = [NSString stringWithFormat:@ "%@://" ,wxScheme]; if ([newUrl rangeOfString:@ "https://wx.tenpay.com" ].location != NSNotFound) { NSDictionary *params = [HJStringHelper getUrlParam:newUrl]; NSString *backUrl = params[@ "redirect_url" ]; if ([backUrl isEqualToString:referer]) { return YES; } else { self.redirectUrl = [HJStringHelper decodeURL:backUrl]; dispatch_async(dispatch_get_main_queue(), ^{ NSRange range = [newUrl rangeOfString:@ "redirect_url=" ]; NSString *reqUrl; if (range.length>0) { reqUrl = [newUrl substringToIndex:range.location+range.length]; reqUrl = [reqUrl stringByAppendingString:referer]; } else { reqUrl = [newUrl stringByAppendingString:[NSString stringWithFormat:@ "&redirect_url=%@" ,referer]]; } NSMutableURLRequest* request = [NSMutableURLRequest requestWithURL:[NSURL URLWithString:reqUrl] cachePolicy:NSURLRequestUseProtocolCachePolicy timeoutInterval:60.0]; //設置授權域名 [request setValue:referer forHTTPHeaderField:@ "Referer" ]; [self.webView loadRequest:request]; }); return NO; } } else if ([newUrl rangeOfString:@ "weixin://wap/pay" ].location != NSNotFound){ if ([[UIApplication sharedApplication] canOpenURL:url]) { if (@available(iOS 10.0, *)){ [[UIApplication sharedApplication] openURL:url options:@{} completionHandler:nil]; } else { [[UIApplication sharedApplication] openURL:url]; } } else { } return NO; } else if ([newUrl isEqualToString:referer]){ dispatch_async(dispatch_get_main_queue(), ^{ if (self.redirectUrl) { self.redirectUrl = [HJStringHelper decodeURL:self.redirectUrl]; NSMutableURLRequest* request = [NSMutableURLRequest requestWithURL:[NSURL URLWithString:[HJStringHelper encodeURL:self.redirectUrl]] cachePolicy:NSURLRequestUseProtocolCachePolicy timeoutInterval:60.0]; [self.webView loadRequest:request]; self.redirectUrl = nil; } }); return NO; } } return [super webView:webView shouldStartLoadWithRequest:request navigationType:navigationType]; } |
還有一篇文章講的是H5支付封裝,H5支付不僅可以在網頁上使用,原生也可以調用。具體內容見:iOS-H5支付(微信、支付寶)原生封裝
到此這篇關于iOS APP實現微信H5支付示例總結的文章就介紹到這了,更多相關iOS APP實現微信H5支付內容請搜索服務器之家以前的文章或繼續瀏覽下面的相關文章希望大家以后多多支持服務器之家!
原文鏈接:https://www.jianshu.com/p/65979e8bf251