当前位置: 首页 > news >正文

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

企业微信官方文档

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: '', // 必填,企业微信的corpIDtimestamp: , // 必填,生成签名的时间戳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.企业微信接口错误码大全

相关文章:

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

企业微信官方文档 1.登录企业微信后台,管理员可操作,打开应用配置应用可信域名(必须配置,否则无法调用jsapi,可信域名必须有ICP备案且在管理端验证域名归属) 配置部署后的前台域名地址 配置可信域名,部署后的服务器域名(需备案认证) 当域名权限不够时需下载文件效验,将文件放…...

Excel如何把表格变成图表

Excel如何把表格变成图表 ‌将Excel表格转换为图表‌的过程相对简单且直观&#xff0c;主要步骤包括准备数据、插入图表、设置图表格式等。 以下是详细的步骤说明&#xff1a; ‌准备数据‌&#xff1a;首先&#xff0c;在Excel表格中输入或准备好要创建图表的数据。这些数据可…...

HTTP 三、http在springboot中得应用

一、springboot处理http请求的过程 1、客户端发起HTTP请求&#xff0c;经过网络传输到服务器 HTTP请求通常由浏览器、Postman、curl或其他HTTP客户端发起&#xff0c;客户端的HTTP请求通过网络&#xff08;通常是TCP/IP协议&#xff09;传输到服务器&#xff0c;这个请求首先会…...

Java秋招面经(网搜版)

1.redis的数据结构 Redis 提供了多种高效的数据结构来满足不同的应用需求。主要包括字符串&#xff08;String&#xff09;&#xff0c;这是最基础的数据类型&#xff0c;支持存储和操作各种数据&#xff1b;哈希&#xff08;Hash&#xff09;&#xff0c;类似于键值对的集合&…...

【Android】Material Design编写更好的UI

Toolbar 对于控件ActionBar我们非常熟悉&#xff0c;就是我们常见的标题栏&#xff0c;但ActionBar只能位于活动的顶部&#xff0c;因此我们更建议使用Toolbar。在新建一个项目的时候都是默认显示ActionBar&#xff0c;我们要使用Toolbar就需要先将标题栏改为不显示 先来看看…...

剪辑视频,这四大工具助你一臂之力!

在这个数字化的时代&#xff0c;视频已成为一种重要的表达手段。无论您是专业视频制作者还是只是偶尔想要编辑一些个人视频&#xff0c;一款优秀的视频剪辑软件都将是您不可或缺的好帮手。以下是几款值得推荐的视频剪辑软件。 福昕视频剪辑 直达链接&#xff1a;www.pdf365.c…...

基于单片机的热成像测温显示系统设计

本设计基于单片机的热成像测温显示系统&#xff0c;本系统包括STM32F103C6T6微控制器、MLX90640红外温度传感器、TFT-LCD显示屏、AT24C02存储模块、报警模块、按键模块和MP3语音播报模块。其可以通过热成像传感器对被检测物体的温度进行非接触式测量&#xff0c;并能够将被测信…...

CSS系列之Float浮动(二)

一、传统网页布局 网页布局的本质&#xff1a;用 CSS 来摆放盒子&#xff0c;把盒子摆放到相应位置。CSS 提供了三种传统布局方式&#xff08;这里指的只是传统布局&#xff0c;其实还有一些特殊高级的布局方式&#xff09;&#xff1a; 标准流浮动定位 1、所谓的标准流&#…...

macos下的 sed命令安装与使用 gnu-sed

sed命令是我们在linu类系统中非常重要的一个命令, 但是在macos下面默认是没有sed命令的, 不过我们可以通过brew install gnu-sed ( 或者通过 sudo port install gsed )这个软件包来获得这个命令 GNU sed 命令安装 下面2种方式,选择一种安装即可 # brew安装 brew install gn…...

RLC(电阻、电感、电容)

RLC&#xff08;电阻、电感、电容&#xff09; 目录一、两个电阻&#xff08;R1&#xff0c;R2&#xff09;&#xff0c;电容&#xff08;C1&#xff0c;C2&#xff09;的串联/并联公式&#xff1f;二、请画出这个1ms&#xff0c; 1V的Vin脉冲信号在Vout端的大致图像1.电路图2.…...

