uniapp 获取支付宝授权

经过两个小时的研究后发现在其后＋ window.event.returnValue = false;公司业务需求需要通过支付宝授权来进行app中货币的交易，我在实际开发中遇到了很多问题，在此记录下。这里我发现window.location.href没有生效。redirect_uri:授权回调地址。打开支付宝后获取到个人信息后返回app。拿到返回值后在授权回调地址再回到app。appId：开放平台

前端萌新

788人浏览 · 2023-07-04 16:10:00

前端萌新 · 2023-07-04 16:10:00 发布

公司业务需求需要通过支付宝授权来进行app中货币的交易，我在实际开发中遇到了很多问题，在此记录下

通过点击事件出发调用支付宝

appId：开放平台应用 id。

redirect_uri:授权回调地址

 goAlipay(){  
			                let alipayUrl="https://openauth.alipay.com/oauth2/publicAppAuthorize.htm?app_id=xxxxxxxxxxxxxxxxxxx=auth_user&redirect_uri=http://xxxxxxxxxxxx.com/alipayCallback.html"  
			                let openURL="alipays://platformapi/startapp?appId=20000067&url="+encodeURIComponent(alipayUrl);  
			                console.log("openURL:" + openURL);  
			                plus.runtime.openURL(openURL,err=>{  
								console.log(openURL,err)
			                    uni.showToast({  
			                        title:"打开支付宝失败！请检查是否已安装？",  
			                        icon:'none'  
			                    })  
			                }) 
			            },

打开支付宝后获取到个人信息后返回app

拿到返回值后在授权回调地址再回到app

在此我碰到了第一个坑

<!doctype html>  
<html>  
    <head>  
        <meta charset="utf-8">  
        <title>alipayCallback</title>  
        <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />  
    </head>  

    <body>  
        <div>  
            如果没有跳转请------  
            <a href="test://home" id="url">点击这里</a>  
        </div>  
        <script type="text/javascript">  
            function getQueryVariable(variable) {  
                var query = window.location.search.substring(1);  
                var vars = query.split("&");  
                for (var i = 0; i < vars.length; i++) {  
                    var pair = vars[i].split("=");  
                    if (pair[0] == variable) {  
                        return pair[1];  
                    }  
                }  
                return (false);  
            }  
            window.onload = function() {  
                var code = getQueryVariable("auth_code");  
                console.log(code,'ccccccccccccccccccccccccccccc');  
                //alert("code：" + code);  
                document.getElementById('url').href = "test://?"+encodeURIComponent(JSON.stringify({"code":code}));  
                window.location.href="test://?"+encodeURIComponent(JSON.stringify({"code":code}));  
                
            }  
        </script>  
    </body>  

</html>

这里我发现window.location.href没有生效

经过两个小时的研究后发现在其后＋ window.event.returnValue = false;如下图

便可解决

<!doctype html>  
<html>  
    <head>  
        <meta charset="utf-8">  
        <title>alipayCallback</title>  
        <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />  
    </head>  

    <body>  
        <div>  
            如果没有跳转请------  
            <a href="test://home" id="url">点击这里</a>  
        </div>  
        <script type="text/javascript">  
            function getQueryVariable(variable) {  
                var query = window.location.search.substring(1);  
                var vars = query.split("&");  
                for (var i = 0; i < vars.length; i++) {  
                    var pair = vars[i].split("=");  
                    if (pair[0] == variable) {  
                        return pair[1];  
                    }  
                }  
                return (false);  
            }  
            window.onload = function() {  
                var code = getQueryVariable("auth_code");  
                console.log(code,'ccccccccccccccccccccccccccccc');  
                //alert("code：" + code);  
                document.getElementById('url').href = "test://?"+encodeURIComponent(JSON.stringify({"code":code}));  
                window.location.href="test://?"+encodeURIComponent(JSON.stringify({"code":code}));  
                window.event.returnValue = false;
            }  
        </script>  
    </body>  

</html>