ホームページ  >  記事  >  WeChat アプレット  >  WeChatパブリックプラットフォーム決済開発の詳細な図解説明

WeChatパブリックプラットフォーム決済開発の詳細な図解説明

高洛峰
高洛峰オリジナル
2017-03-14 14:41:212163ブラウズ

この記事では主にWeChat開発における公式アカウント決済の実装方法と手順を紹介します。非常に良い参考値です。以下のエディターで見てみましょう

公式アカウント支払いは、WeChatのH5ページでWeChat支払いを呼び出す機能で、コードをスキャンせずに支払いができます。この関数を実装するときに最初に明確にしておきたいのは、販売者番号 mch_id に一致する appid のみが正常に支払うことができるということです。販売アカウントが正常に登録されると、関連情報がメールボックスに送信されます。支払いを促す鍵は、openid を利用して統一された注文を取得することです。 openid と appid は 1 対 1 に対応します。つまり、ログインに使用する appid が公式アカウントの appid ではない場合、取得した openid では公式アカウントでの支払いをトリガーできません(appid が一致しないというエラーが発生します)。販売者アカウント)。 WeChat のオープン プラットフォームでは Web サイト アプリケーションを作成でき、appid と appsecret もあり、WeChat にワンクリックでログインすることもできるため、ここで寄り道したことがあります。

ビジネスプロセス

以下はWeChatの公式プロセスです。重要な点は、統一された順序インターフェースによって返されるjson文字列を取得することです。公式デモについては、以下で少し詳しく説明します。

WeChatパブリックプラットフォーム決済開発の詳細な図解説明

注文を作成する

支払いのためにWeChat公式アカウントに電話する前に、まず自分で注文を作成する必要があります。たとえば、リチャージ注文などです。重要なことは、最初に金額を決定してから次のステップに進むことです。

public JsonResult CreateRecharegOrder(decimal money)
 {
 if (money < (decimal)0.01) return Json(new PaymentResult("充值金额非法!"));
 var user = _workContext.CurrentUser;
 var order = _paymentService.CreateRechargeOrder(user.Id, money);
 return Json(new PaymentResult(true) {OrderId = order.OrderNumber});
 }

統合注文に電話します

注文が正常に作成された後、ページは支払いページにジャンプします。この時点で、prepay_id を取得するための公式プロセスに従って、WeChat デモは jsApi を提供します。 Payのオブジェクト。ただし、このオブジェクトにはページ オブジェクトを初期化する必要があります。

[LoginValid]
 public ActionResult H5Pay(string orderNumber)
 {
 var user = _workContext.CurrentUser;
 var order = _paymentService.GetOrderByOrderNumber(orderNumber);
 //判断订单是否存在
 //订单是否已经支付了
 var openid = user.OpenId;
 var jsApipay = new JsApiPayMvc(this.ControllerContext.HttpContext);
 jsApipay.openid = openid;
 jsApipay.total_fee = (int)order.Amount * 100;
 WxPayData unifiedOrderResult = jsApipay.GetUnifiedOrderResult();
 ViewBag.wxJsApiParam = jsApipay.GetJsApiParameters();//获取H5调起JS API参数 
 ViewBag.unifiedOrder = unifiedOrderResult.ToPrintStr();
 ViewBag.OrderNumber = order.OrderNumber;
 return View();
 }

MVC で簡単に変更できます。つまり、ページ オブジェクトを httpContext に置き換えます。その後、内部のメソッドを直接使用できます。

JsApiPayMvc:

