微信小程序web-view嵌入uni-app H5页面,通过H5页面跳转企业微信客户聊天窗口如何操作?

简介: 微信小程序web-view嵌入uni-app H5页面,通过H5页面跳转企业微信客户聊天窗口如何操作?

1、先找到企业ID和企业微信聊天接入链接

1)找到企业ID,登录 企业微信

2)找到接入链接

2、登录微信公众平台,功能-客服-微信客服

image.png

3、开始写H5页面代码

let d = {
  corpId: 'ww931你挚爱的强哥8dee',//企业微信ID
  url: 'https://work.weixin.qq.com/kfid/kfc18你挚爱的强哥af71',//企业微信客户接入链接
}
let p = Object.keys(d).reduce((p, k, i) => p + `${i ? '&' : '?'}${k}=${d[k]}`, '');
wx.miniProgram.reLaunch({ url: `/pages/index/index${p}` });//触发小程序刷新页面获取appId

4、对应小程序页面代码

//pages/index/index.js代码如下
Page({
    ...
    onLoad(options) {
        // 跳转到企业微信客服聊天窗口
        if (options.corpId && options.url) {
            //必须要触发点击事件才能唤起聊天窗口,所以多加了一个弹窗,否者会报错{errMsg: "openCustomerServiceChat:fail can only be invoked by user TAP gesture."}
            wx.showModal({
                title: '提示',
                content: '即将跳转到企业微信客服聊天窗口',
                confirmText: '我知道了',
                showCancel: false,
                success(res) {
                    if (res.confirm) {
                        wx.openCustomerServiceChat({
                            corpId: options.corpId,//企业微信ID
                            extInfo: { url: options.url },//企业微信聊天接入链接
                        })
                    }
                }
            })
        }
    },
    ...
});


相关文章
|
缓存 小程序 开发工具
最新原创uniapp+vue3仿微信界面聊天app系统
最新原创研发uniapp+vue3实战跨端仿微信App界面聊天程序。支持运行到H5+小程序+APP端。
521 6
最新原创uniapp+vue3仿微信界面聊天app系统
|
存储 人工智能 Android开发
为什么微信发送的APP安装不了,.apk转化为.apk.1
微信发送的APP文件常被改为.apk.1格式导致无法安装,推荐使用夸克或QQ浏览器解决。
2663 14
|
缓存 小程序 前端开发
商城/点餐/家政类小程序源码合集_微信抖音小程序源码开发从入门到精通实战
本文系统讲解如何利用现有源码快速开发商城、点餐、家政类微信/抖音小程序,涵盖环境搭建、核心功能实现、多平台部署与优化,提供完整技术方案。实战导向,助力开发者高效入门与落地。
|
存储 小程序 Java
热门小程序源码合集:微信抖音小程序源码支持PHP/Java/uni-app完整项目实践指南
小程序已成为企业获客与开发者创业的重要载体。本文详解PHP、Java、uni-app三大技术栈在电商、工具、服务类小程序中的源码应用,提供从开发到部署的全流程指南,并分享选型避坑与商业化落地策略,助力开发者高效构建稳定可扩展项目。
|
12月前
|
缓存 移动开发 JavaScript
如何优化UniApp开发的App的启动速度?
如何优化UniApp开发的App的启动速度?
1729 139
|
12月前
|
移动开发 JavaScript weex
UniApp开发的App在启动速度方面有哪些优势和劣势?
UniApp开发的App在启动速度方面有哪些优势和劣势?
788 137
|
移动开发 小程序 Android开发
基于 uni-app 开发的废品回收类多端应用功能与界面说明
本文将对一款基于 uni-app 开发的废品回收类多端应用,从多端支持范围、核心功能模块及部分界面展示进行客观说明,相关资源信息也将一并呈现。
371 0
|
12月前
|
数据采集 JavaScript 前端开发
开发比分App?你缺的不是程序员
开发体育比分App,关键不在代码,而在懂体育、懂数据、懂用户。明确定位、理清需求、选好数据源,再找专业的产品、数据与技术人才协同,才能少走弯路。程序员最后入场,效率最高。
465 154