微信支付詳細開發步驟（公眾號支付及掃碼支付）

微信支付是集成在微信客戶端的支付功能，用戶可以通過手機完成快速的支付流程。微信支付以綁定銀行卡的快捷支付為基礎，向用戶提供安全、快捷、高效的支付服務。

• 公眾號支付
• APP支付
• 掃碼支付
• 刷卡支付
• H5支付
• 小程序支付

(本文檔主要介紹公眾號支付和掃碼支付)

注：微信公眾號目前必須是服務認證號，且開通微信支付功能。公眾號對應的商戶號也必須開通支付功能。

一、公眾號支付

公眾號支付是用戶在微信中打開商戶的H5頁面，商戶在H5頁面通過調用微信支付提供的JSAPI接口調起微信支付模塊完成支付。應用場景有：

• 用戶在微信公眾賬號內進入商家公眾號，打開某個主頁面，完成支付
• 用戶的好友在朋友圈、聊天窗口等分享商家頁面連接，用戶點擊鏈接打開商家頁面，完成支付
• 將商戶頁面轉換成二維碼，用戶掃描二維碼后在微信瀏覽器中打開頁面后完成支付

1.  設置JSSDK接口調用域名

先登錄微信公眾平台進入“公眾號設置”的“功能設置”里填寫“JS接口安全域名”。　　

2.  設置授權域名

開發公眾號支付時，在統一下單接口中要求必傳用戶openid，而獲取openid則需要您在公眾平台設置獲取openid的域名，只有被設置過的域名才是一個有效的獲取openid的域名，否則將獲取失敗。如下圖：

 

3.  設置支付目錄

請確保實際支付時的請求目錄與后台配置的目錄一致，否則將無法成功喚起微信支付。

　　在微信商戶平台（pay.weixin.qq.com）設置您的公眾號支付支付目錄，設置路徑：商戶平台-->產品中心-->開發配置，如下圖所示。公眾號支付在請求支付的時候會校驗請求來源是否有在商戶平台做了配置，所以必須確保支付目錄已經正確的被配置，否則將驗證失敗，請求支付不成功。

注意：這三個地方的域名需使用字母、數字及“-”的組合，不支持IP地址、端口號及短鏈域名，且填寫的域名須通過ICP備案的驗證。

4.   設置支付密鑰app_key

點擊帳戶中心——API安全——設置API密鑰（用於支付是的驗簽）

5.   獲取openid

　　由於openid必須為當前用戶在當前支付公眾號內的身份標識，所以在智慧校園項目中采取實時獲取的方式獲得。

　　步驟一：用戶同意授權，獲取code

　　訪問以下鏈接獲得帶code參數的Url：

https://open.weixin.qq.com/connect/oauth2/authorize?appid=APPID&redirect_uri=REDIRECT_URI&response_type=code&scope=SCOPE&state=STATE#wechat_redirect

　　參數說明：

參數	是否必須	說明
appid	是	公眾號的唯一標識
redirect_uri	是	授權后重定向的回調鏈接地址，請使用urlencode對鏈接進行處理
response_type	是	返回類型，請填寫code
scope	是	應用授權作用域，snsapi_base（不彈出授權頁面，直接跳轉，只能獲取用戶openid），snsapi_userinfo （彈出授權頁面，可通過openid拿到昵稱、性別、所在地。並且，即使在未關注的情況下，只要用戶授權，也能獲取其信息）
state	否	重定向后會帶上state參數，開發者可以填寫a-zA-Z0-9的參數值，最多128字節
#wechat_redirect	是	無論直接打開還是做頁面302重定向時候，必須帶此參數

注:回調鏈接一定要urlencode,不然識別不出

　　步驟二：通過code換取網頁授權access_token

　　首先請注意，這里通過code換取的是一個特殊的網頁授權access_token,與基礎支持中的access_token（該access_token用於調用其他接口）不同。公眾號可通過下述接口來獲取網頁授權access_token。如果網頁授權的作用域為snsapi_base，則本步驟中獲取到網頁授權access_token的同時，也獲取到了openid，snsapi_base式的網頁授權流程即到此為止。

　　獲取code后，請求以下鏈接獲取access_token：https://api.weixin.qq.com/sns/oauth2/access_token?appid=APPID&secret=SECRET&code=CODE&grant_type=authorization_code

　　參數說明：

參數	是否必須	說明
appid	是	公眾號的唯一標識
secret	是	公眾號的appsecret
code	是	填寫第一步獲取的code參數
grant_type	是	填寫為authorization_code

　　返回JSON數據包如下：

{
   "access_token":"ACCESS_TOKEN",
   "expires_in":7200,
   "refresh_token":"REFRESH_TOKEN",
   "openid":"OPENID",
   "scope":"SCOPE",
   "unionid": "o6_bmasdasdsad6_2sgVt7hMZOPfL" 
}

