ajax 微信code获取_ajax实现微信网页授权登录
码农公社 210.net.cn 210是何含义?10月24日是程序员节,1024 =210、210既
210
之意。
因为项目采用前后端完全分离方案,所以,无法使用常规的微信授权登录作法,需要采用 ajax 实现微信授权登录。
本案例采用的是 EasyWeChat ,所以实现的方式是基于EW的。
在实现之前,了解一下微信授权的整个流程。
>引导用户进入授权页面同意授权,获取code
>通过code换取网页授权access_token(与基础支持中的access_token不同)
>如果需要,开发者可以刷新网页授权access_token,避免过期
>通过网页授权access_token和openid获取用户基本信息(支持UnionID机制)
说白了,前端只需要干一件事儿,引导用户发起微信授权页面、得到code、跳转到当前页面、再请求后端换取用户以及其他相关信息。
功能实现
引导用户唤起微信授权确认页面
我们需要做两件事:去配置jsapi域名、配置微信网页授权的回调域名
构建微信授权的ur:
"https://open.weixin.qq.com/connect/oauth2/authorize?appid=" + appId + "&redirect_uri=" + location.href.split('#')[0] + "&response_type=code&scope=snsapi_userinfo&state=STATE#wechat_redirect
咱们看到有两个变量,appId,以及 redirect_uri。
appId 不用多说,就是咱们将要授权的微信公众号的appId,另一个回调URL,其实就是我们当前页面的URL。
用户微信登录授权以后回调过来的URL 会携带两个参数 ,第一个是code,另一个就是 state。
我们需要做就是将code获取到然后传给后端,然后通过code 获取用户基本信息。
后端得到code以后,获取用户基本信息,并返回相关其他信息给前端,前端获取到然后做本地存储或者其他。
function getUrlParam(name) {
var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
var r = window.location.search.substr(1).match(reg);
if (r != null) return unescape(r[2]);
return null;
}
function wxLogin(callback) {
var appId = 'www.210.cx';
var oauth_url = 'www.210.cx/oauth';
var url = "https://open.weixin.qq.com/connect/oauth2/authorize?appid=" + appId + "&redirect_uri=" + location.href.split('#')[0] + "&response_type=code&scope=snsapi_userinfo&state=STATE#wechat_redirect"
var code = getUrlParam("code");
if (!code) {
window.location = url;
} else {
$.ajax({
type: 'GET',
url: oauth_url,
dataType: 'json',
data: {
code: code
},
success: function (data) {
if (data.code === 200) {
callback(data.data)
}
},
error: function (error) {
throw new Error(error)
}
})
}
ajax 微信code获取_ajax实现微信网页授权登录相关推荐
- ajax 微信code获取_ajax 实现微信网页授权登录的方法
项目背景 因为项目采用前后端完全分离方案,所以,无法使用常规的微信授权登录作法,需要采用 ajax 实现微信授权登录. 需求分析 因为本人是一个phper ,所以,微信开发采用的是 EasyWeCha ...
- 微信公共平台接入之:网页授权(微信授权,微信access_token获取,获取微信用户信息),微信开发者工具使用,微信公众平台测试号申请接入
1.微信公众平台文档入口 微信公众平台入口地址:https://mp.weixin.qq.com/,截图: 进入之后的文档地址: https://mp.weixin.qq.com/wiki?t=res ...
- java ajax 微信网页授权_ajax 实现微信网页授权登录的方法
AJAX 的 ajax 实现微信网页授权登录的方法 项目背景 因为项目采用前后端完全分离方案,所以,无法使用常规的微信授权登录作法,需要采用 ajax 实现微信授权登录. 需求分析 因为本人是一个ph ...
- php微信授权ajax,ajax 实现微信网页授权登录
项目背景 因为项目采用前后端完全分离方案,所以,无法使用常规的微信授权登录作法,需要采用 ajax 实现微信授权登录. 需求分析 因为本人是一个PHPer ,所以,微信开发采用的是 EasyWeCha ...
- PHP微信公众号网页授权登录 扫码登录 获取用户基本信息
前言 现在微信登录是一个网站.APP的标配,所以微信授权登录是我们应该要掌握的.微信授权登录有4种方式: 1.通过微信开放平台 2.通过认证的微信服务号 3.通过认证的微信订阅号 4.通过微信小程序曲 ...
- 微信授权demo php,PHP微信公众平台oauth2.0网页授权登录类的封装demo
一.微信授权使用的是OAuth2.0授权的方式.主要有以下简略步骤: 第一步:用户同意授权,获取code 第二步:通过code换取网页授权access_token 第三步:拉取用户信息(需scope为 ...
- 企业微信三方开发(三):网页授权登录
其他链接 初识微信开发 企业微信三方开发:注册企业微信服务商 企业微信三方开发(一):回调验证及重要参数获取 企业微信三方开发(二):获取access_token 企业微信三方开发(三):网页授权登录 ...
- 微信网页授权登录的方法
微信网页授权登录官方文档 微信网页授权登录的方法–推荐文章一 微信网页授权登录的方法–推荐文章二 总结: 微信授权方式(scope的属性值控制): 应用授权作用域,snsapi_base (不弹出授权 ...
- php 微信开发 网页授权登录,微信开发网页授权登录——2018年6月2日
微信网页授权登录用户同意授权,获取code 通过code,获取网页的access_token 拉取用户信息(scope 为snsapi_userinfo) application\index\cont ...
- 微信公众号开发(一) 微信网页授权登录
微信网页授权登录 前期准备 授权登录 获取微信数据 处理授权拒绝 前期准备 1.微信公众号开发,首先要搞一个公众号,开发阶段可以申请一个公众平台测试账号. (进入到微信公众公众平台,找到开发者工具,点 ...
最新文章
- 国产搜索引擎首超Google 中文搜索瓦解霸权?
- 【自动驾驶】28.【右手坐标系】与【右手法则】分析、【右手法则的正方向】 与 【逆时针为正方向】 的分析
- Linux下的inode记录
- [转载][记录]javascript生成不重复的随机数
- 【双100%解法】剑指 Offer 24. 反转链表
- javafx打包路径问题_关于JavaFX的最常见问题
- XML解析之JAXP案例详解
- Docker : Docker使用DockerFile入门案例
- js原生实现贪吃蛇(解决连续键盘事件)
- php input type属性,input标签是什么?input标签属性有哪些
- 谁将是互联网宝宝军团的最大劲敌?
- 没做过项目经理可以考pmp证书吗?普通人考PMP®有用吗?
- php sql多字段求和,JSP_sql实现多字段求和并查询,下面就sql多字段求和并作为sql - phpStudy...
- 金融day03 —— 银行支付结算、银行资产业务
- 如何把数据分类后各个行的值合并成一个格
- JAVA毕设项目后勤管理系统(Vue+Mybatis+Maven+Mysql+sprnig+SpringMVC)
- 关于 腾讯云CentOS8.2重置恢复到自定义镜像后,第三方软件登陆提示需要密钥 的解决方法
- 用pycharm写飞机大战
- CSS 布局 - display 属性
- HTC A510C屏幕失灵补丁