微信公众号开发(4)-获取微信网页授权

微信公众号访问第三方网页的时候，需要获取微信授权，获取用户基本信息。

文档如下：https://mp.weixin.qq.com/wiki?t=resource/res_main&id=mp1421140842

在获取微信网页授权之前，需要在公众平台中配置授权回调域名。

网页授权有两种scope:

1、以snsapi_base为scope发起的网页授权，是用来获取进入页面的用户的openid的，需要注意的是，即使没有关注公众号的用户啊，只要进入到页面，都会有一个openid。这种方式是静默授权并自动跳转到回调页的。用户感知的就是直接进入了回调页即业务页面。

2、以snsapi_userinfo为scope发起的网页授权，是用来获取用户的基本信息的。但这种授权需要用户手动同意，并且由于用户同意过，所以无须关注，就可在授权后获取该用户的基本信息，拉取到的用户信息如下：

网页授权流程：

• 1.引导用户进入授权页面同意授权，获取code.

可以直接在自定义菜单的时候把授权同意页面的链接放到菜单地址中去，这样用户一点击就在获取授权，appid就是公众号的appid,redirect_uri就是服务器上页面所在的地址，response_type可以直接写code,scope按照自己的需求选择snsapi_base或者snsapi_userinfo，state是自己需要的参数，可以自己添加，#wechat_redirect必须带着。参数顺序不能换，由于授权操作安全等级较高，在发起授权请求时，微信会对授权链接做正则强匹配校验，如果链接的参数顺序不对，授权页面将无法正常访问

https://open.weixin.qq.com/connect/oauth2/authorize?appid=APPID&redirect_uri=REDIRECT_URI&response_type=code&scope=SCOPE&state=STATE#wechat_redirect
           

• 2.通过code获取网页授权的access_token

当用户点击了公众号菜单中或其他引导链接进入授权后，页面的链接会变成redirect_uri/?code=CODE&state=STATE，即页面所在域名的url和微信拼接的code和参数。由于获得的是access_token和secrect安全级别比较高，前端不去获取，而是把code传给服务端，由服务端去获取并且保存。

前端所做的就是截取code并传给后端。

getCode() {//直接从网址截取code给后台
    let urlParamsArray =  window.location.split('?')[1].split('&')[0];
    return  urlParamsArray.split('=')[1];
  },
           

• 3.刷新access_token

由于access_token拥有较短的有效期，当access_token超时后，可以使用refresh_token进行刷新，refresh_token有效期为30天，当refresh_token失效之后，需要用户重新授权。这一步也是服务端进行。

• 4.获取用户信息

得到access_token和openid之后就可以去获取用户信息，根据自己的需求去选择使用的用户信息即可。