利博国际网上真人赌博
  咨询电话:13594438197

利博国际网上真人赌博

【原创】微信支付前端相关,微信商城开发

最近在开发一个微信的商城项目,给大家分享一下关于微信支付的相关的把,先说说商城开发的流程,商城不管是否用微信登录,都应该可以浏览,一直到支付之前才会调用微信登录。微信登录可以参考我之前的一片博客,里面写了纯前端的微信登录(特殊需求,正常应该走后台),

先说说完整的微信支付的流程把:

首先,应该调用后台的一个接口,达到创建订单,接口要返回订单号,订单需要支付的金额。

第二步,调用后台的接口实现微信支付,返回微信jsapi所需要的appid,timestamp,noncestr,package,signtype,paysign

第三步调用微信jsapi唤起微信支付。回调函数来判断支付成功、失败、取消

第四步根据不同状态进行不同操作,成功前往成功页面,失败和取消调用取消订单,将支付中改为代付款

流程就是这样,当然每个项目都要根据具体情况来实现,比如我们就是通过用户的userId后台在数据库检索appid 分享一下我们的流程把

$.ajax({ type: "POST", url: "http://ip:port/order/create", crossDomain: true, data: JSON.stringify({ userCode: this.userId, shopCode: this.$route.query.shopId, distributionType: pstype, addressProvince: arr[0], addressCity: arr[1], addressBlock: arr[2], addressStreet: this.AddressObj.address, contactPhone: this.AddressObj.phone, contactName: this.AddressObj.name, isFreightInsurance: 0, expressAmount: 0, description: this.liuyan, orderCargoList: [ { cargoCode: this.$route.query.cargoId, cargoCount: this.num, presentPrice: 1, originalPrice: 1, cargoSpec: this.pug, cargoTitle: this.goodtitle, cargoPicture: this.checkimgUrl } ] }), contentType: "application/json", success: res => { let data = JSON.stringify({ userCode: this.userId, orderNumber: res.data.orderNumber, paymentAmount: res.data.paymentAmount, paymentMode: 2, paymentSource: "JSAPI", }); $.ajax({ type: "POST", url: "http://ip:port/order/payment",

crossDomain: true, data: data, contentType: "application/json", success: result => { console.log(result); WeixinJSBridge.invoke( "getBrandWCPayRequest", { appId: result.data.appId, timeStamp: result.data.timeStamp, nonceStr: result.data.nonceStr, package: result.data.package, signType: result.data.signType, paySign: result.data.paySign }, function(wxres) { alert(wxres.err_msg); if (wxres.err_msg == "get_brand_wcpay_request:ok") { // 支付成功 } else if (wxres.err_msg == "get_brand_wcpay_request:cancel") { // 支付取消 alert(JSON.stringify(wxres)); alert("已经取消 准备发送ajax"); alert(res.data.orderNumber); $.ajax({ url:"http://ip:port/order/payment/cancel", type : "post", data:JSON.stringify({ paymentMode:2, orderNumber:res.data.orderNumber, message:"用户取消支付", }), contentType: "application/json", success:res=>{ alert("ajax成功") this.tipText = "支付取消", this.tip = true; setTimeout(()=>{ this.tip = false; },1000); }, error:err=>{ alert("ajax失败") console.log(err); } }) } else { alert("失败") $.ajax({ url:"http://ip:port/order/payment/cancel",

data:JSON.stringify({ paymentMode:2, orderNumber:res.data.orderNumber, message:"用户取消支付", }), type : "post", success:res=>{ this.tipText = "支付取消", this.tip = true; setTimeout(()=>{ this.tip = false; },1000); }, error:err=>{ console.log(err); } }) } } ); }, error: err => { alert("支付出现问题了") console.log(err); }, dataType: "json" }); }, error: err => { alert("创建订单出现问题了"); console.log(err); }, dataType: "json" });

这个就是微信支付的流程,每一步都需要异步去操作,当然可以把ajax封装好,直接调用即可。

ps:本文仅作为我们当前项目的需要,所传参数不一定所有都是如此调用,重点看流程。

, 1, 0, 9);