　　附：關於網頁授權access_token和普通access_token的區別

　　1、微信網頁授權是通過OAuth2.0機制實現的，在用戶授權給公眾號后，公眾號可以獲取到一個網頁授權特有的接口調用憑證（網頁授權access_token），通過網頁授權access_token可以進行授權后接口調用，如獲取用戶基本信息；

　　2、其他微信接口，如發微信消息接口，需要通過基礎支持中的“獲取access_token”接口（https://api.weixin.qq.com/cgi-bin/token）來獲取到的普通access_token調用。

-----------------------------上述5個步驟都為支付的准備步驟。-----------------------------

　　支付業務流程及步驟如下圖：

 

6.   微信內H5調起支付

　　步驟一：后台統一下單獲取jsapi支付參數

　　請求地址：https://api.mch.weixin.qq.com/pay/unifiedorder

　　請求參數：　  appid(公眾賬號ID),

mch_id(商戶號),

device_info(設備號),

nonce_str(隨機字符串),

sign(簽名),

sign_type(簽名類型),

body(商品描述) ,

detail(商品詳情),

attach(附加數據),

out_trade_no(商戶訂單號),

fee_type(標價幣種),

total_fee(標價金額),

spbill_create_ip(終端IP),

time_start(交易起始時間),

time_expire(交易結束時間),

notify_url(支付回調地址),

trade_type(交易類型),

product_id(商品ID),

opened(用戶標識)

　　 注：參數值用XML轉義即可，CDATA標簽用於說明數據不被XML解析器解析。

　　 具體下單過程可參照微信支付Demo：https://pay.weixin.qq.com/wiki/doc/api/jsapi.php?chapter=11_1

　　當請求成功，返回的XML中return_code 和result_code都為SUCCESS時會返回如下：

<xml>
   <return_code><![CDATA[SUCCESS]]></return_code>
   <return_msg><![CDATA[OK]]></return_msg>
   <appid><![CDATA[wx3556f3b4523gf12r]]></appid>
   <mch_id><![CDATA[10000100]]></mch_id>
   <nonce_str><![CDATA[jfjsdh47fin0jdnv]]></nonce_str>
   <openid><![CDATA[oECxywCpJW8G-ktn3lwZ7MR4Cx2Q]]></openid>
   <sign><![CDATA[8SDVCNKDF89W32SDKCSAA0S32JKSDJJL]]></sign>
   <result_code><![CDATA[SUCCESS]]></result_code>
   <prepay_id><![CDATA[wx201801041172356eidnvnd9qk398324745]]></prepay_id>
   <trade_type><![CDATA[JSAPI]]></trade_type>
</xml>

　　步驟二：H5發起微信支付

　　在微信瀏覽器里面打開H5網頁中執行JS調起支付。接口輸入輸出數據格式為JSON。

　　注意：WeixinJSBridge內置對象在其他瀏覽器中無效，參數名區分大小，大小寫錯誤簽名驗證會失敗。

引用js：http://res.wx.qq.com/open/js/jweixin-1.0.0.js。

　　調用支付js如下：

function onBridgeReady(){
   WeixinJSBridge.invoke(
       'getBrandWCPayRequest', {
           "appId":"wx2421b1c4370ec43b",     //公眾號名稱，由商戶傳入     
           "timeStamp":"1395712654",         //時間戳，自1970年以來的秒數     
           "nonceStr":"e61463f8efa94090b1f366cccfbbb444", //隨機串     
           "package":"prepay_id=u802345jgfjsdfgsdg888",     
           "signType":"MD5",         //微信簽名方式：     
           "paySign":"70EA570631E4BB79628FBCA90534C63FF7FADD89" //微信簽名 
       },
       function(res){     
           if(res.err_msg == "get_brand_wcpay_request:ok" ) {}     // 使用以上方式判斷前端返回,微信團隊鄭重提示：res.err_msg將在用戶支付成功后返回    ok，但並不保證它絕對可靠。 
       }
   ); 
}
if (typeof WeixinJSBridge == "undefined"){
   if( document.addEventListener ){
       document.addEventListener('WeixinJSBridgeReady', onBridgeReady, false);
   }else if (document.attachEvent){
       document.attachEvent('WeixinJSBridgeReady', onBridgeReady); 
       document.attachEvent('onWeixinJSBridgeReady', onBridgeReady);
   }
}else{
   onBridgeReady();
}

　　支付完成后，微信會將訂單參數會以XML方式發送給商戶系統回調地址，商戶在回調地址接收參數並做相應處理。

　　回調的XML格式為：

