企业微信开发
本篇主要介绍,在vue中使用企业微信JS-SDK来开发企业微信的应用
详细案例:本次开发,是通过企业微信,创建外部群既客户群,然后再客户群中添加侧边栏页面。在侧边栏页面中引入vue的H5页面,在其中一个页面点击按钮获取到当前外部群的群id
以下为实际开发遇到的问题和步骤:
一、准备工作
1.新建一个vue项目,用于开发H5
2.需要在企业微信中创建应用,在应用中关联上本vue项目
二、注意要点和坑
1.必须注意以下问题:
1.在企业微信创建应用,需要管理员权限
2.所有的JS接口只能在企业微信应用的可信域名下调用(包括子域名),且可信域名必须有ICP备案且在管理端验证域名归属。 验证域名归属的方法在企业微信的管理后台“我的应用”里,进入应用,设置应用可信域名。
3.相关企业微信的api只能在企业微信中调用:也就是说本地开发,调用企业微信api是会报错的,所以你只能把项目部署上线后,才能去企业微信进行验证。
不过我在工作台配置了本地应用地址(例如:http://192.168.12.123:9999/#/login): 本地IP+端口号+地址,这样本地开发时候,也可以在企业微信的工作台内实时看到效果。但还是存在有些api必须在聊天框内才能调用的问题。
建议: 用自己企业微信创建个自己的企业,当成测试环境,在上面调试。注意代码需要区分好本地和线上调用不同企业微信的应用。
4.官方提供的引入企业微信JS-SDK好像不行???????????????????????????????
我在index.html引入后,不是找不到wx,就是找不到wx.config,又或者找不到wx.agentConfig报undefined
官方文档写的引入企业微信JS-SDK:
<!-- 企业微信开发 引入 jwxwork sdk -->
<script src="//res.wx.qq.com/open/js/jweixin-1.2.0.js"></script>
<script src="https://open.work.weixin.qq.com/wwopen/js/jwxwork-1.0.0.js"></script>
.
.
.
后来我在index.html里引入,在script标签上加了 referrerpolicy="origin",然后就正常了:
我自己引入方式:
<!-- 企业微信开发 引入 jwxwork sdk -->
<script src="https://res.wx.qq.com/open/js/jweixin-1.2.0.js" referrerpolicy="origin"></script>
<script src="https://open.work.weixin.qq.com/wwopen/js/jwxwork-1.0.0.js" referrerpolicy="origin"></script>
5.JS-SDK使用权限签名算法驼峰命名问题:
注意里面的noncestr是有大小写的,既有noncestr,也有nonceStr。
还有签名用的noncestr和timestamp必须与wx.config中的nonceStr和timestamp相同。
6.wx.config和wx.agentConfig不同:
具体区别看文档
wx.agentConfig必须在wx.config成功后调用,也就是在wx.config的wx.ready内调用。但是你想要看到wx.config成功后进入到wx.ready,你就必须将wx.config参数debug设置为debug:true 才可以。
6企业微信的相关:jsApiList 数组中传入需要调用的接口名称
6.wx.config和wx.agentConfig不同:
6.wx.config和wx.agentConfig不同:
三、帮助文档和工具
1.开发文档
2.管理后台
3.基本概念术语
4.开发者社区
5.错误码查询工具,帮助开发者根据接口报错,进行快速定位bug。
1.引入库
代码如下(示例):
总结
提示:这里对文章进行总结: