Maison >Applet WeChat >Développement de mini-programmes >Code d'implémentation pour la fonction de paiement en ligne développé par l'applet WeChat

Code d'implémentation pour la fonction de paiement en ligne développé par l'applet WeChat

高洛峰
高洛峰original
2017-03-16 15:17:512434parcourir

Cet article présente principalement les informations pertinentes sur le code d'implémentation de la fonction de paiement en ligne du développement de l'applet WeChat. Les amis dans le besoin peuvent se référer à

La fonction de paiement en ligne de l'applet WeChat

Récemment, j'ai eu besoin d'utiliser la fonction de paiement en ligne dans le mini programme WeChat, j'ai donc jeté un œil à la documentation officielle et j'ai trouvé qu'il est très pratique d'implémenter le paiement WeChat dans le mini programme si vous en avez. a déjà développé le paiement WeChat sous un compte de service, alors vous constaterez que le processus de développement du paiement WeChat dans le mini programme est exactement le même que celui du compte de service. Je vais maintenant parler du processus de développement et des points d'attention du paiement WeChat. dans le mini programme en détail.

Code dimplémentation pour la fonction de paiement en ligne développé par lapplet WeChat

1. Ouvrez le paiement WeChat et le compte marchand WeChat

Ce processus est le même que le processus de paiement WeChat de ouverture d'un compte service Idem, rien à dire.

Code dimplémentation pour la fonction de paiement en ligne développé par lapplet WeChat

2. Obtenez l'openid de l'utilisateur

Page d'accueil dont nous avons besoin pour utiliser le mini programme client

🎜 >js

pour obtenir l'openid de l'utilisateur actuel, le code de l'utilisateur peut être obtenu en appelant la méthode wx.login, puis le serveur de développeur utilise le code d'identification de connexion pour obtenir l'openid.

wx.login({
   success: function(res) {
    if (res.code) {
     //发起网络请求
     wx.request({
      url: 'https://yourwebsit/onLogin',
      method: 'POST',
      data: {
       code: res.code
      },
      success: function(res) {
        var openid = res.data.openid;
      },
      fail: function(err) {
        console.log(err)
      }
     })
    } else {
     console.log('获取用户登录态失败!' + res.errMsg)
    }
   }
  });


var code = req.param("code");
    request({
      url: "https://api.weixin.qq.com/sns/jscode2session?appid="+appid+"&secret="+secret+"&js_code="+code+"&grant_type=authorization_code",
      method: 'GET'
    }, function(err, response, body) {
      if (!err && response.statusCode == 200) {
        res.json(JSON.parse(body));
      }
    });


3. Obtenez le prepay_id et la vérification de la signature de paiement paySign


Le processus de cette étape est le même que le processus de paiement WeChat dans le compte de service, qui est divisé en côté client et côté serveur


Tout d'abord, jetons un coup d'œil au client js

Dans le compte de service, nous activons la fonction de paiement via le code suivant

function jsApiCall()
    {
      WeixinJSBridge.invoke(
        'getBrandWCPayRequest',
        {
          "appId":"",   //公众号名称,由商户传入   
          "timeStamp":"",     //时间戳,自1970年以来的秒数   
          "nonceStr":"", //随机串   
          "package":"prepay_id=<%=prepay_id%>",   
          "signType":"MD5",     //微信签名方式:   
          "paySign":"<%=_paySignjs%>" //微信签名
        },
        function(res){
          WeixinJSBridge.log(res.err_msg);
          if( res.err_msg =="get_brand_wcpay_request:ok"){
            alert("支付成功!");
          }else{
            alert("支付失败!");
          }
        }
      );
    }

Dans le mini programme, nous l'activons via le Méthode wx.requestPayment Fonction de paiement, bien sûr, avant cela, nous devons d'abord obtenir prepay_id.

 wx.request({
          url: &#39;https://yourwebsit/service/getPay&#39;, 
          method: &#39;POST&#39;,
          data: {
           bookingNo:bookingNo, /*订单号*/
           total_fee:total_fee,  /*订单金额*/
           openid:openid
          },
          header: {
            &#39;content-type&#39;: &#39;application/json&#39;
          },
          success: function(res) {
            wx.requestPayment({
             &#39;timeStamp&#39;:timeStamp,
             &#39;nonceStr&#39;: nonceStr,
             &#39;package&#39;: &#39;prepay_id=&#39;+res.data.prepay_id,
             &#39;signType&#39;: &#39;MD5&#39;,
             &#39;paySign&#39;: res.data._paySignjs,
             &#39;success&#39;:function(res){
               console.log(res);
             },
             &#39;fail&#39;:function(res){
               console.log(&#39;fail:&#39;+JSON.stringify(res));
             }
            })
          },
          fail: function(err) {
            console.log(err)
          }
        })

