pp电子

登录
免费开通

微信小程序举行微信支付流程图解

这里为各人介绍微信用户使用小程序举行微信支付到微信商家吸收微信支付的历程介绍,,,,, ,微信支付是怎样实现支付功效的。 。。。。。

微信小程序举行微信支付流程图解

用 thinkjs 封装了个小程序支付的 Service 在这里纪录一下,,,,, ,顺便梳理一下小程序支付的流程和思绪。 。。。。。首先,,,,, ,先把官网的流程图放上来,,,,, ,然后凭证图一步步的来。 。。。。。

 

微信小程序举行微信支付流程图解

第一步:用户请求开发者后台,,,,, ,提倡下单请求

  • 提倡请求前在小程序端挪用 wx.checkSession() 审查 session_key 是否逾期
    • 若是逾期了 重新挪用 wx.login() 返回 session_key 和 openid
    • 若是没逾期 继续下一步操作,,,,, ,请求开发者后台

第二步:开发者查找一下数据库或者缓存里是否有 openid 和 session_key

  • 若是有天生订单编号 out_trade_no
  • 若是没有返回过失新闻,,,,, ,缺少 openid 、 session_key

第三步:开发者服务器请求统一下单 API ,带上要求的参数:

appid
mch_id
nonce_str
sign
body
out_trade_no
total_fee
spbill_create_ip

nonce_str 获取随机字符串:

test.js
  • js
/*
 *  功效: 返回32位随机字符串
 *  create by tiankai on 2018-06-25 15:39
 */
getNonceStr(){
    let char = 'abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ';
    let len = 32;
    let result = '';
    for(let i = 0; i < len; i++){
        let randomNum = Math.floor(Math.random()*char.length);
        result += char[randomNum];
    }
    return result;
}
sign 参数署名, 第二个tab(js)是挪用函数的要领, key 为商户平台设置的密钥 key 
test.js
  • js
  • js
/*
 *  功效:sign 参数署名
 *  create by tiankai on 2018-06-26 12:00
 */
async makeSign(params, key){
    // 天生署名 sign
    let strOrderArr = Object.keys(params).sort();
    let stringA = "";
    strOrderArr.map(val =>{
        //若是参数值为空,,,,,,或者验证返回的 sign 不加入署名
        if(
            think.isNullOrUndefined(params[val]) ||
            val === 'sign' ||
            params[val].length === 0
        ) return;
        stringA += val + "=" + params[val] + "&";
    });
    let stringSignTemp = stringA + "key=" + key;
    let sign = think.md5(stringSignTemp).toUpperCase();
    return sign;
}

获得这几个参数就最先提倡请求统一下单 API 了,,,,, ,这里需要注重的是,,,,, ,请求参数应该以 xml 的形式传送已往,,,,, ,这里借助一个工具 xml2js 把工具转换为 xml,也可以把 xml 转换为 工具、json。 。。。。。

装置 xml2js

npm i xml2js

使用 xml2js

test.js
  • js
const xml2js = require('xml2js');

//xml->json
//xml2js默认会把子子节点的值变为一个数组, explicitArray设置为false
var xmlParser = new xml2js.Parser({explicitArray : false, ignoreAttrs : true})
//json->xml
var jsonBuilder = new xml2js.Builder();

请求参数转换为 xml

test.js
  • js
/*
 *  功效:获取统一下单 API 请求XML参数
 *  create by tiankai on 2018-06-25 15:23
 */
async getUnifiedOrderParams(){
    let signString = {
        appid: config.appid,
        mch_id: config.mchid,
        nonce_str: await this.getNonceStr(),
        body: '短信平台-短信套餐购置',
        out_trade_no: '20180926125346',//订单号
        total_fee: 88,//订单金额
        //APP和网页支付提交用户端ip,,,,,,Native支付填挪用微信支付API的机械IP
        //需要自行获。。。。。。,,,,这里只是为了测试直接写上了
        spbill_create_ip: '123.12.12.123',
        notify_url: config.notify_url,
        trade_type: 'JSAPI',
        openid: await think.cache('openId')
    }
    let sign = await this.makeSign(signString,config.key);
    signString.sign = sign;
    /* console.log("--------------------------");
     * console.log(sign);
     * console.log("--------------------------"); */
    let xml = await jsonBuilder.buildObject(signString);
    /* console.log(xml); */
    return xml;
}

然后就可以提倡统一下单API请求了

test.js
  • js
/*
 *  功效:挪用统一下单API接口
 *  create by tiankai on 2018-06-26 11:01
 */
