在企业微信里面添加h5页面 进行登录授权

1.需求:在企业微信里面添加h5页面 进行登录授权,获取到用户的code,进行登入id的验证

2.步骤:

  • 在企业微信内部进行配置,拿到appid,redirect_uri,agentid参数步骤参考这篇文章

  • 由于企业微信进入页面之前会进行授权,然后再进行跳转咱们系统的首页(也是就redirect_uri中的地址),那么就会有两种解决方案:

    ① 有一个页面用于授权,然后在跳转首页

    ② 直接将授权的操作写在首页中,在首页进行授权,然后再跳转首页(我用的是这种方式)

    首页进行授权的代码如下:

    复制代码
     //判断是否授权
    const CORPID = '    '; //appid参数
    const REDIRECT_URI = encodeURI(' ');  //redirect_uri参数
    const AGENTID =  '  '; //agentid 参数
    const searchParams = new URLSearchParams(window.location.search);
    
    const code = (route.query.code as string) || (searchParams.get('code') as string);
    const state = (route.query.state as string) || (searchParams.get('state') as string);
    const token = computed(() => userStore.getToken);
    
    //路由上没有code的情况下,进行企业微信授权
    if (!code) {
      const authUrl = `https://open.weixin.qq.com/connect/oauth2/authorize?appid=${CORPID}&redirect_uri=${REDIRECT_URI}/index.html&response_type=code&scope=snsapi_base&state=1&agentid=${AGENTID}#wechat_redirect`;
      window.location.href = authUrl;
    }

    //存在code且不存在token的情况下走登录的接口
    if (code && (token.value == null || token.value == 'null')) {
    userStore.resetUserStore();
    login({
    code: code,
    state: state,
    }).then((res) => {
    userStore.setToken(res.token);
    });
    }

相关推荐
泡泡鱼(敲代码中)2 小时前
Python语法技术学习笔记
开发语言·笔记·python·学习·pycharm
hqyjzsb3 小时前
Python 技术人转型 AI:CAIE Level I、Level II 对比怎么选
开发语言·人工智能·python·金融·数据挖掘·数据分析·aigc
用户302822530683 小时前
别让 Agent 被 Webhook 叫醒就开工:实现一个幂等启动层
javascript
承渊政道3 小时前
【Python编程—从入门到实践】(Python字典:从基础语义到现代工程实践)
开发语言·python·pycharm·字典·嵌套
wechatbot8883 小时前
SpringBoot Vue 企业微信多账号托管|扫码登录 代理 IP 消息回调
大数据·后端·微信·企业微信·ai编程
天空属于哈夫克33 小时前
企业微信接口对接教程:请求、回执与幂等
企业微信
luj_17684 小时前
一线一区一变破解人盯人防守密码
开发语言·网络·c++·经验分享·算法
天空属于哈夫克34 小时前
企业微信开发怎么做:架构、队列与上线清单
架构·企业微信
名字还没想好☜4 小时前
Python 字符编码实战:encode/decode、UnicodeDecodeError 与 open 的 encoding 坑
开发语言·后端·python·编程语言
萧瑟余晖4 小时前
持久层选型与框架对比详解
开发语言·架构