场景描述 两个手机交互涉及公司内容就没有截图了
通过二维码扫码进入 判断扫码微信还是支付宝界面，判断之后微信免登陆进行重定向带值传递到后台交互界面
1.生成二维码界面
//准备支付-进行扫码识别 微信还是支付宝
ready_pay_order(order_number,money){
let url = "https://xxx.xxxx.com/index.php/Template/xxx/center_jump?pay_tl_remark="+pay_tl_remark+"&pay_tl_money="+pay_tl_money;
qrcode.makeCode(url);
var canvas=$("#app_imgs").find('canvas').get(0);
var pay_qr_code_img = canvas.toDataURL('image/jpg');
self.img_src=pay_qr_code_img;
self.times_o = setInterval(() => {
self.times--;
if (self.times == 0||self.is_pay==1) {
clearInterval(self.times_o);
}else{
alert("生成错误");
}
}, 1000);
},
2. 二维码扫码进入
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no">
<link href="__PUBLIC__/css/animate.css" rel="stylesheet">
<link href="__PUBLIC__/css/fyapps.css?v=1.112" rel="stylesheet">
<script src="__PUBLIC__/js/app_jq_vue.js"></script>
</head>
<script>
var appid = "owner"; //自己的appid
const querystring = getQueryString();
function myrefresh()
{
var ua = window.navigator.userAgent.toLowerCase();
if (ua.indexOf("micromessenger") > 0) {
// 微信
//var uri = encodeURI("https://xx.xxx.com//index.php/Template/xx/test_pay?tl_data="+tl_data); //只能传递一个参数 &会与微信自带的参数造成混淆，编译不出
/*encodeURIComponent php后台可以通过 urldecode() 进行解码
$url="%E9%94%80%E5%94%AE%E5%8D%95%E6%80%BB%E9%A2%9D%EF%BC%9A100";
$str = urldecode($url);
echo $url ;
echo $str ;*/
const uri = encodeURIComponent("https://xx.xx.com/index.php/Template/xx/test_pay?pay_tl_money="+querystring.pay_tl_money+"&pay_tl_remark="+querystring.pay_tl_remark);
var url = "https://open.weixin.qq.com/connect/oauth2/authorize?appid="+appid+"&redirect_uri=" + uri+"&response_type=code&scope=snsapi_base&state=123#wechat_redirect";
window.location = url;
}
if (ua.indexOf("alipayclient") > 0) {
//支付宝
alert("Alipay");
}
}
setTimeout('myrefresh()',1000);
/**
* url參數截取
* @returns {
{}}
*/
function getQueryString(){
const url = location.search;
const rs = {
}
if(url.indexOf('?') === 0){
const querystring = url.substr(1);
const kvArr = querystring.split('&');
kvArr.forEach(item => {
const temp = item.split('=')
const key = temp[0];
const val = temp[1];
rs[key] = val
})
}
return rs;
}
</script>
<body>
</body>
</html>
多参数传递 将 encodeURI 改成 encodeURIComponent 亲测有效
3. test_pay界面 接收参数
//原基础上加上
const querystring = this.getQueryString();
let code = querystring.code;
this.number_qr = querystring.pay_tl_money; // alert()可以弹出传递的值
this.remark_content = querystring.pay_tl_remark;