let pages = 'https://open.weixin.qq.com/connect/oauth2/authorize?
appid='+自己的appid+'&redirect_uri='+授权登录后返回的页面+'&response_type=code&scope=snsapi_userinfo&state=STATE#wechat_redirect'
//我是用的非静默授权，snsapi_userinfo 需要用户手动同意
window.location.href = pages
第二步：获取页面返回的code
//这个是解析url参数的方法
var getRequest = function() {
var url = window.location.search
var theRequest = new Object()
if (url.indexOf("?") != -1) {
var str = url.substr(1)//获取url中"?"符后的字串
var strs = str.split("&")
for (var i = 0i <strs.lengthi++) {
theRequest[strs[i].split("=")[0]] = unescape(strs[i].split("=")[1])
}
}
return theRequest
}
//判断url中是否有code
if(getRequest.code){
// H5获取微信accesstoken
this.getWxAccessToken(getRequest.code)
}
第三步： 通过code换取网页授权access_token(这些步骤后端会处理 前端只需要调用后端的一个接口)
会返回 openid，通过openid登录就好了
window.location.href = '链接地址'
1 第一步：用户同意授权，获取code
2 第二步：通过code换取网页授权access_token
3 第三步：刷新access_token（如果需要）
4 第四步：拉取用户信息(需scope为 snsapi_userinfo)
5 附：检验授权凭证（access_token）是否有效
如果有什么不对或者不懂的地方欢迎私聊哦
开发文档: https://mp.weixin.qq.com/wiki?t=resource/res_main&id=mp1445241432
由于我这边申请过了所以不做过多演示,这里我们需要注意几个地方,我们如果不适用JDSK的话只需要关注红色方框的地方,如果需要使用JSDK如调用相机、分享等。
其次测试号微信授权需要配置回调域名所以我们需要配置Natapp映射的域名,这里配置的地址只需要域名,配置在页面服务->网页账号->修改。
核心pom.xml。
核心application.yml。
以下配置类@Data使用了Lombok文章中没有说明配置的话自己百度或者自己写GetSet。
这个配置类的由来主要是因为WxMpService接口有多个实现类自动注入的话IOC不知道使用哪个实现类,还有就是每次调用API接口如查用户、素材之类。每次之前都要设置一个wxMpConfigStorage,所以我们这里使用了一个组件来管理相关的Bean配置。
其中我们大体的可以看出authorizationUrl接口是用户在微信端点击的授权API其次方法中才是构建微信授权链接让项目自己去重定向之后会到回调地址userInfo接口这里大家可以自由发挥返回前端页面也可以。
下方就是微信授权访问接口中的方法和官方参数解析。
项目启动之后我们需要把外部访问请求发送到自己的测试公众号前提需要关注。
以上就是用户授权的操作一般在公众号开发嵌入H5网页常用的第一步还有就是jdsk验证也需要这里不细讲可以百度相关教程,使用了此SDK之后不需要自己去封装一些API操作简便了微信开发。（此教程于博客迁移,时间并非当日编写其次可去GitHub搜索weixin-java-mp看最新文档和相关使用教程）
