开发背景：
第一次来进行企业微信内嵌h5的开发，本来以为就是一个普通的h5项目，心想这个页面也没多少内容，这还不是轻轻松松拿捏。
好吧，等到真正开发的时候，才知道我太天真了，有些坑还是得老老实实的踩一遍。
而且，网上对于企业微信开发的内容 大家的分享也太少了吧，找点资料也找不到。只能自己一点一点摸索。
下面就把一些开发过程中的一些点进行记录一下吧。
开发过程：
贴一下 企业微信开发文档： developer.work.weixin.qq.com/document/pa…
大家可以选择企业内部开发或者第三方应用开发，这个主要看公司后面的部署情况。像我们的话 就是要企业内部开发，但是说后续也要支持第三方应用开发。然后前端的话，就是看一下客户端api开发，基本上把这个官网过一遍就能把开发过程要调用的内容理解个七七八八了。
首先在调用企业微信api 过程中，基本上都需要先通过agentConfig注入权限。所以先引入 agentconfig吧（跟着官网来）
<script src="https://open.work.weixin.qq.com/wwopen/js/jwxwork-1.0.0.js"></script>
wx.agentConfig({
corpid: '', // 必填，企业微信的corpid，必须与当前登录的企业一致
agentid: '', // 必填，企业微信的应用id （e.g. 1000247）
timestamp: , // 必填，生成签名的时间戳
nonceStr: '', // 必填，生成签名的随机串
signature: '',// 必填，签名，见附录-JS-SDK使用权限签名算法
jsApiList: ['selectExternalContact'], //必填，传入需要使用的接口名称
success: function(res) {
// 回调
},
fail: function(res) {
if(res.errMsg.indexOf('function not exist') > -1){
alert('版本过低请升级')
}
}
});
所以再调用一下wx.config.
引入config
<script src="https://res.wx.qq.com/open/js/jweixin-1.2.0.js" referrerpolicy="orgin"></script>
wx.config({
beta: true,// 必须这么写，否则wx.invoke调用形式的jsapi会有问题
// debug: true, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。
appId: appId, // 必填，企业微信的corpID，必须是本企业的corpID，不允许跨企业使用
timestamp: timestamp, // 必填，生成签名的时间戳
nonceStr: nonceStr, // 必填，生成签名的随机串
signature: signature,// 必填，签名，见 附录-JS-SDK使用权限签名算法
jsApiList: ['selectExternalContact', 'getCurCorpGroupContact', 'sendChatMessage', 'getContext', 'getCurExternalContact'] // 必填，需要使用的JS接口列表，凡是要调用的接口都需要传进来
});
这里config踩的坑记录一下。
- 问题1: 当测试完成的时候 需要把 debug: true,删掉，否则在企业微信中打开会一直有弹窗提示
- 问题2: 即使你不适用wx.config里的任何接口，也不要把jsApiList写成空数组，否则会报错提示‘缺少参数’，可以随便写一个就行
- 问题3: 引入的包好像也有问题，我之前引入的是这两个，都试过。 （问题太多，忘记具体是什么问题了，可能是看不了啥信息？），但是不行后续改为了使用
<!-- <script src="https://res.wx.qq.com/wwopen/js/jsapi/jweixin-1.0.0.js"></script> -->
<!-- <script src="https://res2.wx.qq.com/open/js/jweixin-1.0.0.js"></script> -->
<script src="https://res.wx.qq.com/open/js/jweixin-1.2.0.js" referrerpolicy="orgin"></script>
然后就是调用wx的时候，wx拿不到，这个我就不具体说了 可以看我的前一篇笔记（juejin.cn/post/736754…
然后就是调用的时候 一直在报签名错误。（40093 -> 说是签名错误，这个签名为了安全性，需要调用后端接口来生成的）
所以就和后端一顿沟通，后面发现是我的入参有问题，因为是本地，所以这个他自动取的域名就是我的本地域名（localhost那个），所以肯定不行，（这个安全的域名需要在企业微信后台进行配置，将需要的域名添加到应用中），好吧，那就部署到测试环境试一下。可以了。就是要保证你请求的域名 要和 后台配置的域名是一致的。
嗯，又给我的开发带来了一大难度，测什么东西本地不能测，都得发布到测试环境来测，谁懂我的崩溃啊。关键他这个测试环境 和具体的在企业微信中打开也不一样，环境也不相同，嗯，很好，更崩溃了，精神状态非常领先。
其实这里 我很想问问 广大的企业微信开发者，你们都是这么开发的吗？ 我在想可能是我的问题，这个调试起来也太难了。真的是累了。
然后就是想看一眼调试工具，好吧，在浏览器中 打开的环境不一致，在开发者工具中打开的也不是我想要的，在企业微信中打开也看不了调试信息，一直搜索搜索，好吧，关于企业微信的文章看起来还是太少了。
这边可以将企业微信中打开控制台，打开方式为（control+ comment+ shift + D）(这是mac电脑的打开方式哈，window的自行查找哈，应该好找的)，
然后勾选【浏览器与webview相关】里的【开启webview元素审查】就可以了，这时候 点开你的企业微信的h5页面，就可以右键 选择 【审查元素】，就会有控制台了。
然后 emm 很好，就算有控制台，你也是没有任何的信息，不知道咋回事console控制台没有任何的消息。
好吧，试了好多种方式，console不生效，debugger也不起作用， toast也弹不出我想要的内容。很好，就不让我看调试信息是吧。
后面问了一个朋友，他让我试试alert, 好像有点道理。试了一下，果然可以，浏览器的东西 果然还是需要alert。能看到调试信息就舒服多了。 那后面开发就无所畏惧了。
这边的话 主要是试了几个常用的wx api 试了一下都是可以正常使用的，使用wx.invoke('sendChatMessage'，来进行信息的转发，主要是这个用户信息的获取，或许是需要写在success里
setTimeout(() => {
wx.agentConfig({
corpid: corpid, // 必填，企业微信的corpid，必须与当前登录的企业一致
agentid: agentid, // 必填，企业微信的应用id （e.g. 1000247）
timestamp: agentTimestamp, // 必填，生成签名的时间戳
nonceStr: agentNonceStr, // 必填，生成签名的随机串
signature: agentSignature,// 必填，签名，见附录-JS-SDK使用权限签名算法
jsApiList: ['selectExternalContact', 'getCurCorpGroupContact', 'sendChatMessage', 'getContext', 'getCurExternalContact'], //必填，传入需要使用的接口名称
success: function (res) {
wx.invoke('getContext', {}, function(res){
if (res.err_msg == "getContext:ok") {
if (res.entry === 'single_chat_tools') {
// 回调
wx.invoke('getCurExternalContact', {}, function (res) {
if (res.err_msg == "getCurExternalContact:ok") {
alert(res.userId)
console.log('getCurExternalContact-success', res)
// corpId = res.corpId; // 返回当前联系人的企业corpId
// userId = res.userId ; //返回当前联系人userId
// Toast.show({
// content: res.userId,
// afterClose: () => {
// console.log('after')
// },
// })
} else {
console.log(res, 'err-getCurCorpGroupContact')
//错误处理
}
});
}
// entry = res.entry ; //返回进入H5页面的入口类型，目前有normal、contact_profile、single_chat_tools、group_chat_tools、chat_attachment
// shareTicket = res.shareTicket; //可用于调用getShareInfo接口
} else {
//错误处理
}
});
},
fail: function (res) {
console.log(res, 'agentConfig-fail')
if(res.errMsg.indexOf('function not exist') > -1){
alert('版本过低请升级')
}
}
});
wx.invoke('getContext', {
}, function(res){
if (res.err_msg == "getContext:ok") {
console.log(res, 123)
// entry = res.entry ; //返回进入H5页面的入口类型，目前有normal、contact_profile、single_chat_tools、group_chat_tools、chat_attachment
// shareTicket = res.shareTicket; //可用于调用getShareInfo接口
}else {
//错误处理
}
});
})
很好，开发很顺利，基本想要的都能拿到了，虽然说是过程中磕磕碰碰，倒也还好，一天多的调试时间，基本就弄清了。虽然过程很坎坷，但是结局还是美好的。
然后就是这边后续大家有什么企业微信相关的问题，也可以找我来留言讨论呀。一起学习，学无止境。
但是，还是想和企业微信官方吐槽一下，文档可以更完善一点吗？ 以及具体的测试调试 可以有一个文档说明吗。作为开发者 一点点摸索，真的是有点想吐槽哈哈。
完结 撒花！！！
