前端企业微信开发内嵌H5记录 右边侧边栏开发

news2024/11/24 12:25:16

企业微信内嵌H5(侧边栏)开发流程

1、如果要想在企业微信和客户聊天的过程中出现右侧侧边栏,需要添加非本企业的人员微信,右边侧边栏就会自动出现(可折叠)。
示例:
在这里插入图片描述

2、创建一个自建应用
a.先登录到企业微信后台管理,需要管理员权限,然后到应用管理菜单下,一直下拉,找到自建应用,创建应用
在这里插入图片描述
在这里插入图片描述

b.上传logo,应用名称,介绍,选择可见范围(只有被选择的人员才能看到该应用)
在这里插入图片描述

c.创建成功后自建这里就会出现刚刚自建的应用,点击进入到该应用,查看AgentId和Secret
在这里插入图片描述
在这里插入图片描述

d.点击应用主页,设置h5主页链接,如果没有现成的,可以先创建一个demo页面放在服务器上
在这里插入图片描述
在这里插入图片描述

e.然后可以设置应用出现的位置和可信域名(这个接口就是你前端和后端请求的那个域名。不备案的话是不能请求的。),至此,应用就创建成功了
在这里插入图片描述
在这里插入图片描述

3、添加应用到侧边栏
a.点击右边侧边栏的自定义按钮
在这里插入图片描述

b.拉到最下面点击添加页面
在这里插入图片描述

c.选择刚才创建好的应用
在这里插入图片描述

d.点击应用后,就可以看到该页面的内容,此时点击【添加到工具栏】,并输入页面名称,点击【完成添加】
在这里插入图片描述

e.此时,右边的侧边栏就会出现添加的按钮,并且正常显示了页面内容
在这里插入图片描述

4、开启企业微信debug联调模式

去官网下载devtools_resources.pak,放在企业微信的安装目录下,然后按照官网教程即可开启。
链接:https://developer.work.weixin.qq.com/document/path/90315#%E5%AE%A2%E6%88%B7%E7%AB%AF%E8%B0%83%E8%AF%95

在这里插入图片描述

在这里插入图片描述

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

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

相关文章

VMware horizon 8 建立手动桌面池

准备一台win10的虚拟机,改静态IP,计算机名,加入域,把Agent软件上传到机器中。 2:右键管理员身份安装程序。 一般默认 根据自己实际情况选择 启用桌面远程功能 安装完成 安装完成以后创建一个快照,以后是好知道机…

申请美国J1签证所需材料清单

在申请前往美国进行交流学习、文化交流或实习等项目的J1签证时,申请人需要准备一系列必要的材料。这些材料将有助于确保申请的顺利进行,以下是J1签证材料清单的详细内容: 1. 签证申请表格: 首先,申请人需要填写并签署D…

多网点多品牌精密空调集中监控方案

精密机房空调主要应用于通信数据机房、交换机 房、IDC机房、精密医疗设备室、外科手术室、实验室、精密电子仪器仪表生产车间等环境,这样的环境对空气的温度、湿度、洁净度、气流分布等各项指标有很高的要求,必须由每年365天、每天24小时安全可靠运行的专用机房精密…

DoIP学习笔记系列:导航篇

文章目录 1. 前言2. 导航3. 参考资料 1. 前言 DoIP学习笔记系列是一整套基于网络的诊断协议学习笔记,非常适合对有UDS基础但对DoIP没有实战经验的小伙伴参考,通过源协议讲解,企标讲解,测试需求讲解,测试用例讲解&…

使用 Apache DolphinScheduler 进行 EMR 任务调度

By AWS Team 前言 随着企业规模的扩大,业务数据的激增,我们会使用 Hadoop/Spark 框架来处理大量数据的 ETL/聚合分析作业,⽽这些作业将需要由统一的作业调度平台去定时调度。 在 Amazon EMR 中,可以使用 AWS 提供 Step Functio…

Flutter系列文章-Flutter进阶

在前两篇文章中,我们已经了解了Flutter的基础知识,包括Flutter的设计理念、框架结构、Widget系统、基础Widgets以及布局。在本文中,我们将进一步探讨Flutter的高级主题,包括处理用户交互、创建动画、访问网络数据等等。为了更好地…

黄东旭:The Future of Database,掀开 TiDB Serverless 的引擎盖

在 PingCAP 用户峰会 2023 上, PingCAP 联合创始人兼 CTO 黄东旭 分享了“The Future of Database”为主题的演讲, 介绍了 TiDB Serverless 作为未来一代数据库的核心设计理念。黄东旭 通过分享个人经历和示例,强调了数据库的服务化而非服务化…

【C 程序设计】第 1 章:C 语言简介与思维导图

