微信中微信受权逻辑

开篇我先吐槽一下微信开发者的文档，千年不更新。

写文时间：2020年3月14日，先敲个时间，别那边偷偷改了有人吐槽我。

文档中写的拒绝和容许都会触发回调，而后我测试拒绝的时候就不会触发回调。

微信受权逻辑

1. 进入页面，获取受权状态，（getUserid）通常是看cookie里面有用户信息吗。
2. 有用户信息，pass。

3. 无用户信息。这里只是打个标记，并不在一进入页面就强制受权。而是在用户操做的时候提示用户受权，由于这样体验比较好。
   体验上是能够告诉用户你浏览咱们是不须要你的信息的，而你在咱们平台互动是须要注册登陆的。

   1. 用户拒绝受权，这里页面是无感知的，因此不作任何处理。可是页面能够知道用户是非首次互动，这时候能够先弹出一个框告知用户，用户须要容许受权。
   2. 用户容许受权，这个时候会触发刷新页面。这里建议页面给本身加个标记，就是用户触发受权的事件，刷新以后从新调用一下。

需求一: 拒绝受权的时候弹窗

嘿嘿你猜我在作的是什么。

我看以前代码是有拒绝回调逻辑的，并且我也在文档中确认过了。
可是我在测试的时候发现，拒毫不会触发回调，成功的时候逻辑是对的。

那么在这个场景下，咱们怎么显示呢？

1. 咱们作一个小页面藏在受权弹框后面，由于拒绝的时候页面无变化，用户就能够看到后面的小页面。
2. 基于方案1咱们发现，网慢的状况下，赞成受权的用户也会看到弹窗，这对于咱们要求体验的前端er来讲是很差的。咱们这里能够尝试给一个稍微大一点的setTimeout显示小页面。
3. 基于方案2，由于微信受权弹窗不会阻塞主进程，因此咱们并不能稳定控制小页面的显示与隐藏。极端状况下用户的体验还是很差的。那么咱们应该怎么办呢？捶产品，砍需求，哈哈固然是不作这个弹框，把这部分的功能换另外一种交互方式咯。

需求二: 非微信绑定的域名作微信受权

由于如今微信管得太严了，怕被微信拉黑，因此考虑使用其余域名作分享外链。

可是咱们又但愿能够在微信受权登陆一下，这样这个需求就来了。

微信中绑定的安全域名和回调域名为 a.com，
咱们分享到微信打开的域名为 b.com。

方案一：跨域方案

首先咱们要明确几个要点。

1. 我方服务端判断登陆是判断 cookie 。
2. 对于前端来说 a.com 和 b.com 是跨域的。
3. a.com 是没法把 cookie 写到 b.com 下的。
4. 一样 b.com 也没法读取 a.com 的 cookie。

好了基于上面的要点。咱们开始实现功能。

1. a.com/wxauth 会触发微信受权，咱们默认用户赞成受权
2. 微信会将页面重定向到 callback 页面。（这里是在公众号配置好的）
3. callback 页面写 cookie。这个时候咱们就能拿到用户登陆信息。
4. 可是基于上面咱们跨域的cookie是没法共享的。那么咱们能够开CORS来使用，a.com 的接口容许 b.com的页面发出请求。
5. 可是跨域的状况下默认是不携带 cookie 的。这个时候咱们能够配置 withCredentials 来达到携带cookie的目的。

基于上面的跨域方案，咱们 b.com 下面没有任何 cookie，只有页面。
咱们全部的请求和 cookie 都放在 a.com。

方案二：共享，我以为叫受权验证也能够

上个方案是全部请求都走 a.com。

这个方案是全部请求都走当前域名。我网上看了几个别人作好的，也都是这种方案。

这种方案其实能够把 a.com 理解成第三方平台。

微信公众号：前端linong