前言
例如：上篇文章记录了微信的引入式授权登录，当前文章记录一下支付宝拼接URL跳转支付宝登录页授权登录
在这里先说一个注意事项：不要被网上的沙箱给误导了 沙箱环境拼接的URL和appID是和正式环境配置的不同这里以正式举例 (/oauth2/publicAppAuthorize.htm?app_id=APPID&scope=SCOPE&redirect_uri=ENCODED_URL)
下方举例注意域名部分
正式环境配置与创建详情见官方文档
正确环境域名为以及app_id则为正式的APPID
沙箱环境配置与创建详情见官方文档
沙箱环境域名为以及app_id则为沙箱的APPID
这里记录一下问题：支付宝授权登录是要加功能的，授权功能名为获取会员信息，添加功能直接搜索就可以了，还有一点就是支付宝和微信的回调域名配置不同，微信为回调域，配置域名就可以,支付宝不同，代码配置的回调地址必须和你的应用中回调地址相同才可以
一、定义获取code方法
在你所要操作登录页面方法中，当前记录实例为回调地址就是我当前页面
GetUrlParame(parameName) {/// 获取地址栏指定参数的值// 获取url中跟在问号后面的部分var parames = window.location.search;// 检测参数是否存在if (parames.indexOf(parameName) > -1) {var parameValue = "";parameValue = parames.substring(parames.indexOf(parameName),parames.length);// 检测后面是否还有参数if (parameValue.indexOf("&") > -1) {// 去除后面多余的参数, 得到最终 parameName=parameValue 形式的值parameValue = parameValue.substring(0, parameValue.indexOf("&"));// 去掉参数名, 得到最终纯值字符串parameValue = parameValue.replace(parameName + "=", "");return parameValue;}return "";}}
2.拼接URL跳转登录页面
在这里的方法就可以直接入支付宝登录方法中
var code = this.GetUrlParame("auth_code"); // 截取codeif (!code) {// 如果没有code，说明用户还没授权let appID = "你的APPID"; // 你的 APPIdlet redirectUrl = '你自己的回调地址'; // 获取到 auth_code 后的回调地址let authorizeUrl =`/oauth2/publicAppAuthorize.htm?app_id=${appID}&scope=auth_user&redirect_uri=` +`${encodeURIComponent(redirectUrl)}`+`&state=init`;window.location.href = authorizeUrl; // 跳转链接获取code} else {// 有code，说明用户点击了授权 将获取到的code传递给后台,换取xtoken、用户信息、和userid然后处理你自己的逻辑就可以了http.post("p-alipayUserId-query", {code: code }).then(res => {if (res.code == "ok") {console.log(res)} else {Toast(res.message);}});}
总结
以上就是今天要讲的内容，本文仅仅简单介绍了支付宝授权登录以及注意事项，适合小白参考，少走弯路
