微信開發（一）：用JSAPI作微信支付+微信卡包(代金券)

時間 2019-11-19

標籤微信開發 jsapi 支付代金欄目 JavaScript 简体版

原文原文鏈接

作微信支付前期準備：javascript

1，服務好開通微信支付。html

2，公衆帳號ID：AppId。java

3，公衆帳號密鑰：AppSecret。git

4,微信支付密鑰:Key。github

第一步：獲取用戶信息並跳轉到須要微信支付的頁面ajax

    public void ProcessRequest (HttpContext context) {
     
        var returnUrl = "http://wap.yueyangdujia.com/ActivityOrder.aspx?id="+context.Request["id"];
        var state = string.Format("{0}", "111");//自定義參數
        var url = OAuthApi.GetAuthorizeUrl(AppId, returnUrl, state, OAuthScope.snsapi_userinfo);

 

        context.Response.Redirect(url);
    }

PS：這裏的id在咱們這裏是產品ID。json

第二步：在回調頁面獲取所需的用戶數據。（我這裏把用戶臨時數據存儲在Session裏）api

     var code = Request["code"];
        OAuthAccessTokenResult result;
        try
        {


            result = OAuthApi.GetAccessToken(AppId, AppSecret, code);

        }
        catch (Exception ex)
        {
           

            Response.Write(ex.Message);
            return;
        }
      Session["OAuthAccessToken"] = result;

若是這裏須要使用卡包功能能夠調用如下代碼（例子爲代金券）緩存

public class WeChatCard: CardListItem
{
    public string price { get; set; }
    public string Name { get; set; }
}

 var token = CommonApi.GetToken(AppId, AppSecret).access_token;
        try
        {
            CardListItems = CardApi.GetCardList(token, result.openid).card_list;
          
            if (CardListItems != null)
            {
                WeChatCards = new List<WeChatCard>();
                foreach (var item in CardListItems)
                {
                    var weChatCard = CardApi.CardDetailGet(token, item.card_id);
                    WeChatCards.Add(new WeChatCard()
                    {
                        price = (weChatCard.card.cash.reduce_cost / 100).ToString(),
                        Name = weChatCard.card.cash.base_info.title,
                        code = item.code,
                        card_id = item.card_id
                    });
                }
            }
        }
        catch (Exception ex)
        {
          

        }

卡包代碼

第三步：準備好JSAPI驗證程序微信

 public void ProcessRequest (HttpContext context) {
       
        string url = context.Request["url"];//這裏是當前頁面的地址
        string timeStamp = Senparc.Weixin.MP.TenPayLib.TenPayUtil.GetTimestamp();
        string nonceStr = Senparc.Weixin.MP.TenPayLib.TenPayUtil.GetNoncestr();

       
        string jsTicket = "";

        if (Base.Core.Container.CacheService.GetItem("wap", "jsTicket") == null)
        {
            jsTicket= Senparc.Weixin.MP.CommonAPIs.JsApiTicketContainer.TryGetTicket(AppId, AppSecret);
             Base.Core.Container.CacheService.SetItem("wap", "jsTicket", jsTicket, 7000);
        }
        else
        {
            jsTicket = Base.Core.Container.CacheService.GetItem("wap", "jsTicket") as string;
        }
        string signature = "";

        Senparc.Weixin.MP.TenPayLib.RequestHandler paySignReqHandler = new Senparc.Weixin.MP.TenPayLib.RequestHandler(null);

        paySignReqHandler.SetParameter("jsapi_ticket", jsTicket);
        paySignReqHandler.SetParameter("noncestr", nonceStr);
        paySignReqHandler.SetParameter("timestamp", timeStamp);
        paySignReqHandler.SetParameter("url", url);


        //LOG
        string sRawString = "jsapi_ticket=" + jsTicket + "&noncestr=" +nonceStr + "&timestamp=" +timeStamp + "&url=" + url;


        signature = FormsAuthentication.HashPasswordForStoringInConfigFile(sRawString, "SHA1");


        var hashtable = new System.Collections.Hashtable
        {
            {"appId", AppId},
            {"timeStamp", timeStamp},
            {"nonceStr", nonceStr},
            {"signature", signature}
        };
      
        var js=new JavaScriptSerializer();

        context.Response.Write(js.Serialize(hashtable));
         Base.Core.Container.LogService.Error("驗證成功");
    }