语音测试(一)ffmpeg视频转音频

视频转音频 下载ffmpeg工具进入bin目录cmd进入控制台输入命令 ffmpeg.exe -i ./视频.mp4 ./音频.wav命令说明 ffmpeg -i input.mp4 output.mkv FFmpeg 可能会尝试自动选择合适的编码器对视频和音频进行重新编码&#xff0c;以便适应 MKV 格式的要求ffmpeg -i input.mp4 -c c…...

计算机网络八股文之TCP协议

TCP/IP模型 链路层 物理层&#xff1a;主要定义物理设备标准&#xff0c;如网线的接口类型、光纤的接口类型、各种传输介质的传输速率等。它的主要作用是传输比特流&#xff08;就是由1、0转化为电流强弱来进行传输&#xff0c;到达目的地后再转化为1、0&#xff0c;也就是我们…...

【linux】linux中如何通过stress进行压力测试,原理解析与应用实战

✨✨ 欢迎大家来到景天科技苑✨✨ 🎈🎈 养成好习惯,先赞后看哦~🎈🎈 🏆 作者简介:景天科技苑 🏆《头衔》:大厂架构师,华为云开发者社区专家博主,阿里云开发者社区专家博主,CSDN全栈领域优质创作者,掘金优秀博主,51CTO博客专家等。 🏆《博客》:Python全…...

python用波形显示udp数据实现一个模拟示波器

显示端代码: import socket import matplotlib.pyplot as plt import matplotlib.animation as animation import numpy as np# UDP setup udp_ip = 0.0.0.0 # Listen on all network interfaces udp_port = 12345 sock = socket.socket(socket.AF_INET, socket.SOCK_DGRAM)…...

开源通用验证码识别OCR —— DdddOcr 源码赏析(二)

文章目录 前言DdddOcr分类识别调用识别功能classification 函数源码classification 函数源码解读1. 分类功能不支持目标检测2. 转换为Image对象3. 根据模型配置调整图片尺寸和色彩模式4. 图像数据转换为浮点数据并归一化5. 图像数据预处理6. 运行模型&#xff0c;返回预测结果 …...

【个人笔记】VCS工具与命令

Title&#xff1a;VCS工具学习 一 介绍 是什么&#xff1f; VCS (Verilog Compiler Simulator) 是synopsys的verilog 仿真软件&#xff0c;竞品有Mentor公司的Modelsim、Cadence公司的NC-Verilog、Verilog—XL. VCS能够 分析、编译 HDL的design code&#xff0c;同时内置了 仿…...

面试进去8分钟就出来了,问的问题有点变态。。。

从小厂出来&#xff0c;没想到在另一家公司又寄了。 到这家公司开始上班&#xff0c;加班是每天必不可少的&#xff0c;看在钱给的比较多的份上&#xff0c;就不太计较了。没想到一纸通知&#xff0c;所有人不准加班&#xff0c;加班费不仅没有了&#xff0c;薪资还要降40%,这…...

探索MongoDB的Python之钥:pymongo的魔力

文章目录 探索MongoDB的Python之钥&#xff1a;pymongo的魔力背景&#xff1a;为什么选择pymongo&#xff1f;简介&#xff1a;pymongo是什么&#xff1f;安装&#xff1a;如何将pymongo纳入你的项目&#xff1f;基础用法&#xff1a;五个核心函数介绍1. 连接到MongoDB2. 选择数…...

【数据结构】顺序表和链表——顺序表(包含丰富算法题)

文章目录 1. 线性表2. 顺序表2.1 概念与结构2.2 分类2.2.1 静态顺序表2.2.2 动态顺序表 2.3 动态顺序表的实现2.4 顺序表算法题2.4.1 移除元素2.4.2 删除有序数组中的重复项2.4.3 合并两个有序数组 2.5 顺序表问题与思考 1. 线性表 线性表&#xff08;linear list&#xff09;…...

pod基础和镜像拉取策略

目录 pod概念 pod的分类 1.基础容器 pause 2.初始化容器 init 实验&#xff1a;定义初始化容器 init容器的作用 实验&#xff1a;如何在容器内部进行挂载 镜像拉取策略 pod概念 pod是k8s里面的最小单位&#xff0c;pod也是最小化运行容器的资源对象。容器是基于pod在k…...

