【微信公众号】微信公众号网页授权:

news2025/4/17 3:54:02

文章目录

        • 一、添加业务域名
        • 二、前端授权获取code
            • 【1】参数说明:
            • 【2】静默授权与显式授权的区别:
            • 【3】前端获取code的代码:
        • 三、后端获取openid(或unionid)
            • 【1】获取openid:
            • 【2】获取unionid
        • 四、unionid与openid的区别


在微信公众号开发时候,一般需要使用到微信登录功能,这里就需要加入微信授权,来获取用户的openid(或unionid),利用openid(或unionid)做唯一的身份识别。
【公众号开发文档】https://developers.weixin.qq.com/doc/

一、添加业务域名

这是很重要的一步,js安全域名配置配置,添加方式如下:
登录微信公众号平台->开发->接口权限->网页授权(修改),进入后选择“js接口安全域名”进行添加即可。
图片
需要注意两点:
1)、端口必须是默认80端口,添加的域名不能带端口号!(这是微信规定的)
2)、下载的txt验证文件必须放置在提供的域名目录下。
配置好之后,直接浏览器地址栏访问这个路径,能打开就成功了。

二、前端授权获取code

微信授权的第一步,是前端获取微信返回的code值,把code值传递给服务器端才能获取到用户的openid(或unionid)。
那怎么拿到微信返回的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 
#若提示“该链接无法访问”,请检查参数是否填写错误,是否拥有scope参数对应的授权作用域权限。
【1】参数说明:

APPID:公众号的唯一标识,申请公众号已经分配好的;
REDIRECT_URL : 在成功拿到code值,你需要跳转到你项目的路径地址,比如login.html之类的;
SCOPE :有两个固定值:snsapi_base(静默授权),snsapi_userinfo(显式授权) ,两者任选其一;
STATE : 这个参数是自定义,什么值都行,你配置什么值,到时候跳转回来后,原样给你带回来,需要注意的是有格式要求(重定向后会带上state参数,开发者可以填写a-zA-Z0-9的参数值,最多128字节);

【2】静默授权与显式授权的区别:

1、静默授权:以snsapi_base为scope发起的网页授权,是用来获取进入页面的用户的openid的,并且是静默授权并自动跳转到回调页的.(静默的另一种:对于已关注公众号的用户,如果用户从公众号的会话或者自定义菜单进入本公众号的网页授权页,即使是scope为snsapi_userinfo,也是静默授权,用户无感知。)

2、显式授权:以snsapi_userinfo为scope发起的网页授权,是用来获取用户的基本信息的。但这种授权首次需要用户手动同意,并且由于用户同意过,所以无须关注,就可在授权后获取该用户的基本信息。

【3】前端获取code的代码:
methods: {//(以vue为例)
  getCode() { // 非静默授权,第一次有弹框
    this.code = ''
	var local = window.location.href // 获取页面url
	var appid = 'wx65adcf075369****'
    this.code = this.getUrlCode().code // 截取code
    if (this.code == null || this.code === '') { // 如果没有code,则去请求
      window.location.href =`https://open.weixin.qq.com/connect/oauth2/authorize?
      appid=${appid}&redirect_uri=${encodeURIComponent(local)}&response_type=code&
      scope=snsapi_userinfo&state=123#wechat_redirect`
    } else {
      // 你自己的业务逻辑
    }
  },
  getUrlCode() { // 截取url中的code方法
    var url = location.search
    this.winUrl = url
    var theRequest = new Object()
    if (url.indexOf("?") != -1) {
      var str = url.substr(1)
      var strs = str.split("&")
      for (var i = 0; i < strs.length; i++) {
        theRequest[strs[i].split("=")[0]] = (strs[i].split("=")[1])
      }
    }
    return theRequest
  }
}
#代码逻辑是先判断有没有code,没有才去获取,使用encodeURIComponent()对回调url进行编码。

三、后端获取openid(或unionid)

这里一般是有前端传递code给后端,由后端请求微信提供的接口,来获取用户的openid(或unionid)

【1】获取openid:

get请求接口链接如下:
https://api.weixin.qq.com/sns/oauth2/access_token?appid=APPID&secret=SECRET&code=CODE&grant_type=authorization_code

参数说明:
appid 是 公众号的唯一标识
secret 是 公众号的appsecret
code 是 填写第一步获取的code参数
grant_type 是 填写为authorization_code
成功返回数据如下:

{ 
  "access_token":"ACCESS_TOKEN", //接口调用凭证
  "expires_in":7200,//access_token接口调用凭证超时时间,单位(秒)
  "refresh_token":"REFRESH_TOKEN",//用户刷新access_token
  "openid":"OPENID",//授权用户唯一标识
  "scope":"SCOPE"//用户授权的作用域,使用逗号(,)分隔
}
#如果你只需要得到opend_id,这里就结束了。如果需要获取unionid则还需要请求下面接口。
【2】获取unionid

通过返回的openid和access_token获取用户信息,get请求接口如下:
https://api.weixin.qq.com/sns/userinfo?access_token=ACCESS_TOKEN&openid=OPENID&lang=zh_CN