目录 一、C 语言思维导图 (1)数据类型 (2)运算 (3)控制结构 (4)过程式,模块化程序设计 (5)输入输出 (6)编码规…

AntDB数据库与东方通TongWeb完成兼容互认,共筑数字化底座核心能力

近日,湖南亚信安慧科技有限公司(简称:亚信安慧)与北京东方通科技股份有限公司(简称:东方通)完成AntDB数据库与东方通应用服务器TongWeb V7.0的兼容互认。经测试,AntDB数据库能与东方…

C++入门之stl六大组件--Vector库函数的介绍,以及模拟实现一些常用接口

文章目录 前言 一、vector的介绍和使用 1.vector的介绍 2.vector的使用 2.1vector的定义 ​编辑 2.2vector iterator的使用 2.3vector空间增长问题 2.4vector增删查改 2.5vector迭代器失效问题 会引起迭代器失效的操作有: 二、模拟实现一些vector常用接口…

四、运算符(2)

本章概要 关系运算符 测试对象等价 逻辑运算符 短路 字面值常量 下划线指数计数法 位运算符 关系运算符 关系运算符会通过产生一个布尔(boolean)结果来表示操作数之间的关系。如果关系为真,则结果为 true,如果关系为假&#xf…

Android版本的发展4-13

Android 4.4 KitKat 1、通过主机卡模拟实现新的 NFC 功能。 2、低功耗传感器,传感器批处理,步测器和计步器。 3、全屏沉浸模式,隐藏所有系统 UI,例如状态栏和导航栏。它适用于鲜艳的视觉内容,例如照片、视频、地图、…

CTF-REVERSE练习之逆向初探

逆向是指通过反汇编和调试等一些手段及工具,分析计算机程序的二进制可执行代码,从而获得程序的算法细节和实现原理的技术。不仅如此,逆向技能在信息安全面向的具体工作,如恶意代码分析、软件漏洞挖掘、移动安全以及对软件的破解方…

SAP ABAP 用户状态锁定案例

一、前言 项目需求是根据当天及前两天的离职员工信息(假设这是一个定时器任务每天下午5点执行程序,计算前两天的员工工号是为了将5点之后办理离职的员工工号找出来),将这些员工在用户表 USR02 中的锁定状态设置为 “64”&#xff…

“奢侈品”价格的“快消品”,竹叶青这么想赚年轻人的“茶水钱”?

文 | 螳螂观察 作者 | 青月 或许是受养生焦虑的影响,这届年轻人似乎爱上了喝茶。 《抖音电商茶行业洞察报告》数据显示, 年轻客群已经成为了抖音电商茶行业的增长极,在茶叶、茶具、茶文化书籍等方面,18-30岁消费者是当之无愧消…

022 - DISTINCT

SQL SELECT DISTINCT 语句 在表中,可能会包含重复值。这并不成问题,不过,有时您也许希望仅仅列出不同(distinct)的值。 关键词 DISTINCT 用于返回唯一不同的值。 -- 语法: SELECT DISTINCT 列名称 FROM 表…

如何给侧边栏添加 Badge 计数标记

一、需求功能 给侧边菜单栏或及子菜单栏添加计数标记 el-badge 效果如下&#xff1a; 二、实现思路 结合 icon 图标渲染的思路&#xff0c;通过在layout 的 item.vue 中使用 vnodes.push 方法实现对 <el-badge /> 的渲染。在通过 Vuex 的状态管理将菜单栏需要的数据转…

测试自动化面试题

Python python有哪些数据类型? Python支持多种数据类型&#xff0c;包括以下常见的数据类型&#xff1a; 数字类型&#xff1a;整数&#xff08;int&#xff09;、浮点数&#xff08;float&#xff09;和复数&#xff08;complex&#xff09;。 字符串类型&#xff1a;由字…

Mysql-MVCC 并发版本控制

参考链接&#xff1a;一文读懂MVCC实现原理_Nicolos_Z的博客-CSDN博客 1.总述&#xff1a; MVCC 主要是InnoDB解决数据库事务读写&#xff0c;导致的脏读、重复读问题的处理方法。通过快照读的方式&#xff0c;提高数据库并发查询的能力。 2.MVCC的实现 实现MVCC主要用到了…

【隐式动态求解】使用非线性纽马克方法的隐式动态求解研究(Matlab代码实现)

目录 &#x1f4a5;1 概述 &#x1f4da;2 运行结果 &#x1f389;3 参考文献 &#x1f308;4 Matlab代码实现 &#x1f4a5;1 概述 非线性纽马克方法&#xff08;Nonlinear Newton-Raphson method&#xff09;是一种用于求解非线性方程组的数值方法&#xff0c;其中包含了隐式…