首先放上官方文档
获取公众号授权可以获取到用户的openId，可以通过openId获取到用户的昵称、性别、所在地等信息
获取授权的流程：
首先需要用户打开或者跳转到授权页，用户点击统一后跳转到我们设置的回调页面（比如项目首页）
授权后跳转回来的页面，url上会有code，我们把code传到后端，换取openId
完成…
1、首先是配置网页授权域名
在微信公众平台中左侧菜单拉到底，选择公众号设置，然后下边有个网页授权域名，输入需要授权的域名后，不要忘了把设置页面中的文件扔给后端
2、跳转授权页
配置好域名后，通过https://open.weixin.qq.com/connect/oauth2/authorize…链接跳转到授权页面，获取授权后在url中拿到code传给后端就可以了
授权链接的详细配置：
var url = ‘https://open.weixin.qq.com/connect/oauth2/authorize?’ +
‘appid=你的公众号appId’ + // #1
‘&redirect_uri=获取授权成功后重定向的url’ + // #2
‘&response_type=code’ + // #3
‘&scope=snsapi_base或snsapi_userinfo’ + // #4
‘&state=跳转回redirect_uri后带的参数’ + // #5
‘#wechat_redirect’
1
2
3
4
5
6
7
解释：
#1 appid：直接传入你得公众号AppId就可以，AppId的保密等级不高，所以不用担心直接暴露在URL中
#2 redirect_uri：打开授权页面后，用户点击后，会回调到redirect_uri页面，需要使用encodeURIComponent方法对url进行处理
#3 response_type：固定填写字符’code’
#4 scope：scope有两个可选值 1、snsapi_base：不弹出授权页面，直接跳转，只能获取用户openId 2、snsapi_userinfo：出授权页面，可通过openid拿到昵称、性别、所在地。并且， 即使在未关注的情况下，只要用户授权，也能获取其信息（如果用户关注了公众号，snsapi_userinfo也不会弹出授权页面）
#5 state：跳转回来以后url中所带的参数，只能填写a-zA-Z0-9的参数值，最多128字节 例：redirect_url填写的是百度，回调后地址http://www.baidu.com/?state=aaaaaaaaa
#6 #wechat_redirect： 必填
问题
1、传参问题
因为微信接口中只提供了state传参，所以导致我们跳转到redirect_uri对应的url后，需要的传参很多没办法传或者需要传的名字必须是某个值而不是state
解决办法 其实我们可以直接把参数拼接在redirect_uri地址的后边，比如我需要统计网页的进入渠道，需要在url上传参utm_source=xxxx,我们可以直接拼到redirect_uri后
比如CSDN的网站后边要拼接utm_source=baidu、userName=xuanxing
那么网站地址就是https://www.csdn.net/?utm_source=baidu&userName=xuanxing
不要忘了对地址进行转码encodeURIComponent(‘https://www.csdn.net/?utm_source=baidu&userName=xuanxing’) // https%3A%2F%2Fwww.csdn.net%2F%3Futm_source%3Dbaidu%26userName%3Dxuanxing
redirect_uri=https%3A%2F%2Fwww.csdn.net%2F%3Futm_source%3Dbaidu%26userName%3Dxuanxing
2、跳转问题
因为微信的授权是跳转到他的授权页面然后再跳转回来，虽然微信授权页的跳转是用的replace，但是在整个跳转过程（我们的页面 -> 微信授权页面 -> 我们的页面）中，还是会产生一次路由，即使我们跳转用的都是replace。这个问题会导致用户在首页后退时体验不太友好
这个问题我目前还没有找到最优的解决办法，各位大佬们如果有好的办法麻烦帮帮小弟，不过暂时有两个不太完美的解决方法
以放在公众号底部自定义菜单作为例子
不经过我们的页面，直接把页面地址配置成微信授权页面的地址，这样会直接进入微信授权的页面，微信授权页面 -> 我们的页面 这个过程中不会产生路由，可以解决跳转问题，缺点是需要配置的url过长，而且只适用与每次进入必须需要授权的页面
在这里插入图片描述
第一次获取到code并且和后端交互拿到token/openId后，存在localStorage中，在请求数据时，如果token过期，再跳转到微信授权页面，这样虽然还是会有两次跳转的问题，但是会极大的减少了用户不良体验的次数
------end------