企业微信中嵌套的h5应用调用微信扫码功能

news2024/9/27 12:26:55

企业微信官方文档

1.登录企业微信后台,管理员可操作,打开应用配置应用可信域名(必须配置,否则无法调用jsapi,可信域名必须有ICP备案且在管理端验证域名归属)

配置部署后的前台域名地址

配置可信域名,部署后的服务器域名(需备案认证)

当域名权限不够时需下载文件效验,将文件放在public文件夹下即可

2.引入js文件(支持https)

<script src="http://res.wx.qq.com/open/js/jweixin-1.6.0.js"></script>

3.通过config接口注入权限验证配置,所有需要使用JS-SDK的页面必须先注入配置信息

wx.config({
    beta: true,// 必须这么写,否则wx.invoke调用形式的jsapi会有问题
    debug: true, // 开启调试模式,调用的所有api的返回值会在客户端alert出来,若要查看传入的参数,可以在pc端打开,参数信息会通过log打出,仅在pc端时才会打印。
    appId: '', // 必填,企业微信的corpID
    timestamp: , // 必填,生成签名的时间戳
    nonceStr: '', // 必填,生成签名的随机串
    signature: '',// 必填,签名,见 附录-JS-SDK使用权限签名算法
    jsApiList: [] // 必填,需要使用的JS接口列表,凡是要调用的接口都需要传进来
});
成功回调
wx.ready(function(){
    // config信息验证后会执行ready方法,所有接口调用都必须在config接口获得结果之后,config是一个客户端的异步操作,所以如果需要在页面加载时就调用相关接口,则须把相关接口放在ready函数中调用来确保正确执行。对于用户触发时才调用的接口,则可以直接调用,不需要放在ready函数中。
});
失败回调
wx.error(function(res){
    // config信息验证失败会执行error函数,如签名过期导致验证失败,具体错误信息可以打开config的debug模式查看,也可以在返回的res参数中查看,对于SPA可以在这里更新签名。
});

4.调用扫码功能

wx.scanQRCode({
    desc: 'scanQRCode desc',
    needResult: 0, // 默认为0,扫描结果由企业微信处理,1则直接返回扫描结果,
    scanType: ["qrCode", "barCode"], // 可以指定扫二维码还是条形码(一维码),默认二者都有
    success: function(res) {
        // 回调
		var result = res.resultStr;//当needResult为1时返回处理结果
    },
    error: function(res) {
        if (res.errMsg.indexOf('function_not_exist') > 0) {
            alert('版本过低请升级')
        }
    }
});

5.wx.config参数说明

1.debug

调试时使用,上线后关闭,会将错误信息弹出

2.appId

企业id,如下图

3.timestamp

当前时间戳,10位

4.nonceStr

随机字符串

5.signature

签名效验工具地址

签名,生成规则如下图

6.signature签名获取方式及参数说明

1.获取jsapi_ticket(企业)

获取jsapi_ticket官方文档

2.获取access_token

获取access_token官方文档

corpid企业id获取上面有

corpsecret应用秘钥获取如下图

3.url

当前网页的URL,不包含#及其后面部分。注意:对于没有只有域名没有 path 的 URL ,浏览器会自动加上 / 作为 path,如打开 http://qq.com 则获取到的 URL 为 http://qq.com/(如果前端路由中不包含#需全部传入)

//hash 带#
let url = window.location.href.split('#')[0]

//history 不带#
let url = window.location.href

7.完整逻辑代码

let getwwConfig = async () => {
        setLoading(true)
        let url = window.location.href.split('#')[0]
        let res = await api.getAxiosData('后台地址', { url })
        if (res) {
            window.ww.config({
                beta: true,// 必须这么写,否则ww.invoke调用形式的jsapi会有问题
                debug: true, // 开启调试模式,调用的所有api的返回值会在客户端alert出来,若要查看传入的参数,可以在pc端打开,参数信息会通过log打出,仅在pc端时才会打印。
                appId: res.appId, // 必填,企业微信的corpID,必须是本企业的corpID,不允许跨企业使用
                timestamp: res.timestamp, // 必填,生成签名的时间戳
                nonceStr: res.noncestr, // 必填,生成签名的随机串
                signature: res.signature,// 必填,签名,见 附录-JS-SDK使用权限签名算法
                jsApiList: ['scanQRCode', 'checkJsApi'] // 必填,需要使用的JS接口列表,凡是要调用的接口都需要传进来
            })

            window.ww.error(function (res) {
                // config信息验证失败会执行error函数,如签名过期导致验证失败,具体错误信息可以打开config的debug模式查看,也可以在返回的res参数中查看,对于SPA可以在这里更新签名。
            })

            window.ww.ready(() => {
                window.ww.scanQRCode({
                    needResult: 1,
                    scanType: ["qrCode", "barCode"],
                    success: res => {
                        console.log(res.resultStr, '---') // 打印扫码结果
                    },
                    error: err => {
                        console.log(err.errMsg, '===')
                    }
                })
            })
        }
        setLoading(false)
    }