JsApi驗證程序

由於jsTicket有獲取次數限制，最好存入緩存中。

　 Base.Core.Container.CacheService.SetItem("wap", "jsTicket", jsTicket, 7000);這段代碼是我這裏的緩存jsTicket代碼。（請自行實現緩存代碼）

第四步：在須要支付的頁面，也就是第二步的前臺頁面引入JS，微信JSAPI驗證調用等代碼。

引入JSAPI

<script type="text/javascript" src="http://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script>

JSAPI驗證

    $(function() {
        $.ajax({
            type: 'POST',
            url: "/WeChat/GetYueyangConfig.ashx",
            data: { url: '<%=Request.Url.ToString() %>' },
            dataType: "json",
            success: function(data) {

                wx.config({
                    debug: false, // 開啓調試模式,調用的全部api的返回值會在客戶端alert出來，若要查看傳入的參數，能夠在pc端打開，參數信息會經過log打出，僅在pc端時纔會打印。
                    appId: data.appId, // 必填，公衆號的惟一標識
                    timestamp: data.timeStamp, // 必填，生成簽名的時間戳
                    nonceStr: data.nonceStr, // 必填，生成簽名的隨機串
                    signature: data.signature, // 必填，簽名，見附錄1
                    jsApiList: ['chooseWXPay'] // 必填，須要使用的JS接口列表，全部JS接口列表見附錄2
                });

                wx.ready(function() {
                    // config信息驗證後會執行ready方法，全部接口調用都必須在config接口得到結果以後，config是一個客戶端的異步操做，因此若是須要在頁面加載時就調用相關接口，則須把相關接口放在ready函數中調用來確保正確執行。對於用戶觸發時才調用的接口，則能夠直接調用，不須要放在ready函數中。

                });
                wx.error(function(res) {
                    // config信息驗證失敗會執行error函數，如簽名過時致使驗證失敗，具體錯誤信息能夠打開config的debug模式查看，也能夠在返回的res參數中查看，對於SPA能夠在這裏更新簽名。

                });
            }
        });

    });

調起支付代碼

cardiD和Cardcode都是調用卡卷接口回傳的，在第二步那裏有調用卡卷代碼

            $.ajax({
                type: 'POST',
                url: "/WeChat/ActivityPySign.ashx",
                data: {
                    id: <%=Request["id"]%>,
                    cardiD:cardiD,
                    Cardcode:Cardcode
                },
                dataType: "json",
                success: function(data) {
                    if (data.msg) {
                        alert(data.msg);
                    }
                    
                    wx.chooseWXPay({
                        timestamp: data.timeStamp, // 支付簽名時間戳，注意微信jssdk中的全部使用timestamp字段均爲小寫。但最新版的支付後臺生成簽名使用的timeStamp字段名需大寫其中的S字符
                        nonceStr: data.nonceStr, // 支付簽名隨機串，不長於 32 位
                        package: data.package, // 統一支付接口返回的prepay_id參數值，提交格式如：prepay_id=***）
                        signType: "MD5", // 簽名方式，默認爲'SHA1'，使用新版支付需傳入'MD5'
                        paySign: data.paysign, // 支付簽名
                        success: function(res) {
                            //成功以後的處理                                                     
                            location.href = data.backUrl;
                        }
                    });
                }
            });

第四步：支付後臺代碼

 var token=CommonApi.GetToken(AppId, AppSecret);
  var id = context.Request["id"];
  var timeStamp = TenPayV3Util.GetTimestamp();
        var nonceStr = TenPayV3Util.GetNoncestr();
 var out_trade_no = DateTime.Now.ToString("HHmmss") + TenPayV3Util.BuildRandomStr(28);
        ; //商戶系統內部的訂單號，32個字符內，可包含字母，其餘說明見商戶訂單號
        var spbill_create_ip = context.Request.UserHostAddress; //APP和網頁支付提交用戶端IP，Native支付填調用微信支付API的機器IP
        var trade_type = "JSAPI"; //JSAPI,NATIVE,APP,WAP
        var resultAccess =context.Session["OAuthAccessTokenYueYang"]  as OAuthAccessTokenResult;
    var notifyUrl = "http://wap.yueyangdujia.com/ActivtyCallBack.ashx";
        var cardiD = context.Request["cardiD"];
 var code = context.Request["Cardcode"];
   //接收微信支付異步通知回調地址
        var backUrl = "/ActivtyPaySuccess.aspx";
  //建立支付應答對象
 //卡卷