(1)scope为snsapi_userinfo显式授权返回的数据如下:

{
	"subscribe": 1,//用户是否订阅该公众号标识,值为0时代表此用户没有关注该公众号
	"openid":" OPENID",//用户的标识,对当前公众号唯一
	" nickname": NICKNAME,//用户的昵称
	"sex":"1",//用户的性别,值为1时是男性,值为2时是女性,值为0时是未知
	"language": "zh_CN",//用户的语言,简体中文为zh_CN
	"province":"PROVINCE"//用户所在省份
	"city":"CITY",//用户所在城市
	"country":"COUNTRY",//用户所在国家
	"headimgurl":"http://xxxx/46",//用户头像,最后一个数值代表正方形头像大小(有0、46、64、96、132数值可选,0代表640*640正方形头像),用户没有头像时该项为空。若用户更换头像,原有头像URL将失效。
	"subscribe_time": 1382694957,//用户关注时间,为时间戳。如果用户曾多次关注,则取最后关注时间
	"unionid": "o6_bmasdasdsad6_2sgVt7hMZOPfL",//UnionID 来区分用户的唯一性,因为只要是同一个微信开放平台帐号下的移动应用、网站应用和公众帐号(包括小程序),用户的 UnionID 是唯一的
	"remark": "",//公众号运营者对粉丝的备注,公众号运营者可在微信公众平台用户管理界面对粉丝添加备注
	"groupid": 0,//用户所在的分组ID(兼容旧的用户分组接口)
	"tagid_list":[128,2]  //用户被打上的标签ID列表
}
#ps:需要获取用户信息,必须使用scope为snsapi_userinfo的方式。

(2)scope为 snsapi_base静默授权返回的数据如下:

{
	"subscribe": 0,
	"openid":" OPENID",
	"unionid": "o6_bmasdasdsad6_2sgVt7hMZOPfL"
}

四、unionid与openid的区别

如果开发者拥有多个移动应用、网站应用、和公众帐号(包括小程序),可通过unionid来区分用户的唯一性,因为只要是同一个微信开放平台帐号下的移动应用、网站应用和公众帐号(包括小程序),用户的unionid是唯一的。
换句话说,同一用户,对同一个微信开放平台下的不同应用,unionid是相同的

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/918592.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

宠物店小程序制作

随着移动互联网的快速发展&#xff0c;宠物店经营者们也纷纷意识到线上市场的潜力。通过开发一款宠物小程序&#xff0c;你可以将你的宠物店推向线上的新机遇&#xff01; 【乔拓云】是一个专业的小程序开发平台&#xff0c;它提供了一套简单易用的工具&#xff0c;帮助你快速创…

JavaSE 方法

定义&#xff1a; 程序执行的最小单元 什么时候用到方法&#xff1a;需要重复运行一段代码的时候&#xff1b; 使用方法的好处&#xff1a;提高代码的可重用性、可维护性 格式&#xff1a; // 一、最简单格式 public static void 方法名(){// 方法体 }// 二、带参数的格式…

炫我为北京轻工技师学院提供渲染私有云系统解决方案

北京轻工技师学院作始建于1964年&#xff0c;是国家级重点学校。学院开设有计算机动画制作、计算机网络应用、电气自动化设备安装与维修、电子技术应用、工业机器人应用与维护等16个专业&#xff0c;本次项目的交付实施涉及该学院的一个重要项目。 ▲北京轻工技师学院 图源网…

【SpringSecurity】五、UserDetails接口和UserDetailsService接口

文章目录 1、SpringSecurity原理2、UserDetails接口3、UserDetailService接口4、权限配置 1、SpringSecurity原理 Spring Security是做安全访问控制&#xff0c;对所有进入系统的请求进行拦截&#xff0c;并做校验&#xff0c;这可以通过Filter或者AOP实现&#xff0c;Spring …

MySQL 条件查询 Emoji 表情符号却返回多条数据【包含其它表情符号】的问题解决 - COLLATION 字符序的选择

1、问题出现 在APP客户端输入搜索文章的关键字时&#xff0c;不小心输入来了一个 emoji 表情符号&#xff0c;提示出错了&#xff0c;在后台查询错误日志信息&#xff0c;提示查询出现了2条相同的记录&#xff1a; Caused by: org.hibernate.NonUniqueResultException: query …

【Java 高阶】一文精通 Spring MVC - 数据格式化器(六)

&#x1f449;博主介绍&#xff1a; 博主从事应用安全和大数据领域&#xff0c;有8年研发经验&#xff0c;5年面试官经验&#xff0c;Java技术专家&#xff0c;WEB架构师&#xff0c;阿里云专家博主&#xff0c;华为云云享专家&#xff0c;51CTO 专家博主 ⛪️ 个人社区&#x…

python - 编程中【工厂模式】和【单例模式】区别以及代码示例详解

一. 概念 工厂模式和单例模式都是面向对象编程中常用的设计模式。 工厂模式&#xff08;FactoryPattern&#xff09;&#xff1a;是一种创建型模式&#xff0c;它提供了一种方法来创建对象&#xff0c;而不需要暴露对象的创建逻辑。这种模式通过定义一个工厂类&#xff0c;通…

