职贝云数AI新零售门户

标题: uni-app开发企微H5——推送音讯给客户 [打印本页]

---

作者: 5YoiEl86cdnY    时间: 2022-12-30 14:42
标题: uni-app开发企微H5——推送音讯给客户
前言：在企微推送个音讯给客户怎样就这么难那？？？别以为有了开发文档你就可以勇往直前了！后面的路还需求你披荆斩棘那~

企微开发文档：聊天工具栏接口 - 接口文档 - 企业微信开发者中心
第一步：援用企微的js-sdk

1. <script src="//res.wx.qq.com/open/js/jweixin-1.2.0.js"></script>

复制代码

运用阐明 - 接口文档 - 企业微信开发者中心
我把配置js-sdk的代码都放在了qy_wechat.js里，所以需求在main.js中援用一下，如下代码！

1. import qy_wechat from '@/common/qy_wechat.js'
2. Vue.prototype.$qy_wechat = qy_wechat;
3. qy_wechat.initJssdk()

复制代码

由于运用的是uni-app，援用的时分需求加在template.h5.html中（没有这个文件需求新建）uni-app官网，然后按图配置。

(, 下载次数: 2)

上传

点击文件名下载附件

如何判别援用成功？看下图

(, 下载次数: 3)

上传

点击文件名下载附件

在资源中能看到这个文件就代表你曾经完成了第一步！！！
第二步：配置config 和 agentConfig

假如你是援用的jweixin-module，需求先卸载掉，然后直接用jWeixin来代替wx！不然就是wx.config is not a function~别问我为什么知道！不过这个方法也是看了别人的回答试的~
(1)、配置config代码

1.         initJssdk: function() {
2.                 let that = this
3.                 uni.request({
4.                         url: 央求的接口url,
5.                         data: {
6.                                 agentid: '你本人的agentid',
7.                                 purl: window.location.href
8.                         },
9.                         success: result => {
10.                                 if (result.data) {
11.                                         jWeixin.config({
12.                                                 beta: true, // 必须这么写，否则wx.invoke调用方式的jsapi会有成绩
13.                                                 debug: false,
14.                                                 appId: result.data.appId, // 必填，企业微信的corpID
15.                                                 timestamp: result.data.timestamp, // 必填，生成签名的工夫戳
16.                                                 nonceStr: result.data.nonceStr, // 必填，生成签名的随机串
17.                                                 signature: result.data.signature, // 必填，签名，见附录-JS-SDK运用权限签名算法
18.                                                 jsApiList: [
19.                                                         'checkJsApi',
20.                                                         'updateAppMessageShareData', //冤家
21.                                                         'updateTimelineShareData', //冤家圈
22.                                                         'chooseImage',
23.                                                         'uploadImage',
24.                                                         'getLocalImgData',
25.                                                         'getLocation',
26.                                                         'openLocation',
27.                                                         'hideAllNonBaseMenuItem', //隐藏一切非基础按钮接口
28.                                                         'showAllNonBaseMenuItem',
29.                                                         'scanQRCode',
30.                                                         'previewImage'
31.                                                 ]
32.                                         });
34.                                         // config信息验证后会执行ready方法，一切接口调用都必须在config接口获得结果之后，
35.                                         // config是一个客户端的异步操作，所以假如需求在页面加载时就调用相关接口，则须把相关接口放在ready函数中调用来确保正确执行。
36.                                         // 对于用户触发时才调用的接口，则可以直接调用，不需求放在ready函数中。
37.                                         jWeixin.ready(function() {
38.                                                 console.log("ready，配置完成")
39.                                                 that.initWxWorkJssdk()
40.                                         });
43.                                 }
44.                         }
45.                 });
46.         },

复制代码

(2)、配置agentConfig代码

1.         //初始化sdk配置  
2.         initWxWorkJssdk: function() {
3.                 let that = this
4.                 uni.request({
5.                         url: 接口url,
6.                         data: {
7.                                 agentid: 你本人的agentid,
8.                                 purl: window.location.href
9.                         },
10.                         success: res => {
11.                                 if (res.errMsg != "request:ok") {
12.                                         alert(res.errMsg);
13.                                 } else {
14.                                         let d = res.data.d;
15.                                        
16.                                                 jWeixin.agentConfig({
17.                                                         corpid: d.appId, // 必填，企业微信的corpid，必须与当前登录的企业分歧
18.                                                         agentid: 1000060, // 必填，企业微信的运用id
19.                                                         timestamp: d.timestamp, // 必填，生成签名的工夫戳
20.                                                         nonceStr: d.nonceStr, // 必填，生成签名的随机串
21.                                                         signature: d.signature, // 必填，签名，见附录1
22.                                                         jsApiList: [
23.                                                                 'checkJsApi',
24.                                                                 'getContext',
25.                                                                 'getCurExternalContact',
26.                                                                 'getCurExternalChat',
27.                                                                 'sendChatMessage'
28.                                                         ], //必填
29.                                                         success: function() {
30.                                                                 that.Getcontext()
31.                                                         },
32.                                                         fail: function(res) {
33.                                                                 alert(res.errMsg);
34.                                                                 if (res.errMsg.indexOf("function not exist") > -1) {
35.                                                                         alert("版本过低请晋级");
36.                                                                 }
37.                                                         }
38.                                                 });
39.                                        
40.                                 }
43.                         }
44.                 });
45.         },