if (CardApi.CardGet(token.access_token, code).errmsg == "ok")
                {
                    cardPrice = CardApi.CardDetailGet(token.access_token, cardiD).card.cash.reduce_cost/100;
                }
//建立訂單（根據需求自行建立訂單）
  #region 生成訂單
 #endregion

//初始化支付
packageReqHandler.Init();

        //設置package訂單參數
        packageReqHandler.SetParameter("appid", AppId);
        packageReqHandler.SetParameter("mch_id", MchId);//微信支付分配的商戶號
        packageReqHandler.SetParameter("nonce_str", nonceStr);
        packageReqHandler.SetParameter("body", body);//商品或支付單簡要描述
        packageReqHandler.SetParameter("out_trade_no", out_trade_no); //商戶系統內部的訂單號，32個字符內，可包含字母，其餘說明見商戶訂單號
        packageReqHandler.SetParameter("total_fee",(money*100).ToString());//價格以分爲計數單位
        packageReqHandler.SetParameter("spbill_create_ip", spbill_create_ip);//APP和網頁支付提交用戶端IP，Native支付填調用微信支付API的機器IP
        packageReqHandler.SetParameter("notify_url", notifyUrl);//回調URL
        packageReqHandler.SetParameter("trade_type", trade_type);//JSAPI,NATIVE,APP,WAP
        packageReqHandler.SetParameter("openid", resultAccess.openid);
        packageReqHandler.SetParameter("attach",objOrder.Value.OrderCode+"&"+code);//自定義參數我這裏是訂單號+卡卷CODE

        var sign = packageReqHandler.CreateMd5Sign("key", Key);

        packageReqHandler.SetParameter("sign", sign);

        var data = packageReqHandler.ParseXML();

        var result = TenPayV3.Unifiedorder(data);



        var res = System.Xml.Linq.XDocument.Parse(result);

        var prepayId = res.Element("xml").Element("prepay_id").Value;

        timeStamp = TenPayV3Util.GetTimestamp();
        nonceStr = TenPayV3Util.GetNoncestr();

        RequestHandler paysignReqHandler = new RequestHandler(null);

        paysignReqHandler.Init();

        //設置支付參數
        paysignReqHandler.SetParameter("appId", AppId);
        paysignReqHandler.SetParameter("timeStamp", timeStamp);
        paysignReqHandler.SetParameter("nonceStr", nonceStr);
        paysignReqHandler.SetParameter("package", string.Format("prepay_id={0}", prepayId));
        paysignReqHandler.SetParameter("signType", "MD5");

        var paysign = paysignReqHandler.CreateMd5Sign("key", Key);

        paysignReqHandler.SetParameter("paysign", paysign);
        paysignReqHandler.SetParameter("backUrl", backUrl);






        var js = new JavaScriptSerializer();
        context.Response.Write(js.Serialize(paysignReqHandler.GetAllParameters()));

backUrl爲用戶支付完成後，點擊微信提供頁面右上方完成後的跳轉地址。並非微信支付成功後的回調地址。

第五步：接受微信的回調，來更改內部訂單狀態。

        ResponseHandler resHandler = new ResponseHandler(null);
        string return_code = resHandler.GetParameter("return_code");
        string return_msg = resHandler.GetParameter("return_msg");
        var data = resHandler.GetParameter("attach");
        var dataArr=data.Split('&');
     
        var code = dataArr[1];
     
              
             var accessToken=CommonApi.GetToken(AppId, AppSecret).access_token;
            var a = CardApi.CardConsume(accessToken, code);//消耗卡卷
           Base.Core.Container.LogService.Error(a.errmsg);
            Base.Core.Container.LogService.Error("消耗卡卷");
        

        APIClient.OrderService.UpdateOrderStatus(dataArr[0], 2);
        string xml = string.Format(@"<xml>
   <return_code><![CDATA[{0}]]></return_code>
   <return_msg><![CDATA[{1}]]></return_msg>
</xml>", return_code, return_msg);
        context.Response.ContentType = "text/xml";
        context.Response.Write(xml);