mui 使用h5支付
近年来,随着移动互联网的快速发展,移动支付成为了一种越来越流行的支付方式,其中微信支付成为了国内最流行的移动支付工具之一。H5支付作为微信支付的一种方式,可以方便地从外部浏览器呼起微信支付,因此备受商家们的青睐。在这篇文章中,我们将为大家详细介绍在MUI框架下如何使用H5支付。
首先,使用H5支付需要一个可以授权或已备案的支付域名。商家可以自主搭建一个商城,并备案需要使用的域名,或者向需要备案的域名公司索取一份授权书。另外,商家需要提供售卖产品或使用场景的描述以及相应的官方网站域名或详情页网址。
在开通H5支付之前,商家必须先开通微信商户,并登录商户平台,进入【产品中心->产品大全->我的产品->H5支付】,查看H5支付的开通状态。点击申请开通页面,即可进入微信支付H5支付的申请开通界面。
申请过程中,需要填写支付域名、售卖产品/使用场景的描述和补充材料。其中,支付域名需要提供一份域名授权书,而售卖产品/使用场景则需要填写一项需要开通微信支付H5支付企业的营业范围。在补充材料中,商家需要提交域名证书和域名授权书。审核通过后,一般只需要1天的时间便可正常使用H5支付功能了。
使用MUI框架开发H5支付应用时,需要先引入微信付款页面JS API文件,并在商城中嵌入需要使用H5支付的页面。接着,定义支付功能的回调函数并调用微信支付接口,最后实现支付页面的跳转。以下是使用H5支付的代码示例:
```
// 引入微信付款页面JS API文件
// 定义H5支付回调函数
function onBridgeReady() {
WeixinJSBridge.invoke(
'getBrandWCPayRequest', {
"appId": "wx8888888888888888", // 公众号的唯一标识
"timeStamp": "1414587457", // 时间戳
"nonceStr": "Wm3WZYTPz0wzccnW", // 随机字符串
"package": "prepay_id=u802345jgfjsdfgsdg888", // 统一下单接口返回的prepay_id参数值
"signType": "MD5", // 签名算法类型,默认为MD5
"paySign": "C380BEC2BFD727A4B6845133519F3AD6" // 签名
},
function(res) {
if (res.err_msg == "get_brand_wcpay_request:ok") {
window.location.href = "http://www.example.com/success.htm"; // 支付成功后跳转页面
} else if (res.err_msg == "get_brand_wcpay_request:cancel") {
window.location.href = "http://www.example.com/failure.htm"; // 用户取消支付后跳转页面
} else {
window.location.href = "http://www.example.com/error.htm"; // 支付失败后跳转页面
}
}
);
}
// 调用微信支付接口
function callpay() {
if (typeof WeixinJSBridge == "undefined") {
if (document.addEventListener) {
document.addEventListener('WeixinJSBridgeReady', onBridgeReady, false);
} else if (document.attachEvent) {
document.attachEvent('WeixinJSBridgeReady', onBridgeReady);
document.attachEvent('onWeixinJSBridgeReady', onBridgeReady);
}
} else {
onBridgeReady();
}
}
```
以上就是使用MUI框架开发H5支付功能的简单介绍,希望可以帮助到大家。需要注意的是,在使用H5支付时,商家需要保证自己的网站信息真实准确,并遵守微信支付相关规定,防范欺诈风险。