商城系統(tǒng) 注冊

微信小程序支付功能開發(fā),小程序實現微信支付功能

2018-08-16|HiShop
導讀:微信小程序是變現的最好工具,那么要實現小程序的變現就要開發(fā)微信支付功能,那么微信小程序開發(fā)如何實現微信支付功能呢?...

微信小程序是變現的最好工具,那么要實現小程序的變現就要開發(fā)微信支付功能,那么微信小程序開發(fā)如何實現微信支付功能呢?

微信小程序支付功能開發(fā),小程序實現微信支付功能

微信小程序支付功能開發(fā)文檔如下:

小程序端,保留大部分的console的版本

/* 微信支付 */
  goWxPay: function () {
    var that = this;
    //登陸獲取code
    wx.login({
      success: function (res) {
        console.log("獲取login code",res.code);
        //獲取openid
        that.getOpenId(res.code);
      }
    });
  },
 
  /* 獲取openId */
  getOpenId: function (code) {
    var that = this;
    wx.request({
      url: "https://****?code=" + code, //服務器端的請求地址,域名已加入小程序request白名單
      method: 'GET',
      success: function (res) {
        console.log("獲取openid", res);
        that.unitedPayRequest(res.data.openid);
      },
      fail: function () {
        console.log("獲取openid 失敗", res);
      },
      complete: function () {
        console.log("獲取openid 完畢", res);
      }
    });
  },//getOpenId()
 
  /*統(tǒng)一支付接口*/
  unitedPayRequest: function(openid){
    var that=this;
    //統(tǒng)一支付簽名
    var appid = '';//appid必填
    var body = '';//商品名必填
    var mch_id = '';//商戶號必填
    var nonce_str = util.randomString();//隨機字符串,不長于32位。  
    var notify_url = '';//通知地址必填
    var total_fee = parseInt(0.01 * 100); //價格,這是一分錢
    var trade_type = "JSAPI";
    var key = ''; //商戶key必填,在商戶后臺獲得
    var out_trade_no = '';//自定義訂單號必填
 
    var unifiedPayment = 'appid=' + appid + '&body=' + body + '&mch_id=' + mch_id + '&nonce_str=' + nonce_str + '&notify_url=' + notify_url + '&openid=' + openid + '&out_trade_no=' + out_trade_no + '&total_fee=' + total_fee + '™_type=' + trade_type + '&key=' + key;
    console.log("unifiedPayment", unifiedPayment);
    var sign = md5.md5(unifiedPayment).toUpperCase();
    console.log("簽名md5", sign);
 
    //封裝統(tǒng)一支付xml參數
    var formData = "<xml>";
    formData += "<appid>" + appid + "</appid>";
    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>" + that.data.ordernum + "</out_trade_no>";
    formData += "<total_fee>" + total_fee + "</total_fee>";
    formData += "<trade_type>" + trade_type + "</trade_type>";
    formData += "<sign>" + sign + "</sign>";
    formData += "</xml>";
    console.log("formData", formData);
    //統(tǒng)一支付
    wx.request({
      url: 'https://api.mch.weixin.qq.com/pay/unifiedorder', //別忘了把api.mch.weixin.qq.com域名加入小程序request白名單,這個目前可以加
      method: 'POST',
      head: 'application/x-www-form-urlencoded',
      data: formData, //設置請求的 header
      success: function (res) {
        console.log("返回商戶", res.data);
        var result_code = util.getXMLNodeValue('result_code', res.data.toString("utf-8"));
        var resultCode = result_code.split('[')[2].split(']')[0];
        if (resultCode == 'FAIL') {
          var err_code_des = util.getXMLNodeValue('err_code_des', res.data.toString("utf-8"));
          var errDes = err_code_des.split('[')[2].split(']')[0];
          wx.showToast({
            title: errDes,
            icon: 'none',
            duration: 3000
          })
        } else {
          //發(fā)起支付
          var prepay_id = util.getXMLNodeValue('prepay_id', res.data.toString("utf-8"));
          var tmp = prepay_id.split('[');
          var tmp1 = tmp[2].split(']');
          //簽名  
          var key = '';//商戶key必填,在商戶后臺獲得
          var appId = '';//appid必填
          var timeStamp = util.createTimeStamp();
          var nonceStr = util.randomString();
          var stringSignTemp = "appId=" + appId + "&nonceStr=" + nonceStr + "&package=prepay_id=" + tmp1[0] + "&signType=MD5&timeStamp=" + timeStamp + "&key=" + key;
          console.log("簽名字符串", stringSignTemp);
          var sign = md5.md5(stringSignTemp).toUpperCase();
          console.log("簽名", sign);
          var param = { "timeStamp": timeStamp, "package": 'prepay_id=' + tmp1[0], "paySign": sign, "signType": "MD5", "nonceStr": nonceStr }
          console.log("param小程序支付接口參數", param);
          that.processPay(param);
        }
 
      },
    })
 
  },//unitedPayRequest()
 
  /* 小程序支付 */
  processPay: function (param) {
    wx.requestPayment({
      timeStamp: param.timeStamp,
      nonceStr: param.nonceStr,
      package: param.package,
      signType: param.signType,
      paySign: param.paySign,
      success: function (res) {
        // success
        console.log("wx.requestPayment返回信息",res);
        wx.showModal({
          title: '支付成功',
          content: '您將在“微信支付”官方號中收到支付憑證',
          showCancel: false,
          success: function (res) {
            if (res.confirm) {
            } else if (res.cancel) {
            }
          }
        })
      },
      fail: function () {
        console.log("支付失敗");
      },
      complete: function () {
        console.log("支付完成(成功或失敗都為完成)");
      }
    })
  }//processPay()