using System;
using System.Collections.Generic;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Runtime.Serialization;
using System.IO;
using System.Text;
using System.Net;
using System.Web.Security;
using LitJson;
namespace WxPayAPI
{
 public class JsApiPayMvc
 {
 /// <summary>
 /// 保存页面对象,因为要在类的方法中使用Page的Request对象
 /// </summary>
 public HttpContextBase context { get; set; }
 /// <summary>
 /// openid用于调用统一下单接口
 /// </summary>
 public string openid { get; set; }
 /// <summary>
 /// access_token用于获取收货地址js函数入口参数
 /// </summary>
 public string access_token { get; set; }
 /// <summary>
 /// 商品金额,用于统一下单
 /// </summary>
 public int total_fee { get; set; }
 /// <summary>
 /// 统一下单接口返回结果
 /// </summary>
 public WxPayData unifiedOrderResult { get; set; }
 public JsApiPayMvc(HttpContextBase _context)
 {
 context = _context;
 }
 /**
 * 
 * 网页授权获取用户基本信息的全部过程
 * 详情请参看网页授权获取用户基本信息:http://mp.weixin.qq.com/wiki/17/c0f37d5704f0b64713d5d2c37b468d75.html
 * 第一步:利用url跳转获取code
 * 第二步:利用code去获取openid和access_token
 * 
 */
 public void GetOpenidAndAccessToken(string code)
 {
 if (!string.IsNullOrEmpty(code))
 {
 //获取code码,以获取openid和access_token
 Log.Debug(this.GetType().ToString(), "Get code : " + code);
 GetOpenidAndAccessTokenFromCode(code);
 }
 else
 {
 //构造网页授权获取code的URL
 string host = context.Request.Url.Host;
 string path = context.Request.Path;
 string redirect_uri = HttpUtility.UrlEncode("http://" + host + path);
 WxPayData data = new WxPayData();
 data.SetValue("appid", WxPayConfig.APPID);
 data.SetValue("redirect_uri", redirect_uri);
 data.SetValue("response_type", "code");
 data.SetValue("scope", "snsapi_base");
 data.SetValue("state", "STATE" + "#wechat_redirect");
 string url = "https://open.weixin.qq.com/connect/oauth2/authorize?" + data.ToUrl();
 Log.Debug(this.GetType().ToString(), "Will Redirect to URL : " + url);
 try
 {
 //触发微信返回code码 
 context.Response.Redirect(url);//Redirect函数会抛出ThreadAbortException异常,不用处理这个异常
 }
 catch(System.Threading.ThreadAbortException ex)
 {
 }
 }
 }
 /**
 * 
 * 通过code换取网页授权access_token和openid的返回数据,正确时返回的JSON数据包如下:
 * {
 * "access_token":"ACCESS_TOKEN",
 * "expires_in":7200,
 * "refresh_token":"REFRESH_TOKEN",
 * "openid":"OPENID",
 * "scope":"SCOPE",
 * "unionid": "o6_bmasdasdsad6_2sgVt7hMZOPfL"
 * }
 * 其中access_token可用于获取共享收货地址
 * openid是微信支付jsapi支付接口统一下单时必须的参数
 * 更详细的说明请参考网页授权获取用户基本信息:http://mp.weixin.qq.com/wiki/17/c0f37d5704f0b64713d5d2c37b468d75.html
 * @失败时抛异常WxPayException
 */
 public void GetOpenidAndAccessTokenFromCode(string code)
 {
 try
 {
 //构造获取openid及access_token的url
 WxPayData data = new WxPayData();
 data.SetValue("appid", WxPayConfig.APPID);
 data.SetValue("secret", WxPayConfig.APPSECRET);
 data.SetValue("code", code);
 data.SetValue("grant_type", "authorization_code");
 string url = "https://api.weixin.qq.com/sns/oauth2/access_token?" + data.ToUrl();
 //请求url以获取数据
 string result = HttpService.Get(url);
 Log.Debug(this.GetType().ToString(), "GetOpenidAndAccessTokenFromCode response : " + result);
 //保存access_token,用于收货地址获取
 JsonData jd = JsonMapper.ToObject(result);
 access_token = (string)jd["access_token"];
 //获取用户openid
 openid = (string)jd["openid"];
 Log.Debug(this.GetType().ToString(), "Get openid : " + openid);
 Log.Debug(this.GetType().ToString(), "Get access_token : " + access_token);
 }
 catch (Exception ex)
 {
 Log.Error(this.GetType().ToString(), ex.ToString());
 throw new WxPayException(ex.ToString());
 }
 }
 /**
 * 调用统一下单,获得下单结果
 * @return 统一下单结果
 * @失败时抛异常WxPayException
 */
 public WxPayData GetUnifiedOrderResult()
 {
 //统一下单 
 WxPayData data = new WxPayData();
 data.SetValue("body", "test");
 data.SetValue("attach", "test");
 data.SetValue("out_trade_no", WxPayApi.GenerateOutTradeNo());
 data.SetValue("total_fee", total_fee);
 data.SetValue("time_start", DateTime.Now.ToString("yyyyMMddHHmmss"));
 data.SetValue("time_expire", DateTime.Now.AddMinutes(10).ToString("yyyyMMddHHmmss"));
 data.SetValue("goods_tag", "test");
 data.SetValue("trade_type", "JSAPI");
 data.SetValue("openid", openid);
 WxPayData result = WxPayApi.UnifiedOrder(data);
 if (!result.IsSet("appid") || !result.IsSet("prepay_id") || result.GetValue("prepay_id").ToString() == "")
 {
 Log.Error(this.GetType().ToString(), "UnifiedOrder response error!");
 throw new WxPayException("UnifiedOrder response error!");
 }
 unifiedOrderResult = result;
 return result;
 }
 /**
 * 
 * 从统一下单成功返回的数据中获取微信浏览器调起jsapi支付所需的参数,
 * 微信浏览器调起JSAPI时的输入参数格式如下:
 * {
 * "appId" : "wx2421b1c4370ec43b", //公众号名称,由商户传入 
 * "timeStamp":" 1395712654", //时间戳,自1970年以来的秒数 
* "nonceStr" : "e61463f8efa94090b1f366cccfbbb444", //随机串 
* "package" : "prepay_id=u802345jgfjsdfgsdg888", 
 * "signType" : "MD5", //微信签名方式: 
* "paySign" : "70EA570631E4BB79628FBCA90534C63FF7FADD89" //微信签名 
 * }
 * @return string 微信浏览器调起JSAPI时的输入参数,json格式可以直接做参数用
 * 更详细的说明请参考网页端调起支付API:http://pay.weixin.qq.com/wiki/doc/api/jsapi.php?chapter=7_7
 * 
 */
 public string GetJsApiParameters()
 {
 Log.Debug(this.GetType().ToString(), "JsApiPay::GetJsApiParam is processing...");
 
 WxPayData jsApiParam = new WxPayData();
 jsApiParam.SetValue("appId", unifiedOrderResult.GetValue("appid"));
 jsApiParam.SetValue("timeStamp", WxPayApi.GenerateTimeStamp());
 jsApiParam.SetValue("nonceStr", WxPayApi.GenerateNonceStr());
 jsApiParam.SetValue("package", "prepay_id=" + unifiedOrderResult.GetValue("prepay_id"));
 jsApiParam.SetValue("signType", "MD5");
 jsApiParam.SetValue("paySign", jsApiParam.MakeSign());
 string parameters = jsApiParam.ToJson();
 Log.Debug(this.GetType().ToString(), "Get jsApiParam : " + parameters);
 return parameters;
 }
 /**
 * 
 * 获取收货地址js函数入口参数,详情请参考收货地址共享接口:http://pay.weixin.qq.com/wiki/doc/api/jsapi.php?chapter=7_9
 * @return string 共享收货地址js函数需要的参数,json格式可以直接做参数使用
 */
 public string GetEditAddressParameters()
 {
 string parameter = "";
 try
 {
 string host = context.Request.Url.Host;
 string path = context.Request.Path;
 string queryString = context.Request.Url.Query;
 //这个地方要注意,参与签名的是网页授权获取用户信息时微信后台回传的完整url
 string url = "http://" + host + path + queryString;
 //构造需要用SHA1算法加密的数据
 WxPayData signData = new WxPayData();
 signData.SetValue("appid",WxPayConfig.APPID);
 signData.SetValue("url", url);
 signData.SetValue("timestamp",WxPayApi.GenerateTimeStamp());
 signData.SetValue("noncestr",WxPayApi.GenerateNonceStr());
 signData.SetValue("accesstoken",access_token);
 string param = signData.ToUrl();
 Log.Debug(this.GetType().ToString(), "SHA1 encrypt param : " + param);
 //SHA1加密
 string addrSign = FormsAuthentication.HashPasswordForStoringInConfigFile(param, "SHA1");
 Log.Debug(this.GetType().ToString(), "SHA1 encrypt result : " + addrSign);
 //获取收货地址js函数入口参数
 WxPayData afterData = new WxPayData();
 afterData.SetValue("appId",WxPayConfig.APPID);
 afterData.SetValue("scope","jsapi_address");
 afterData.SetValue("signType","sha1");
 afterData.SetValue("addrSign",addrSign);
 afterData.SetValue("timeStamp",signData.GetValue("timestamp"));
 afterData.SetValue("nonceStr",signData.GetValue("noncestr"));
 //转为json格式
 parameter = afterData.ToJson();
 Log.Debug(this.GetType().ToString(), "Get EditAddressParam : " + parameter);
 }
 catch (Exception ex)
 {
 Log.Error(this.GetType().ToString(), ex.ToString());
 throw new WxPayException(ex.ToString());
 }
 return parameter;
 }
 }
}

