ajax 微信code获取_ajax 实现微信网页授权登录的方法
项目背景
因为项目采用前后端完全分离方案,所以,无法使用常规的微信授权登录作法,需要采用 ajax 实现微信授权登录。
需求分析
因为本人是一个phper ,所以,微信开发采用的是 EasyWeChat ,所以实现的方式是基于EW的。
其实实现这个也麻烦,在实现之前,我们需要了解一下微信授权的整个流程。
引导用户进入授权页面同意授权,获取code
通过code换取网页授权access_token(与基础支持中的access_token不同)
如果需要,开发者可以刷新网页授权access_token,避免过期
通过网页授权access_token和openid获取用户基本信息(支持UnionID机制)
其实说白了,前端只需要干一件事儿,引导用户发起微信授权页面,然后得到code,然后跳转到当前页面,然后再请求后端换取用户以及其他相关信息。
功能实现
引导用户唤起微信授权确认页面
这里需要我们做两件事,第一去配置jsapi域名,第二配置微信网页授权的回调域名
构建微信授权的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我们从连接中看到有两个变量,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 = 'xxxxxxxxxxxxxxxxxxx';
var oauth_url = 'xxxxxxxxxxxxxxxxxxx/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 实现微信网页授权登录的方法相关推荐
- java ajax 微信网页授权_ajax 实现微信网页授权登录的方法
AJAX 的 ajax 实现微信网页授权登录的方法 项目背景 因为项目采用前后端完全分离方案,所以,无法使用常规的微信授权登录作法,需要采用 ajax 实现微信授权登录. 需求分析 因为本人是一个ph ...
- 微信网页授权登录的方法
微信网页授权登录官方文档 微信网页授权登录的方法–推荐文章一 微信网页授权登录的方法–推荐文章二 总结: 微信授权方式(scope的属性值控制): 应用授权作用域,snsapi_base (不弹出授权 ...
- 微信公共平台接入之:网页授权(微信授权,微信access_token获取,获取微信用户信息),微信开发者工具使用,微信公众平台测试号申请接入
1.微信公众平台文档入口 微信公众平台入口地址:https://mp.weixin.qq.com/,截图: 进入之后的文档地址: https://mp.weixin.qq.com/wiki?t=res ...
- 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 企业微信三方开发(三):网页授权登录 ...
- php 微信开发 网页授权登录,微信开发网页授权登录——2018年6月2日
微信网页授权登录用户同意授权,获取code 通过code,获取网页的access_token 拉取用户信息(scope 为snsapi_userinfo) application\index\cont ...
- 微信公众号开发(一) 微信网页授权登录
微信网页授权登录 前期准备 授权登录 获取微信数据 处理授权拒绝 前期准备 1.微信公众号开发,首先要搞一个公众号,开发阶段可以申请一个公众平台测试账号. (进入到微信公众公众平台,找到开发者工具,点 ...
最新文章
- LeetCode简单题之使每位学生都有座位的最少移动次数
- python矩阵运算库效率_python - 布尔矩阵运算的最快方法_performance_酷徒编程知识库...
- LeetCode: 38. Count and Say
- 原来 Excel 只需三步就可以给证件照换底色!
- 【Matlab】判断是否为空?是否为NaN?
- android and javascript
- System.Math.Min(System.Threading.Interlocked.Increment(i), i - 1)
- JavaScript: Cookie 详解、实例与应用
- 关于Java静态属性初始化
- 一步一步写算法(之爬楼梯)
- SpringMVC中的拦截器、过滤器的区别、处理异常
- spring-boot spring-security-oauth2
- python中的json模块
- 你真的理解this吗
- 注释一下blk_update_request函数
- 在3小时内学习Kubernetes:编排容器的详细指南
- E - Competitive Seagulls(博弈)
- 数学建模题目之在线教学的分析与研究
- Linux升级gcc到最新版本gcc-11.2.0
- 脚本自动化部署docker微服务,取代Jenkins
热门文章
- Git根据远程分支建立条新的远程分支
- php 从放弃到坚持放弃,从放弃到坚持作文
- java synchronized 原理_Java Synchronized的原理
- php并行运算,php多进程并行执行脚本的代码
- es 全量同步mysql_什么时候该用MySQL,什么时候该用ES呢?
- PHP将数组存入数据库中的四种方式
- 服务器文件描述,服务器编程中的文件描述符
- ps字体识别_PS字体包免费送:艺术+时尚+炫酷+复古等5000多款字体,由你来选择
- 洛阳理工Linux实验报告,洛阳理工学院实验报告.doc
- base64 RFC 4648