引入企业微信jssdk
今天写这篇文章,主要是面向工作中在企业微信里引入jssdk的人。其实企业微信jssdk和微信公众号的jssdk是差不多的,但这里面有很多需要注意的地方,也可以让大家少走很多弯路。
调用普通接口:引入jweixin-module包,导入jweixin-module,进行config配置,使用。
调用需要agentConfig的接口:引入jweixin-module包,引入jwxwork sdk,进行config配置,进行agentConfig配置,使用。这里注意的是从企业微信3.0.24及以后版本(可通过企业微信UA判断版本号),无须先调用wx.config,可直接wx.agentConfig.这里UA可以尝试看看,如果不太想弄的话就先调用config就行。
1.jssdk包
这里我推荐微信公众号和企业微信可以一起使用的包jweixin-module,亲测有效!
npm install jweixin-module --save
2.配置jssdk
这里配置时注意jsApiList里要填对应的接口
const jweixin = require("jweixin-module");
initWxWorkJssdk: function(callback) {
// jssdk配置,跟后端配合请求对应的签名接口,这里的appid是企业微信的appid
Vue.prototype.$api.yzhshopAdmin.commonA1
.jssdkConfig({
sign_url: window.location.href.split("#")[0],
type: 1,
shop_id: uni.getStorageSync("UserInfoData").shop_id || {},
})
.then((res) => {
if (res.code === 200) {
jweixin.config({
beta: true, // 必须这么写,否则wx.invoke调用形式的jsapi会有问题
debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来,若要查看传入的参数,可以在pc端打开,参数信息会通过log打出,仅在pc端时才会打印。
appId: res.data.appId, // 必填,企业微信的corpID
timestamp: res.data.timestamp, // 必填,生成签名的时间戳
nonceStr: res.data.nonceStr, // 必填,生成签名的随机串
signature: res.data.signature, // 必填,签名,见 附录-JS-SDK使用权限签名算法
jsApiList: [
"onMenuShareAppMessage",
"updateAppMessageShareData",
"selectExternalContact",
"launchMiniprogram",
"openUserProfile",
"shareAppMessage",
"onMenuShareAppMessage",
"onMenuShareWechat",
"shareWechatMessage",
"scanQRCode",
"openEnterpriseChat"
]
});
// 配置完成,再执行分享等功能
if (callback) {
callback(res.data);
}
}
})
.catch((err) => {});
},
3.使用对应方法接口
scanQRCode: function(shop_id) {
uni.showLoading({
title: '正在加载'
});
this.initWxWorkJssdk(function() {
jweixin.ready(function() {
jweixin.scanQRCode({});
});
});
}
4.引入jwxwork sdk
这里的jwxwork sdk我建议先用官方的open.work.weixin.qq.com/wwopen/js/j…
实在不行就这个包res.wx.qq.com/wwopen/js/j…
或者有更好的npm包的朋友可以提供一下,官方的包好像没有agentConfig。第二个包是社区提供的。
代码
首先需要先成功调用上面的config接口,然后在wx.ready里继续调用agentConfig
this.initWxWorkJssdk(function() {
jweixin.ready(function() {
Vue.prototype.$api.yzhshopAdmin.commonA1
.jssdkConfig({
sign_url: window.location.href.split("#")[0],
type: 2,
})
.then((res) => {
if (res.code === 200) {
wx.agentConfig({
debug: true,
corpid: res.data.corpid, // 必填,企业微信的corpid,必须与当前登录的企业一致
agentid: res.data.agentid, // 必填,企业微信的应用id (e.g. 1000247)
timestamp: res.data.timestamp, // 必填,生成签名的时间戳
nonceStr: res.data.nonceStr, // 必填,生成签名的随机串
signature: res.data.signature, // 必填,签名,见附录-JS-SDK使用权限签名算法
jsApiList: [
"scanQRCode"
], //必填
success: function(res) {
wx.invoke('launchMiniprogram', {
"appid" : "wx062aaa5507909631", // 需跳转的小程序appid
"path" : "pages/home/index.html", // 所需跳转的小程序内页面路径及参数。非必填
}, function(res) {
if(res.err_msg == "launchMiniprogram:ok") {
// 正常
} else {
// 错误处理
}
}
);
},
fail: function(res) {
console.log(res);
uni.showToast({
title: res,
duration: 2000,
});
if (res.errMsg.indexOf("function not exist") > -1) {
alert("版本过低请升级");
}
},
});
}
})
.catch((err) => {});
});
});
适用接口
跳转小程序,如果开发这个功能的需要注意了,这个只限于自己企业H5跳转到自己企业开发的小程序。
最后注意事项
如果你用的是普通的jssdk接口,就只用引入jweixin-module这个包即可了,重点观察接口下方有没有提示需要使用agentConfig 而真的需要使用agentConfig接口的小伙伴,首先需要尝试使用官方提供的jssdk,如果不行,导入文章中的第二包,最后不行联系客服,整个过程参考官方的demo来做
最后如果调用成功了,要同时测试安卓和苹果。有任何问题也可以再下方留言,我看到会给你回复。感谢你看到最后,谢谢!
参考链接
企业微信jssdkdemo(官方)
企业微信文档
企业微信巨坑:wx.agentConfig is not a function
企业微信客服二维码