<xml>
  <appid><![CDATA[wx2421b1c4370ec43b]]></appid>
  <attach><![CDATA[支付測試]]></attach>
  <bank_type><![CDATA[CFT]]></bank_type>
  <fee_type><![CDATA[CNY]]></fee_type>
  <is_subscribe><![CDATA[Y]]></is_subscribe>
  <mch_id><![CDATA[10000100]]></mch_id>
  <nonce_str><![CDATA[5d2b6c2a8db53831f7eda20af46e531c]]></nonce_str>
  <openid><![CDATA[oUpF8uMEb4qRXf22hE3X68TekukE]]></openid>
  <out_trade_no><![CDATA[1409811653]]></out_trade_no>
  <result_code><![CDATA[SUCCESS]]></result_code>
  <return_code><![CDATA[SUCCESS]]></return_code>
  <sign><![CDATA[B552ED6B279343CB493C5DD0D78AB241]]></sign>
  <sub_mch_id><![CDATA[10000100]]></sub_mch_id>
  <time_end><![CDATA[20140903131540]]></time_end>
  <total_fee>1</total_fee>
  <trade_type><![CDATA[JSAPI]]></trade_type>
  <transaction_id><![CDATA[1004400740201409030005092168]]></transaction_id>
</xml>

推薦技術文檔：

1．https://pay.weixin.qq.com/wiki/doc/api/jsapi.php?chapter=7_1

2．https://wenku.baidu.com/view/cebde8a764ce0508763231126edb6f1aff007185.html?re=view

 

二、掃碼支付

　　掃碼支付可分為兩種模式，商戶根據支付場景選擇相應模式。

　　【模式一】：

　　商戶后台系統根據微信支付規則鏈接生成二維碼，鏈接中帶固定參數productid（可定義為產品標識或訂單號）。用戶掃碼后，微信支付系統將productid和用戶唯一標識(openid)回調商戶后台系統(需要設置支付回調URL)，商戶后台系統根據productid生成支付交易，最后微信支付系統發起用戶支付流程。

　　商戶支付回調URL設置指引：進入商戶平台-->產品中心-->開發配置，進行配置和修改，如下圖所示。

　　【模式二】：

　　商戶后台系統調用微信支付【統一下單API】生成預付交易，將接口返回的鏈接生成二維碼，用戶掃碼后輸入密碼完成支付交易。注意：該模式的預付單有效期為2小時，過期后無法支付，不依賴設置的回調支付URL。

　　流程圖：

　　

　　業務流程說明：

（1）商戶后台系統根據用戶選購的商品生成訂單。

（2）用戶確認支付后調用微信支付【統一下單API】生成預支付交易；

（3）微信支付系統收到請求后生成預支付交易單，並返回交易會話的二維碼鏈接code_url。

（4）商戶后台系統根據返回的code_url生成二維碼。

（5）用戶打開微信“掃一掃”掃描二維碼，微信客戶端將掃碼內容發送到微信支付系統。

（6）微信支付系統收到客戶端請求，驗證鏈接有效性后發起用戶支付，要求用戶授權。

（7）用戶在微信客戶端輸入密碼，確認支付后，微信客戶端提交授權。

（8）微信支付系統根據用戶授權完成支付交易。

（9）微信支付系統完成支付交易后給微信客戶端返回交易結果，並將交易結果通過短信、微信消息提示用戶。微信客戶端展示支付交易結果頁面。

（10）微信支付系統通過發送異步消息通知商戶后台系統支付結果。商戶后台系統需回復接收情況，通知微信后台系統不再發送該單的支付通知。

（11）未收到支付通知的情況，商戶后台系統調用【查詢訂單API】。

（12）商戶確認訂單已支付后給用戶發貨。

　　附：

　　前端頁面代碼：

//前端頁面
<img src=" MakeQRCode?code_url=@code_url" alt="二維碼"/>

 　　C#生成二維碼后台代碼：

    //生成二維碼方法  
     public FileResult MakeQRCode(string code_url)
        {
            if (string.IsNullOrEmpty(code_url))
                throw new ArgumentException("code_url");
            //初始化二維碼生成工具
            QRCodeEncoder qrCodeEncoder = new QRCodeEncoder();
            qrCodeEncoder.QRCodeEncodeMode = QRCodeEncoder.ENCODE_MODE.BYTE;
            qrCodeEncoder.QRCodeErrorCorrect = QRCodeEncoder.ERROR_CORRECTION.M;
            qrCodeEncoder.QRCodeVersion = 0;
            qrCodeEncoder.QRCodeScale = 4;
            //將字符串生成二維碼圖片
            Bitmap image = qrCodeEncoder.Encode(code_url, Encoding.Default);
            //保存為PNG到內存流  
            MemoryStream ms = new MemoryStream();
            image.Save(ms, ImageFormat.Jpeg);
            return File(ms.ToArray(), "image/jpeg");
        }

　　推薦技術文檔：

1. https://pay.weixin.qq.com/wiki/doc/api/native.php?chapter=6_1
2. http://www.cnblogs.com/vinsonLu/p/5166214.html

（本文章是個人開發實踐總結所寫，請大家多多指教。碼字不容易，轉載請注明出處。謝謝！）