このページはローカルでデバッグできるため、パラメーターが適切かどうかを確認するのが簡単になります。

Avoke Payment

公式ページの例は以下の通り: https://pay.weixin.qq.com/wiki/doc/api/jsapi.php?chapter=7_7&index=6 ただし、主なパラメータ(マークの部分) は、前のステップの ViewBag.wxJsApiParam であるバックグラウンドによって生成されます

function onBridgeReady(){
 WeixinJSBridge.invoke(
 &#39;getBrandWCPayRequest&#39;, {
 "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,但并不保证它绝对可靠。 
 }
 ); 
}

ので、MVC では次のように記述する必要があります:

@{
 ViewBag.Title = "微信支付";
 Layout = "~/Views/Shared/_Layout.cshtml";
}
<div class="page" id="Wxpayment">
 <div class="content">
 <div>订单详情:@Html.Raw(ViewBag.unifiedOrder)</div>
 <button id="h5pay" onclick="callpay()">支付</button>
 </div>
 <input type="hidden" value="@ViewBag.OrderNumber" id="ordernum"/>
</div>
<script type="text/javascript">
 //调用微信JS api 支付
 function jsApiCall() {
 WeixinJSBridge.invoke(
 &#39;getBrandWCPayRequest&#39;,
 @Html.Raw(ViewBag.wxJsApiParam),//josn串
 function (res)
 {
 WeixinJSBridge.log(res.err_msg);
 //alert(res.err_code + res.err_desc + res.err_msg);
 if (res.err_msg == "get_brand_wcpay_request:ok") {
 var num = $("#ordernum").val();
 $.post("/payment/WeiXinPaySuccess", { ordernumber: num }, function(data) {
 if (data.IsSuccess === true) {
 alert("支付成功");
 location.href = document.referrer;
 } else {
 }
 });
 } 
 if (res.err_msg == &#39;get_brand_wcpay_request:cancel&#39;) {
 $(&#39;.button&#39;).removeAttr(&#39;submitting&#39;);
 alert(&#39;取消支付&#39;);
 } 
 }
 );
 }
 function callpay()
 {
 if (typeof WeixinJSBridge == "undefined")
 {
 alert("WeixinJSBridge =");
 if (document.addEventListener)
 {
 document.addEventListener(&#39;WeixinJSBridgeReady&#39;, jsApiCall, false);
 }
 else if (document.attachEvent)
 {
 document.attachEvent(&#39;WeixinJSBridgeReady&#39;, jsApiCall);
 document.attachEvent(&#39;onWeixinJSBridgeReady&#39;, jsApiCall);
 }
 }
 else
 {
 jsApiCall();
 }
 }
</script>

Html.Raw を使用する必要があります。そうでない場合、json 解析が正しくないため、支払いを行うことができません。このとき、ページをクリックすると、WeChat 読み込みエフェクトが表示されますが、あまり喜んではいけません。そうしないと、やはりエラーが発生し、「3 現在の URL が登録されていません」と表示されるためです。支払いディレクトリは公式アカウントに設定する必要があります。この支払いディレクトリでは大文字と小文字が区別されるため、数回試す必要があります。パスワードを入力するウィンドウが表示されるまでのプロセスは実際には正しいです。これにより、支払いが成功した直後に js でコールバックを受け取ることができ、注文とビジネス ロジックを処理できるようになります。

WeChatパブリックプラットフォーム決済開発の詳細な図解説明

以上がWeChatパブリックプラットフォーム決済開発の詳細な図解説明の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。