async unifiedOrder(){
    let xmlParams = await this.getUnifiedOrderParams();
    let unifiedOrderUrl = config.unifiedOrderUrl;
    let opt = {
        method: "POST",
        mode: 'cors',
        headers: {
            'content-type': 'text/xml'
        },
        body: xmlParams
    }
    let res = await this.fetch(unifiedOrderUrl, opt);
    //这里微信返回的也是 xml
    let result = await res.text();
    let data = null;
    // 微信返回的 XML 转换为 JSON
    xmlParser.parseString(result,function(err, jsonData){
        if(!err){
            /* console.log(jsonData); */
            data = jsonData;
        }
    });
    return data;
}

第四步:当请求乐成时 判断一下 return_code 和 result_code

  • 若是它们都即是 SUCCESS 的时间,,,,, ,微信会把我们需要的预支付订单信息 prepay_id 返回来,,,,, ,
  • 否则返回 return_msg 给前端 展示详细过失

第五步:拿上 prepay_id ,举行再次署名,,,,, ,然后返回给前端

test.js
  • js
/*
 *  功效:统一下单接口返回 prepay_id 再次署名 返回给前端
 *  create by tiankai on 2018-06-26 15:45
 */
async payParams(){
    let signString = {
        appid: config.appid,
        timeStamp: +new Date(),
        nonce_str: await this.getNonceStr(),
        package: null,
        signType: 'MD5'
    }
    //挪用 统一下单 API
    let jsonData = await this.unifiedOrder();
    if(think.isNullOrUndefined(jsonData) &&
       jsonData.xml.return_code === 'SUCCESS' &&
       jsonData.xml.result_code === 'SUCCESS'
    ){
        signString.package = 'perpay_id='+jsonData.xml.perpay_id
    }else{
        return jsonData.xml.return_msg;
    }
    //举行再次署名
    let paySign = await this.makeSign(signString,config.key);
    signString.paySign = paySign;
    let { appid, signType, ...result } = signString;
    // result 中不包括 appid 和 signType 返回给前端
    return result;
}

第六步:用户确认支付后,,,,, ,小程序端挪用支付接口,,,,, ,凭证返回效果提醒用户

test.js
  • js
wx.requestPayment({
   'timeStamp': '',
   'nonceStr': '',//后端返回的随机字符串
   'package': '',//后端返回的
   'signType': 'MD5',
   'paySign': '',//后端返回的
   'success':function(res){
   },
   'fail':function(res){
   }
});

第七步:支付乐成后,,,,, ,微信服务器会把支付效果返回给设置的 notify_url ,,,,, ,开发者凭证支付效果,,,,, ,更新服务器的订单状态。 。。。。。

概略流程就是这,,,,, ,现在举行到了 第四步 公司小程序 appid 还没申请下来 商户号 mch_id 也没有,,,,, ,等过段时间继续更新。 。。。。。(18/6/27)


【本站声明】
  1、本站文章中所选用的图片及文字泉源于网络以及用户投稿,,,,, ,由于未联系到知识产权人或未发明有关知识产权的挂号,,,,, ,若有知识产权人并不肯意我们使用,,,,, ,若是有侵权请连忙联系。 。。。。。
  2、本网站差池文章中所涉及的内容真实性、准确性、可靠性认真,,,,, ,仅系客观性形貌,,,,, ,如您需要相识该类商品/服务详细的资讯,,,,, ,请您直接与该类商品/服务的提供者联系。 。。。。。


KESION pp电子软件

KESION pp电子软件是海内领先的在线教育软件及私域社交电商软件服务提供商,,,,, ,恒久专注于为企业提供在线教育软件及社交电商SaaS平台解决方案。 。。。。。
公司焦点产品云开店SaaS社交电商服务平台、在线教育SaaS服务平台、教育企业数字化SaaS云平台、企微营销助手、私有化自力安排品牌网校和在线教育咨询等。 。。。。。

KESION 一直通过手艺立异,,,,, ,提供产品和服务,,,,, ,助力企业向数字化转型,,,,, ,通过科技驱动商业刷新,,,,, ,让商业变得更智慧!



▼点击进入pp电子官网相识更多



热门标签
微信小程序 SaaS
上/下篇
  • 电商购物小程序几多钱

  • 蜜芽小程序运营结构案例

换一换相关推荐
精选内容
热门精选
pp电子·模拟器(试玩游戏)官方网站 pp电子·模拟器(试玩游戏)官方网站 pp电子·模拟器(试玩游戏)官方网站
【网站地图】
微信小程序举行微信支付流程图解 - KESION pp电子