今天准备详细讲解h5页面嵌入微信公众号中 然后获取用户的openid
一：微信授权域名
1.首先去登录微信开发者平台 公众号设置-》功能设置 “网页授权域名”去设置 （请注意，①：这里填写的是域名（是一个字符串），而不是URL，因此请勿加 http:// 等协议头 ②：配置www.qq.com 域名 那http://www.qq.com/land.html或者 http://www.qq.com/login.html都可以进行授权）
2.将开发者ID appId记录下来 并将下面MP_开头的文件下载下来 放在域名的根目录下面。
二：获取code
window.location.href = "https://open.weixin.qq.com/connect/oauth2/authorize?appid=APPID&redirect_uri=REDIRECT_URI&response_type=code&scope=SCOPE&state=STATE#wechat_redirect"
参数具体参见以上 。
三.用户同意授权后
用户授权后会跳到你redirect_uri设置的url 后面加上 redirect_uri/?code=CODE&state=STATE 这里要截取url带的code并准备调下一个接口
四：获取openid
因为我的scope设置的是snsapi_base 我只要拿到openid就好了 ，所以到这一步就截止了
这一步微信提供了https://api.weixin.qq.com/sns/oauth2/access_token?appid=APPID&secret=SECRET&code=CODE&grant_type=authorization_code
参数具体参见以上
但是会有一个跨越问题，所以这一步的接口需要后台去调，前端把参数传给后台 ，后台返回数据就可以解决跨越问题
注意：之前我在写的时候 把这两个接口调用全部放在一个页面 然后会导致微信不停的授权 其实是错的。然后我就把第一个接口调用放在一个loading页面 设置redirect_uri是真正需要openid的页面，也就是loading只是用来跳转用的，当然loading页面也是在之前设置的域名下面。
还有一个问题 就是微信的pc浏览器是不解析es6语法 只能识别es5语法
以上内容具体参见微信开发者文档 https://mp.weixin.qq.com/wiki?t=resource/res_main&id=mp1421140842