【Java学习笔记】Arrays类

Arrays 类 1. 导入包&#xff1a;import java.util.Arrays 2. 常用方法一览表 方法描述Arrays.toString()返回数组的字符串形式Arrays.sort()排序&#xff08;自然排序和定制排序&#xff09;Arrays.binarySearch()通过二分搜索法进行查找&#xff08;前提&#xff1a;数组是…...

深入浅出:JavaScript 中的 `window.crypto.getRandomValues()` 方法

深入浅出&#xff1a;JavaScript 中的 window.crypto.getRandomValues() 方法 在现代 Web 开发中&#xff0c;随机数的生成看似简单&#xff0c;却隐藏着许多玄机。无论是生成密码、加密密钥&#xff0c;还是创建安全令牌&#xff0c;随机数的质量直接关系到系统的安全性。Jav…...

Leetcode 3577. Count the Number of Computer Unlocking Permutations

Leetcode 3577. Count the Number of Computer Unlocking Permutations 1. 解题思路2. 代码实现 题目链接&#xff1a;3577. Count the Number of Computer Unlocking Permutations 1. 解题思路 这一题其实就是一个脑筋急转弯&#xff0c;要想要能够将所有的电脑解锁&#x…...

全球首个30米分辨率湿地数据集(2000—2022)

数据简介 今天我们分享的数据是全球30米分辨率湿地数据集&#xff0c;包含8种湿地亚类&#xff0c;该数据以0.5X0.5的瓦片存储&#xff0c;我们整理了所有属于中国的瓦片名称与其对应省份&#xff0c;方便大家研究使用。 该数据集作为全球首个30米分辨率、覆盖2000–2022年时间…...

定时器任务——若依源码分析

分析util包下面的工具类schedule utils&#xff1a; ScheduleUtils 是若依中用于与 Quartz 框架交互的工具类&#xff0c;封装了定时任务的 创建、更新、暂停、删除等核心逻辑。 createScheduleJob createScheduleJob 用于将任务注册到 Quartz&#xff0c;先构建任务的 JobD…...

Python爬虫(二):爬虫完整流程

爬虫完整流程详解&#xff08;7大核心步骤实战技巧&#xff09; 一、爬虫完整工作流程 以下是爬虫开发的完整流程&#xff0c;我将结合具体技术点和实战经验展开说明&#xff1a; 1. 目标分析与前期准备 网站技术分析&#xff1a; 使用浏览器开发者工具&#xff08;F12&…...

【Java_EE】Spring MVC

目录 Spring Web MVC ​编辑注解 RestController RequestMapping RequestParam RequestParam RequestBody PathVariable RequestPart 参数传递 注意事项 ​编辑参数重命名 RequestParam ​编辑​编辑传递集合 RequestParam 传递JSON数据 ​编辑RequestBody ​…...

JVM暂停(Stop-The-World,STW)的原因分类及对应排查方案

JVM暂停(Stop-The-World,STW)的完整原因分类及对应排查方案,结合JVM运行机制和常见故障场景整理而成: 一、GC相关暂停​​ 1. ​​安全点(Safepoint)阻塞​​ ​​现象​​:JVM暂停但无GC日志,日志显示No GCs detected。​​原因​​:JVM等待所有线程进入安全点(如…...

Redis数据倾斜问题解决

Redis 数据倾斜问题解析与解决方案 什么是 Redis 数据倾斜 Redis 数据倾斜指的是在 Redis 集群中&#xff0c;部分节点存储的数据量或访问量远高于其他节点&#xff0c;导致这些节点负载过高&#xff0c;影响整体性能。 数据倾斜的主要表现 部分节点内存使用率远高于其他节…...

代理篇12|深入理解 Vite中的Proxy接口代理配置

在前端开发中,常常会遇到 跨域请求接口 的情况。为了解决这个问题,Vite 和 Webpack 都提供了 proxy 代理功能,用于将本地开发请求转发到后端服务器。 什么是代理(proxy)? 代理是在开发过程中,前端项目通过开发服务器,将指定的请求“转发”到真实的后端服务器,从而绕…...