企业微信H5授权登录

在企业中如果需要在打开的网页里面携带用户的身份信息,第一步需要获取code参数

如何实现企业微信H5获取当前用户信息即accessToken?

1.在应用管理--》创建应用

2.创建好应用,点击应用主页-》设置-》网页-》将授权链接填上去

官方文档可以看这---->构造网页授权链接 - 接口文档 - 企业微信开发者中心

https://open.weixin.qq.com/connect/oauth2/authorize?appid=ww72c853a9xxxx54&redirect_uri=http%3A%2F%2F47.xxx.179.198%3A6379%2F%23%2F&response_type=code&scope=snsapi_base&state=STATE&agentid=AGENTID#wechat_redirect

ww72c853a9xxxx54  是你企业的APPID  
http%3A%2F%2F47.xxx.179.198%3A6379%2F%23%2F  是你经过UrlEncode的网站,要跳转的地址
 

以上的案例只需要改动 appid和redirect_uri的值

APPID可以去我的企业,底部的企业ID去获取

redirect_uri 就是我们开发的网站 然后记住 请使用urlencode对链接进行处理

3.记得加在开发者接口-》网页授权-》设置可信任域名 上白名单 要不然会以下报错

企业微信报错 redirect_uri需使用应用可信域名

1.必须是域名 不支持ip

2.不用加http 协议头

PS:前面设置错了,后来专门配置了个域名(www.xxxx.com.cn)

4.在我的应用点击打开,如果跳转到redirect_uri 就说明配置成功了

以下就是重定向的地址,多了2个参数我们要拿到code值去传给后端进行登录

https://www.xxxx.com.cn/html?code=J2jO8plZ_LNeoZjW_Z21rDlHJTYylOHqcvoo0JqLoGc&state=STATE#/

获取重定向code,得到accessToken