复制代码

这里值得留意的是config可以在微信工具上调试，但是agentConfig需求发布之后再手机上看！我试过真机调试也不行！就很烦！！！爆炸~不知道你们有什么好方法~我看有的是用了什么代理软件搞的。没试过
第三步：获取进入H5页面的入口环境 - 接口文档 - 企业微信开发者中心

1.         //判别入口
2.         Getcontext() {
3.                 var that = this;
4.                         jWeixin.invoke('getContext', {}, function(res) {
5.                                 if (res.err_msg == "getContext:ok") {
6.                                         // that.entry = res.entry;
7.                                         uni.setStorageSync('entry',res.entry)
8.                                        
9.                                         //前往进入H5页面的入口类型，目前有normal、contact_profile、single_chat_tools、group_chat_tools、chat_attachment
10.                                         that.getExternalid(res.entry)
11.                                         // shareTicket = res.shareTicket; //可用于调用getShareInfo接口
12.                                 } else {
13.                                         //错误处理
14.                                 }
15.                         });
16.         },

复制代码

第四步：获取当前外部联络人userid - 接口文档 - 企业微信开发者中心

1. getExternalid(entry) {
2.                 var that = this
3.                 if (entry == 'contact_profile' || entry == 'single_chat_tools') {
4.                        
5.                         jWeixin.invoke('getCurExternalContact', {}, function(res) {
6.                                
7.                                 if (res.err_msg == "getCurExternalContact:ok") {
8.                                         uni.setStorageSync('userId',res.userId)
9.                                        
10.                                         // that.userId = res.userId; //前往当前外部联络人userId
11.                                
12.                                 } else {
13.                                         //错误处理
14.                                 }
15.                         });
16.                 }
17.                 if (entry == 'group_chat_tools') {
18.                         jWeixin.invoke('getCurExternalChat', {}, function(res) {
19.                                 if (res.err_msg == "getCurExternalChat:ok") {
20.                                         uni.setStorageSync('chatId',res.chatId)
21.                                         // that.chatId = res.chatId; //前往当前客户群的群聊ID
22.                                 } else {
23.                                         //错误处理
24.                                 }
25.                         });
26.                 }
27.         }

复制代码

第五步：分享音讯到当前会话 - 接口文档 - 企业微信开发者中心

1. // 推送音讯
2. pushThis(){
3.                                 var that = this
4.                                 var ua = window.navigator.userAgent.toLowerCase();
5.                                 console.log(ua)
6.                                 console.log(ua.match(/wxwork/i) == 'wxwork')
7.                                 if (ua.match(/wxwork/i) == 'wxwork') {
8.                                        
9.                                         jWeixin.invoke('sendChatMessage', {
10.                                                 msgtype:"text", //音讯类型，必填
11.                                                 enterChat: true, //为true时表示发送完成之后特地进入会话，仅移动端3.1.10及以上版本支持该字段
12.                                                 text: {
13.                                                         content:that.content, //文本内容
14.                                                 }
15.                                         }, function(res) {
16.                                                 if (res.err_msg == 'sendChatMessage:ok') {
17.                                                         //发送成功
18.                                                         uni.showModal({
19.                                                                 title:'提示',
20.                                                                 content:"发送成功"
21.                                                         })
22.                                                 }
23.                                         })
24.                                 } else {
25.                                         uni.showToast({
26.                                                 title: "请在企业微信端操作",
27.                                                 icon: "none"
28.                                         })
29.                                         return
30.                                 }
31. }

复制代码

推送音讯的之前必须在企业微信后台配置上你的运用，才能调用，不然会出现报错——getCurExternalContact:fail_nopermission！如图：

(, 下载次数: 2)

上传

点击文件名下载附件

假如发布之后，发如今企微打不开？确保你的运用在后台配置了可信域名！

(, 下载次数: 3)

上传

点击文件名下载附件

结果发现苹果手机不能运用，请看下篇文章。
uni-app开发企微H5——推音讯给客户（安装包版）_Strawberry96的博客-CSDN博客

---

欢迎光临 职贝云数AI新零售门户 (https://www.taojin168.com/cloud/)

Powered by Discuz! X3.5