8.企业微信接口错误码大全

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

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

相关文章

网站开发:HTML + CSS - CSS选择器

1. 前言 CSS&#xff08;Cascading Style Sheets&#xff0c;层叠样式表&#xff09;是一种用于控制 HTML 文档样式和布局的语言。它为 Web 页面提供了许多功能&#xff0c;使开发者能够创建美观且功能丰富的用户界面。 提供了丰富的功能来控制网页的外观和布局&#xff0c;增…

掌握SQLAlchemy:Python数据库的魔法师

文章目录 掌握SQLAlchemy&#xff1a;Python数据库的魔法师背景&#xff1a;为什么选择SQLAlchemy&#xff1f;SQLAlchemy是什么&#xff1f;如何安装SQLAlchemy&#xff1f;五个简单的库函数使用方法1. 创建引擎2. 定义模型3. 创建会话4. 添加数据5. 查询数据 场景应用1. 多表…

大模型构建合作性的Agent,多代理框架MetaGpt

大模型构建合作性的Agent,多代理框架MetaGpt 前言 MetaGPT 框架将标准的操作程序(SOP)与基于大模型的多智能体相结合,使用标准操作程序来编码提示,确保协调结构化和模块化输出。 MetaGPT 允许 Agent 在类似流水线的范式中扮演多中角色,通过结构化的 Agent 协作和强化领…

Android Studio 加载多个FLutter项目

按顺序操作即可 选择工程 选择Modules, 导入 module 选中创建module 选择要导入的目录&#xff0c;只选择主目录&#xff0c;下面的文件不要选 添加完成&#xff0c;点击ok后&#xff0c;会进行导入 最终导入成功

三星称霸全球市场,但它在中国市场再受打击,将进一步收缩业务

韩国媒体报道指三星已计划进一步收缩中国业务&#xff0c;将中国的销售和生产部门人员减少一部分&#xff0c;其中销售人员计划减少8%左右&#xff0c;显示出它在中国市场继续面临打击&#xff0c;对于这家在全球市场领先地位仍然稳固的企业来说&#xff0c;它在中国市场无疑又…

OpenCV结构分析与形状描述符(8)点集凸包计算函数convexHull()的使用

操作系统&#xff1a;ubuntu22.04 OpenCV版本&#xff1a;OpenCV4.9 IDE:Visual Studio Code 编程语言&#xff1a;C11 算法描述 查找一个点集的凸包。 函数 cv::convexHull 使用斯克拉斯基算法&#xff08;Sklansky’s algorithm&#xff09;来查找一个二维点集的凸包&#…

Wyn 商业智能V8.0 新版本来袭,解锁“智造”的无限可能

Wyn商业智能V8.0 版本全新发布&#xff0c;聚焦制造业数字化升级痛点&#xff0c;深度赋能制造业数字化转型升级之路&#xff0c;从无缝集成物联网海量数据&#xff0c;到构建可视化实时分析、监控与预警大屏&#xff0c;全面打通生产制造全生命周期的数据脉络&#xff0c;为您…

免费OCR 文字识别工具

免费&#xff1a;本项目所有代码开源&#xff0c;完全免费。 方便&#xff1a;解压即用&#xff0c;离线运行&#xff0c;无需网络。 高效&#xff1a;自带高效率的离线OCR引擎&#xff0c;内置多种语言识别库。 灵活&#xff1a;支持命令行、HTTP接口等外部调用方式。 功能…

hiprint打印/jsPDF使用/html2canvas

最初我知道hiprint.print是可以打印双模板的&#xff0c;于是查看hiprint.print的源码发现底层实现是this.getHtml(t).hiwprint,于是断点查看getHtm的实现&#xff0c;得知它是遍历我们对print传参的list&#xff0c;利用list中模板对象的getHtml()方法得到模板的dom对象&#…