La principale chose à réaliser côté serveur est d'obtenir prepay_id et de signer paySign

 var bookingNo = req.param("bookingNo");
    var total_fee = req.param("total_fee");
    var openid = req.param("openid");
    var body = "费用说明";
    var url = "https://api.mch.weixin.qq.com/pay/unifiedorder";
    var formData = "<xml>";
    formData += "<appid>appid</appid>"; //appid
    formData += "<attach>test</attach>";
    formData += "<body>" + body + "</body>";
    formData += "<mch_id>mch_id</mch_id>"; //商户号
    formData += "<nonce_str>nonce_str</nonce_str>";
    formData += "<notify_url>notify_url</notify_url>";
    formData += "<openid>" + openid + "</openid>";
    formData += "<out_trade_no>" + bookingNo + "</out_trade_no>";
    formData += "<spbill_create_ip>spbill_create_ip</spbill_create_ip>";
    formData += "<total_fee>" + total_fee + "</total_fee>";
    formData += "<trade_type>JSAPI</trade_type>";
    formData += "<sign>" + paysignjsapi(appid, attach, body, mch_id, nonce_str, notify_url, openid, bookingNo, spbill_create_ip, total_fee, &#39;JSAPI&#39;) + "</sign>";
    formData += "</xml>";
    request({
      url: url,
      method: &#39;POST&#39;,
      body: formData
    }, function(err, response, body) {
      if(!err && response.statusCode == 200) {
        var prepay_id = getXMLNodeValue(&#39;prepay_id&#39;, body.toString("utf-8"));
        var tmp = prepay_id.split(&#39;[&#39;);
        var tmp1 = tmp[2].split(&#39;]&#39;);
        //签名
        var _paySignjs = paysignjs(appid, mch_id, &#39;prepay_id=&#39; + tmp1[0], &#39;MD5&#39;,timeStamp);
        var o = {
          prepay_id: tmp1[0],
          _paySignjs: _paySignjs
        }
        res.send(o);
      }
    });

Voici la

fonction utilisée


function paysignjs(appid, nonceStr, package, signType, timeStamp) {
  var ret = {
    appId: appid,
    nonceStr: nonceStr,
    package: package,
    signType: signType,
    timeStamp: timeStamp
  };
  var string = raw1(ret);
  string = string + &#39;&key=&#39;+key;
  console.log(string);
  var crypto = require(&#39;crypto&#39;);
  return crypto.createHash(&#39;md5&#39;).update(string, &#39;utf8&#39;).digest(&#39;hex&#39;);
};

function raw1(args) {
  var keys = Object.keys(args);
  keys = keys.sort()
  var newArgs = {};
  keys.forEach(function(key) {
    newArgs[key] = args[key];
  });

  var string = &#39;&#39;;
  for(var k in newArgs) {
    string += &#39;&&#39; + k + &#39;=&#39; + newArgs[k];
  }
  string = string.substr(1);
  return string;
};

function paysignjsapi(appid, attach, body, mch_id, nonce_str, notify_url, openid, out_trade_no, spbill_create_ip, total_fee, trade_type) {
  var ret = {
    appid: appid,
    attach: attach,
    body: body,
    mch_id: mch_id,
    nonce_str: nonce_str,
    notify_url: notify_url,
    openid: openid,
    out_trade_no: out_trade_no,
    spbill_create_ip: spbill_create_ip,
    total_fee: total_fee,
    trade_type: trade_type
  };
  var string = raw(ret);
  string = string + &#39;&key=&#39;+key;
  var crypto = require(&#39;crypto&#39;);
  return crypto.createHash(&#39;md5&#39;).update(string, &#39;utf8&#39;).digest(&#39;hex&#39;);
};

function raw(args) {
  var keys = Object.keys(args);
  keys = keys.sort()
  var newArgs = {};
  keys.forEach(function(key) {
    newArgs[key.toLowerCase()] = args[key];
  });

  var string = &#39;&#39;;
  for(var k in newArgs) {
    string += &#39;&&#39; + k + &#39;=&#39; + newArgs[k];
  }
  string = string.substr(1);
  return string;
};

function getXMLNodeValue(node_name, xml) {
  var tmp = xml.split("<" + node_name + ">");
  var _tmp = tmp[1].split("</" + node_name + ">");
  return _tmp[0];
}

En seulement 3 étapes simples, la fonction de paiement WeChat du mini programme est connectée Ici. c'est le test Rendus de paiement Code dimplémentation pour la fonction de paiement en ligne développé par lapplet WeChat

Code dimplémentation pour la fonction de paiement en ligne développé par lapplet WeChat

Merci d'avoir lu, j'espère que cela pourra aider tout le monde, merci pour votre soutien de ce site !

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn