mui支付php后台demo,Dcloud中mui 微信支付和支付寶支付接口完美實現付款代碼（PHP支付寶demo）...

Dcloud中mui 微信支付和支付寶支付接口完美實現付款代碼(PHP支付寶demo),官網上下載的一直報‘創建訂單錯誤‘和各種報錯，於是自己就試着寫了一個demo，親測，可用。

1.先上圖片，由於mui自己集成了支付寶，所以不需要配置sdk和獲取appid,微信配置有些小細節，不注意就會出錯，在這里微信支付只能調用一次，詳情看下去在特別注意里

html>

支付

.top {

margin-top: 40px;

}

.weixin {

width: 200px;

height: 50px;

margin-left: 50px;

background: url(../images/icon-weixin.png);

}

.zhifubao {

width: 200px;

height: 50px;

margin-left: 50px;

background: url(../images/alipay.jpg);

}

#jine{

-webkit-user-select:text;

text-align:right;

padding:0 1em;

border: 0px;

border-bottom:1px solid #ECB100;

border-radius: 0;

font-size:16px;

width:30%;

outline:none;

text-align:center;

}

第三方支付

捐贈金額： 元

var wxChannel = null; // 微信支付

var aliChannel = null; // 支付寶支付

var channel = null;   //支付通道

mui.init({

swipeBack:true //啟用右滑關閉功能

});

mui.plusReady(function() {

// 獲取支付通道

plus.payment.getChannels(function(channels){

for (var i in channels) {

if (channels[i].id == "wxpay") {

wxChannel=channels[i];

}else{

aliChannel=channels[i];

}

}

},function(e){

alert("獲取支付通道失敗："+e.message);

});

})

document.getElementById('weixin1').addEventListener('tap',function() {

console.log("微信");

pay('wxpay');

})

document.getElementById('zhifubao').addEventListener('tap',function() {

console.log("zhifubao");

pay('alipay');

})

var ALIPAYSERVER='http://demo.dcloud.net.cn/helloh5/payment/alipay.php?total=';

var WXPAYSERVER='http://demo.dcloud.net.cn/helloh5/payment/wxpay.php?total=';

// 2. 發起支付請求

function pay(id){

// 從服務器請求支付訂單

var PAYSERVER='';

if(id=='alipay'){

PAYSERVER=ALIPAYSERVER;

channel = aliChannel;

}else if(id=='wxpay'){

PAYSERVER=WXPAYSERVER;

channel = wxChannel;

}else{

plus.nativeUI.alert("不支持此支付通道！",null,"捐贈");

return;

}

var xhr=new XMLHttpRequest();

var amount = document.getElementById('jine').value;

xhr.onreadystatechange=function(){

switch(xhr.readyState){

case 4:

if(xhr.status==200){

plus.payment.request(channel,xhr.responseText,function(result){

plus.nativeUI.alert("支付成功！",function(){

back();

});

},function(error){

plus.nativeUI.alert("支付失敗：" + error.code);

});

}else{

alert("獲取訂單信息失敗！");

}

break;

default:

break;

}

}

xhr.open('GET',PAYSERVER+amount);

xhr.send();

}

3.重點看這里關於配置和質疑問題

如下圖

點擊manifest.json文件的“代碼視圖”，在permissions節點下添加Payment節點：

如下圖

在plus -> distribute -> plugins 節點下添加payment節點：

如下圖

4.特別注意

1.由於mui集成了支付寶插件，所以支付寶支付不需要配置就可以，

2,。注意微信weixin節點下配置微信支付相關信息

appid值為在微信開放平台申請應用的AppID值。(微信開放平台不是微信公眾號平台申請的appid)

因為我在微信公眾號申請的也不知到什么原因只成功調取一次，其余失敗。

5.由於項目需要我會等后台完善后，在總結一份