论文120:Giga-SSL: Self-supervised learning for gigapixel images (2023, CVPR, 开源)

文章目录 1 要点2 方法2.1 算法设计2.2 设计选择 1 要点 题目&#xff1a;用于千兆像素图像的自监督学习 (Giga-SSL: Self-Supervised Learning for Gigapixel Images) 代码&#xff1a;https://github.com/trislaz/gigassl 研究目的&#xff1a; 现有的WSI分类方法依赖于有…

告别格式不兼容烦恼!ape转换mp3,分享3个简单方法

各位读者们&#xff0c;你们是否有过这种体验&#xff1a;满怀期待地在网上下载一首好听的歌曲&#xff0c;结果怎么点击手机都播放不了&#xff0c;定睛一看&#xff0c;弹窗显示“无法播放该音频文件”。这是为什么呢&#xff1f;原来那首歌的音频格式是ape&#xff0c;不被手…

2024年全国大学生数学建模C题解题思路

C 题 农作物的种植策略 gzh 大学竞赛君 根据乡村的实际情况&#xff0c;充分利用有限的耕地资源&#xff0c; 因地制宜&#xff0c;发展有机种 植产业&#xff0c;对乡村经济 的可持续发展具有重要的现实意义 。选择适宜的农作物&#xff0c; 优化种植策略&#xff0c;有利于方…

认识正则表达式

为什么要学习正则表达式 因为爬虫需要&#xff01;&#xff01;&#xff01; 一般来说爬虫需要四个主要步骤&#xff1a; 明确目标 (要知道你准备在哪个范围或者网站去搜索)爬 (将所有的网站的内容全部爬下来)取 (去掉对我们没用处的数据)处理数据&#xff08;按照我们想要的方…

Codeforces Round 967 (Div. 2)(A,B,C,D)

A Make All Equal 题意 给定一个序列,每次如果a[i]<a[i1]则可以删除这两个的任意一个,问找出使a中所有元素相等所需的最小删除次数 思路 最小的删除次数就是保留相同数字最多的那个数的删除次数,无论如何都可以保留这个数,因为假如是3334那么可以根据3和4把4删了,假如是3…

学习记录:js算法(二十六):回文链表

文章目录 回文链表我的思路网上思路 总结 回文链表 给你一个单链表的头节点 head &#xff0c;请你判断该链表是否为回文链表。如果是&#xff0c;返回 true &#xff1b;否则&#xff0c;返回 false 。 图一 图二 示例 1&#xff1a;&#xff08;图一&#xff09; 输入&…

数仓工具—Hive语法之URL 函数

hive—语法—URL 函数 业务需求中,我们经常需要对用户的访问、用户的来源进行分析,用于支持运营和决策。例如我们经常对用户访问的页面进行统计分析,分析热门受访页面的Top10,观察大部分用户最喜欢的访问最多的页面等: 又或者我们需要分析不同搜索平台的用户来源分析,统…

SpringBoot开发——结合Thymeleaf模板整合HTML

文章目录 一、 Thymeleaf介绍二、Springboot整合thymeleaf模板1、实现步骤1)创建一个Springboot项目2) 创建application.yml文件3)创建HTML文件4)编写controller文件5)启动Spring Boot2、Thymeleaf常用语法赋值、拼接条件判断: if/unless循环URL三元运算switch基本对象内…

Java报错处理系列之:Unable to make protected void java.util.ResourceBundle.setParent

Java报错处理系列之&#xff1a;Internal error : Unable to make protected void java.util.ResourceBundle.setParent accessible: module java.base does not "opens java.util" to unnamed module 7f1302d6 一、完整报错二、报错原因三、解决方法四、更多报错解决…

KMP 详解

KMP数组存的是什么 对于一个字符串 b,下标从1开始。 则kmp[i]表示 以i结尾的连续子串 s的前缀的最大值&#xff08;等价于前缀最大结尾处&#xff09; 如何求KMP 假设 i 以前的KMP都被求出来了。 j 表示上一个字符可以成功匹配的长度&#xff08;等价于下标&#xff09; …

TikTok Live与跨境电商的深度融合:直播带货引领品牌出海

在TikTok Live的应用中&#xff0c;品牌能够利用这一互动性极强的功能开辟新的销售渠道&#xff0c;推动全球业务的增长。本文Nox聚星将和大家探讨TikTok Live如何与跨境电商相结合&#xff0c;分析其应用场景。 一、TikTok Live与跨境电商的结合优势 庞大的用户基础&#xff…