幾個要用到的方法,除了MD5用從Github上找的代碼,其他如下:

/* 時間戳產生函數   */
function createTimeStamp() {
  return parseInt(new Date().getTime() / 1000) + ''
}
/* 隨機數 */
function randomString() {
  var chars = 'ABCDEFGHJKMNPQRSTWXYZabcdefhijkmnprstwxyz2345678'; //默認去掉了容易混淆的字符oOLl,9gq,Vv,Uu,I1
  var maxPos = chars.length;
  var pwd = '';
  for (var i = 0; i < 32; i++) {
    pwd += chars.charAt(Math.floor(Math.random() * maxPos));
  }
  return pwd;
}
/* 獲取XML節(jié)點信息 */
function getXMLNodeValue(node_name, xml) {
  var tmp = xml.split("<" + node_name + ">")
  var _tmp = tmp[1].split("</" + node_name + ">")
  return _tmp[0]
}
module.exports = {
  createTimeStamp: createTimeStamp,
  randomString: randomString,
  getXMLNodeValue: getXMLNodeValue
}

在服務端獲取openid的PHP代碼

//獲取用戶openid
function getPortData($url){
	$ch = curl_init();
	curl_setopt($ch, CURLOPT_SSL_VERIFYPEER, false);
	curl_setopt($ch, CURLOPT_SSL_VERIFYHOST, 0);
	curl_setopt($ch, CURLOPT_URL, $url);
	curl_setopt($ch, CURLOPT_POST, 0);
	curl_setopt($ch, CURLOPT_HEADER, false);
	curl_setopt($ch, CURLOPT_RETURNTRANSFER, true);
	curl_setopt($ch, CURLOPT_SSL_VERIFYPEER, false);
	$r = curl_exec($ch);
	//$r = json_decode($r);
	if($error=curl_error($ch)){
		die($error);
	}
	curl_close($ch);
	return $r;
}
 
function getopenid(){
	$code = $_GET["code"];
	if(empty($code)) return array('status'=>0,'info'=>'缺少js_code');
	$appid = '';//必填
	$appsecret = '';//必填
	$url = "https://api.weixin.qq.com/sns/jscode2session?appid=".$appid."&secret=".$appsecret."&js_code=".$code."&grant_type=authorization_code";
	$result = getPortData($url);
	//var_dump($result);
	echo $result;
}
getopenid();

以上就是小程序實現微信支付的開發(fā)文檔,更多小程序開發(fā)文檔可以關注網站。

HiShop小程序工具提供多類型商城/門店小程序制作,可視化編輯 1秒生成5步上線。通過拖拽、拼接模塊布局小程序商城頁面,所看即所得,只需要美工就能做出精美商城。更多小程序請查看:小程序商店


電話咨詢 預約演示 0元開店