ajax 实现微信网页授权登录的方法

项目背景 因为项目采用前后端完全分离方案，所以，无法使用常规的微信授权登 录作法，需要采用 ajax 实现微信授权登录。 需求分析 因为本人是一个 phper ，所以，微信开发采用的是 EasyWeChat ，所以 实现的方式是基于 EW 的。 其实实现这个也麻烦，在实现之前，我们需要了解一下微信授权的整个 流程。 引导用户进入授权页面同意授权，获取 code 通过 code 换取网页授权 access_token(与基础支持中的 access_token 不 同) 如果需要，开发者可以刷新网页授权 access_token，避免过期 通过网页授权 access_token 和 openid 获取用户基本信息(支持 UnionID 机制) 其实说白了，前端只需要干一件事儿，引导用户发起微信授权页面 ,然后 得到 code,然后跳转到当前页面,然后再请求后端换取用户以及其他相关信息。 功能实现 引导用户唤起微信授权确认页面 这里需要我们做两件事，第一去配置 jsapi 域名，第二配置微信网页授 权的回调域名 构 建 微 信 授 权 的 url "https://open.weixin.qq.com/connect/oauth2/authorize?appid=" + appId + "&redirect_uri=" + location.href.split('#')[0] + "&response_type=code&scope=snsapi_userinfo&state=STATE#wechat_redi rect 我们从连接中看到有两个变量，appId,以及 redirect_uri。appId 不用多 说，就是咱们将要授权的微信公众号的 appId,另一方个回调 URL，其实就是 我们当前页面的 URL。 用户微信登录授权以后回调过来的 URL 会携带两个参数 ，第一个是 code,另一个就是 state。才是我们需要做的一件事儿就是将 code 获取到然 后传给后端，染后端通过 code 获取用户基本信息。 后端得到 code 以后，获取用户基本信息，并返回相关其他信息给前端， 前端获取到然后做本地存储或者其他。 function getUrlParam(name) { var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)"); var r = window.location.search.substr(1).match(reg); if (r != null) return unescape(r[2]); return null; } function wxLogin(callback) { var appId = 'xxxxxxxxxxxxxxxxxxx'; var oauth_url = 'xxxxxxxxxxxxxxxxxxx/oauth'; var url = "https://open.weixin.qq.com/connect/oauth2/authorize? appid=" + appId + "&redirect_uri=" + location.href.split('#')[0] + "&response_type=code&scope=snsapi_userinfo&state=STATE#wechat_redi rect" var code = getUrlParam("code"); if (!code) { window.location = url; } else { $.ajax({ type: 'GET', url: oauth_url, dataType: 'json', data: { code: code }, success: function (data) { if (data.code === 200) { callback(data.data) } }, error: function (error) { throw new Error(error) } }) } 补充：微信使用小技巧 电脑登陆微信后，将手机调为静音状态： 登陆微信不仅可以使用手机登陆，而且还可以使用电脑登陆。首先点开 电脑版微信，使用手机扫描二维码登陆。 手机的微信和电脑的微信可以同时登陆的，而且接收到的信息，电脑和 手机都可以收的到。 但是手机和电脑同时接收信息，两个设备都有提示音，这会感觉让人很 烦。那么如何关掉手机端的声音呢 当你在 pc 端登陆微信之后，在手机微信聊天界面顶部会有一条状态栏 ， 点击它，然后在该界面中选择【手机静音】即可。 也可以通过刚才的操作，快速的打开【文件传输助手】。 拉黑微信运动里的好友： 自从有了【微信运动】之后，每天都会为了占到榜首而去刷步数，但是 你不想天天看到某人的封面、步数或是不想人某人看到你的步数，那么该如 何操作。 首先最简单、直接的方法就是拉黑该好友，但这太不道义了。 你可以通过【微信运动】来拉黑好友。首先点开【微信运动】，然后点 击【微信运动】页面右上角的【齿轮】图标。 找到并点开【隐私及提醒设置】>【不与他(她)排行】，再点击【+】就 可以把好友拉黑，你看不到 ta 的排行，ta 也看不到你的排行。 相关阅读：微信忘记了密码怎么办 通过手机号找回：用手机注册或已绑定手机号的微信帐号，可用手机找 回密码，在微信软件登录页面点击“忘记密码”=》通过手机号找回密码=》输 入注册的手机号，系统会下发一条短信验证码至手机，打开手机短信中的地 址链接(也可在电脑端打开)，输入验证码重设密码即可。 通过邮箱找回：通过邮箱注册或绑定邮箱、并已验证邮箱的微信帐号， 可用邮箱找回密码，在微信软件登录页面点击“忘记密码”=》通过 Email 找回 密码=》填写绑定的邮箱地址，系统会下发重设密码邮件至注册邮箱，点击 邮件的网页链接地址，根据提示重设密码即可。 通过注册 QQ 号找回：用 QQ 号注册的微信，微信密码同 QQ 密码是相 同的，请在微信软件登录页面点击“忘记密码”=》通过 QQ 号找回密码=》根 据提示找回密码即可，也可以点击这里进入 QQ 安全中心找回 QQ 密码。