前提
H5必須使用 https 地址,否則通不過
微信
官方鏈接:https://developers.weixin.qq.com/miniprogram/introduction/qrcode.html#
H5跳轉小程序配置路徑:開發>開發管理>開發設置>掃普通鏈接二維碼打開小程序,如下圖

配置,如圖

支付寶
官方地址:https://opensupport.alipay.com/support/helpcenter/142/201602496413?ant_source=manual&recommend=8b6202da8b06f20ef41161d6463aa59a
開啟聯調模式:(https://opensupport.alipay.com/support/helpcenter/142/201602520380?ant_source=manual&recommend=8b6202da8b06f20ef41161d6463aa59a)
H5跳轉小程序配置路徑:管理>碼管理>關聯普通二維碼,如下圖

配置,如圖

相關代碼
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>跳轉中-xxx</title>
<meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=0">
<script>window.onload = function() {
var orderId = GetQueryString("orderId");
var browser = navigator.userAgent.toLowerCase();
if (browser.match(/Alipay/i) == "alipay") {
window.location.href="alipays://platformapi/startapp?appId=xxx&page=pages/pay/pay&query="+encodeURIComponent("xxx");
console.log("支付寶app的瀏覽器");
} else if (browser.match(/MicroMessenger/i) == "micromessenger") {
console.log("微信app的瀏覽器");
} else {
console.log("其它瀏覽器");
}
}
//1.截取地址欄
function GetQueryString(name) {
var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
var r = window.location.search.substr(1).match(reg);
if (r != null) return r[2];
return null;
}
</script>
<head>
</html>
(
注意:
1、支付寶必須使用中轉頁面進行喚起小程序
2、微信配置匹配規則不能占用,否則支付寶不能使用,同理支付寶不能選擇精准匹配,否則微信不能正常調用
3、支付寶調試,需要在手機支付寶APP掃描項目小程序,進行設置>打開調試
)