优化生产流程:数字化工厂中的OPC UA分布式IO模块应用

背景 近年来&#xff0c;为了提升在全球范围内的竞争力&#xff0c;制造企业希望自己工厂的机器之间协同性更强&#xff0c;自动化设备采集到的数据能够发挥更大的价值&#xff0c;越来越多的传统型工业制造企业开始加入数字化工厂建设的行列&#xff0c;实现智能制造。 数字化…

归一化的作用,sklearn 安装

目录 归一化的作用&#xff1a; 应用场景说明 sklearn 准备工作 sklearn 安装 sklearn 上手 线性回归实战 归一化的作用&#xff1a; 归一化后加快了梯度下降求最优解的速度; 归一化有可能提高精度(如KNN) 应用场景说明 1&#xff09;概率模型不需要归一化&#xff…

强化历程5-Java并发系列(2023.8.23)

文章目录 强化历程5-Java并发系列(2023.8.23)1 Java多线程1.1 Java中多线程有几种实现方式&#xff1f;1.2 那么Runnable和Callable都可以实现多线程&#xff0c;他们有什么区别?1.3 采用实现Runnable和Callable接口方式和采用继承Thread类方式各有什么好处?1.4 Java如何停止…

【数据结构与算法】—— 手撕红黑树

目录 &#xff08;一&#xff09;红黑树的定义 1、红黑树的引入 2、红黑树的概念 3、红黑树的性质 &#xff08;二&#xff09;红黑树的操作 1、红黑树节点的定义 2、红黑树的插入操作 1️⃣ 思路 2️⃣ 代码实现 3、红黑树的删除操作&#xff08;了解&#xff09; …

Compose - 基本使用

一、概念 1.1 Compose优势 由一个个可以组合的Composable函数拼成界面&#xff0c;方便维护和复用。布局模型不允许多次测量&#xff0c;提升了性能。Compose可以和View互操作&#xff08;相互包含对方&#xff09;。 1.2 声明式UI APP展示的数据绝大多数不是静态数据而是会…

An easy problem

一、题目 we define f(A) 1, f(a) -1, f(B) 2, f(b) -2, … f(Z) 26, f(z) -26; Give you a letter x and a number y , you should output the result of yf(x). Input On the first line, contains a number T.then T lines follow, each line is a case.each case …

多线程基础篇(包教包会)

文章目录 一、第一个多线程程序1.Jconsole观察线程2.线程休眠-sleep 二、创建线程三、Thread类及常见方法1. Thread 的常见构造方法2. Thread 的几个常见属性3. 启动线程 - start4. 中断线程5. 等待一个线程 四、线程状态五、线程安全问题(synchronized)&#xff08;重点&#…

基于React实现日历组件详细教程

前言 日历组件是常见的日期时间相关的组件&#xff0c;围绕日历组件设计师做出过各种尝试&#xff0c;展示的形式也是五花八门。但是对于前端开发者来讲&#xff0c;主要我们能够掌握核心思路&#xff0c;不管多么奇葩的设计我们都能够把它做出来。 本文将详细分析如何渲染一…

windows系统activemq一键安装启动

前言 官网下载的mq提供了启动和卸载服务器的脚本&#xff0c;但是安装的时候不会自动启动服务&#xff0c;需要去手动比较麻烦&#xff0c;执行脚本的时候也需要去右键选择管理员执行做起来比较啰嗦。 优化方案 修改脚本权限为自动判断并获取 在脚本开头加入下面的代码 …

店铺收款系统开源_商城收款分账系统_OctShop

近来&#xff0c;很多客户对OctShop店铺收款分账系统有很大的需求&#xff0c;下面详细介绍一下&#xff0c;门店收款分账系统是什么&#xff0c;以及其作用与意义是什么&#xff1f; 店铺收款分账系统实质上是一个解决门店各种收款场景&#xff0c;如&#xff1a;扫码付款&…

零基础学习,初学者也能轻松制作高质量母婴行业小程序

现如今&#xff0c;随着移动互联网的发展&#xff0c;小程序成为了各行各业的新宠。对于母婴行业来说&#xff0c;拥有一个功能完善、用户友好的小程序&#xff0c;无疑是提升企业形象和服务质量的重要一环。然而&#xff0c;对于初学者来说&#xff0c;如何轻松掌握母婴行业小…

微服务中间件--http客户端Feign

http客户端Feign http客户端Feigna.Feign替代RestTemplateb.自定义Feign的配置c.Feign的性能优化d.Feign的最佳实践分析e.Feign实现最佳实践(方式二) http客户端Feign a.Feign替代RestTemplate 以前利用RestTemplate发起远程调用的代码&#xff1a; String url "http:…

【面试题】你理解中JS难理解的基本概念是什么?

前端面试题库 &#xff08;面试必备&#xff09; 推荐&#xff1a;★★★★★ 地址&#xff1a;前端面试题库 作用域与闭包 作用域 作用域是当前的执行上下文&#xff0c;值和表达式在其中“可见”或可被访问。如果一个变量或表达式不在当前的作用域中&#xff0…