<template><view class=" "><view class=" "><p>url:<input type="text" v-model="title"/></p><p>code:<input type="text" v-model="code"/></p><p>accessToken:<input type="text" v-model="accessToken"/></p></view></view>
</template><script>export default {data() {return {title: '',accessToken:"",code:"",baseUrl:'https://www.xxxxx.com.cn/shebao', }},onLoad() {this.code=this.getUrlParams('code')this.getAccessToken()},mounted() {var currentUrl = window.location.href;this.title=currentUrl			},methods: {		// 获取tokengetAccessToken(){let _this=thisuni.request({url:this.baseUrl+'/qw/callback',data: {code:this.code},success(res){console.log(res.data);let result=res.dataif(result.code==200){_this.accessToken=result.result	}}})},//获取url的codegetUrlParams(name){try{// 获取当前页面的URLvar url = window.location.href.split('?')[1];console.log(url)let query= url.split('&')console.log(query)let code=''for (var i = 0; i < query.length; i++) {if(query[i].split('=')[0]==name){code=query[i].split('=')[1]break} }return code}catch(e){return ''}},}}
</script><style lang="scss">input{background-color: antiquewhite;}
</style>

这样在页面展示一下当前url,并获取到了code,再调用后端接口获取token。

至此完成了我们的授权登录

企业微信H5授权登录获取accessToken

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

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

相关文章

wampserver的使用

wampserver的使用 文章目录 wampserver的使用1.启动2.目录3.基本操作 1.启动 WampServler有三种状态 服务器关闭状态&#xff0c;颜色为红色服务器开启&#xff0c;但是为离线状态&#xff0c;颜色为橙色&#xff0c;只有本机可以访问服务器开启&#xff0c;在线状态&#xf…

通过Bash脚本执行EXPDP实现本地和异地备份

在 Oracle 数据库管理中,定时执行备份是一个重要的任务,可以保证数据的安全性和可恢复性。本文将介绍如何使用 expdp 工具进行 Oracle 数据库备份,并使用 bash 脚本定时执行备份任务,并对备份文件进行压缩,传输。 准备工作 在执行备份任务之前,需要确保以下几点: 数据…

JAVA:JDK9到21,新特性了解

一、前言 随着Java技术的不断发展和进步&#xff0c;Java开发人员对于新特性的需求也越来越高。从JDK 9到JDK 21&#xff0c;Java发布了一系列重要的更新和改进&#xff0c;以满足开发人员的需求并提高应用程序的性能和安全性。本文将介绍JDK9到JDK 921的核心新特性&#xff0c…

Educational Codeforces Round 166 (Rated for Div. 2)题解(A,B,D)

今天真的巨抽象&#xff0c;第三题没做出来&#xff0c;但是第四题过了&#xff0c;也是准备上小分了&#xff0c;因为nnd不按那个分数&#xff0c;而是按照做题数&#xff0c;直接废了 A. Verify Password 题解&#xff1a;小丑水题一个人&#xff0c;按照ASCII码比较一遍直接…

SDK开发

为什么需要Starter&#xff1f; 理想情况:开发者只需关心调用哪些接口&#xff0c;传递哪些参数就跟调用自己写的代码一样简单。 开发starter的好处&#xff1a;开发者引入之后&#xff0c;可以直接在application.yml中写配置&#xff0c;自动创建客户端。 starter开发流程 …

STM32G030C8T6:EEPROM读写实验(I2C通信)--M24C64

本专栏记录STM32开发各个功能的详细过程&#xff0c;方便自己后续查看&#xff0c;当然也供正在入门STM32单片机的兄弟们参考&#xff1b; 本小节的目标是&#xff0c;系统主频64 MHZ,采用高速外部晶振&#xff0c;实现PB11,PB10 引脚模拟I2C 时序&#xff0c;对M24C08 的EEPRO…

javascript DOM 设置样式

No.内容链接1Openlayers 【入门教程】 - 【源代码示例300】 2Leaflet 【入门教程】 - 【源代码图文示例 150】 3Cesium 【入门教程】 - 【源代码图文示例200】 4MapboxGL【入门教程】 - 【源代码图文示例150】 5前端就业宝典 【面试题详细答案 1000】 文章目录 一、直接…

2965. 找出缺失和重复的数字

2965. 找出缺失和重复的数字 题目链接&#xff1a;2965. 找出缺失和重复的数字 代码如下&#xff1a; class Solution { public:vector<int> findMissingAndRepeatedValues(vector<vector<int>>& grid) {vector<int> nums(grid.size()*grid.siz…

C语言| 求1到100之间奇数的平均值.

【分析思路】 第一种方法 直接遍历100个数字&#xff0c;用 i% 1来判断是不是奇数。 i 是奇数&#xff0c;每次相加&#xff0c;并计算个数。 最后直接求平均数average 1.0*sum / count; 第二种方法 设置变量i 1&#xff0c;每次加2&#xff0c;求奇数&#xff0c;并相加…

【易错题】数据统计补充习题(选择题 )#CDA Level 1

本文整理了数据统计相关的易错题&#xff0c;部分可作为备考CDA Level 1统计学部分的补充习题。来源&#xff1a;如荷学题库&#xff08;CFDP第三部分&#xff09; 1&#xff09; 2&#xff09; 3&#xff09; 4&#xff09; 5&#xff09; 6&#xff09; 7&#xff09; 8&…

shopee签名x-sap-ri、x-sap-sec算法还原

最新版签名&#xff0c;免账号登录成功率百分百&#xff0c;需要可d 两种方式base64 MTQzMDY0OTc3OA QXVndXN0MjItZnF4

【项目经理】什么是领导

引言&#xff1a;        项目管理是一个不断发展的领域&#xff0c;它要求项目经理不断学习、适应和创新。通过本系列文章&#xff0c;我们希望能够帮助每一位项目经理提升自己的专业能力&#xff0c;成为引领项目成功的舵手。 持续更新。。。。。。。。。。。。。。。…

第十三章 创建Web客户端 - 用于控制类生成和编译的 SOAP 向导选项

文章目录 第十三章 创建Web客户端 - 用于控制类生成和编译的 SOAP 向导选项用于控制类生成和编译的 SOAP 向导选项为 Web 服务创建客户端创建网络服务编译生成的类Class Type将 %OnDelete 方法添加到类中以便级联删除Proxy Class PackageCreate Business Operation 第十三章 创…

Blueprints - Collision Presets相关

一些以前的学习笔记归档&#xff1b; 在Static Mesh或SkeletalMesh等的属性中&#xff0c;都有Collision Presets&#xff1a; 其中Oject Type只是一个枚举参数&#xff0c;代表设置该Actor为什么类型&#xff0c;Collision Responses代表该Actor对各种类型的Actor有什么反应&a…

DataGrip 数据库连接客户端

I DataGrip 安装 1.1安装 打开dmg镜像&#xff0c;将“DataGrip.app”拖入应用程序中&#xff1b; 1.2 Act 打开应用程序,点击试用模式启动软件&#xff0c;然后将“jetbrains-agent-latest”拖到任意位置&#xff0c;然后拖入&#xff0c;弹出对话框&#xff0c;点击“Rest…

Java web应用性能分析之【压测工具ab】

常用的性能测试工具有&#xff1a;JMeter、loadRunner、ab&#xff1b;对于开发人员来说用的多的是免费的Jmeter和ab&#xff0c;对于测试来说可能用收费的商业软件loadRunner多。在这里我们就说说ab压测工具&#xff0c;因为ab基本满足web接口测试要求&#xff0c;jmeter后面再…

LabVIEW车体静强度试验台测控系统

LabVIEW车体静强度试验台测控系统 开发了一种基于LabVIEW的车体静强度试验台测控系统&#xff0c;通过自动化技术提高试验的精度和效率。系统采用LabVIEW软件与S7-200 SMART PLC硬件平台相结合&#xff0c;实现了对液压缸作用力的精确控制和试验数据的实时采集及管理。 传统的…

PyTorch 的 torch.nn 模块学习

torch.nn 是 PyTorch 中专门用于构建和训练神经网络的模块。它的整体架构分为几个主要部分&#xff0c;每部分的原理、要点和使用场景如下&#xff1a; 1. nn.Module 原理和要点&#xff1a;nn.Module 是所有神经网络组件的基类。任何神经网络模型都应该继承 nn.Module&#…

compare_exchange 基本使用

参考博客&#xff1a;C内存模型 compare_exchange_weak基本使用 bool compare_exchange_weak( T& expected, T desired,std::memory_order success,std::memory_order failure );expected:期望的值desired 想要写入的值 如果obj和期望的值相同&#xff0c;则写入desired并…

如何培养技术人员的管理能力?

随着企业发展的需求不断增长&#xff0c;对于一专多能的复合型人才的需求也日益增加。这种人才既拥有技术实力&#xff0c;又具备出色的管理能力。尤其对于高新技术企业而言&#xff0c;技术骨干往往更有机会成为管理人员。一方面是因为技术骨干在自己的岗位上展现出了核心技术…