想知道怎么搭建一個企業(yè)微信側(cè)邊欄應(yīng)用的，請移步：
https://blog.csdn.net/u013361179/article/details/131936040?spm=1001.2014.3001.5501
1、網(wǎng)頁授權(quán)，獲取code
代碼：
oauthUrl() {
const that = this
uni.removeStorageSync('code')
let REDIRECT_URI = encodeURIComponent(window.location.href)
let CORPID = webConfig.appId
let url =
`https://open.weixin.qq.com/connect/oauth2/authorize?appid=${CORPID}&redirect_uri=${REDIRECT_URI}&response_type=code&scope=snsapi_base&state=STATE#wechat_redirect`
if (window.location.href.indexOf('code=') != -1) { // 避免一直重復(fù)重定向無限獲取code
let code = that.getQueryVariable('code')
if (code == that.getCode()) { // 微信獲取code會重定向，所以從上個頁面返回主頁后，返回的其實是重定向之后的url,此時url一定帶有上次的code,code只能用一次，這時候要重新獲取
let urls = that.ridUrlParam(window.location.href, ['code']) // 從url中祛除code,用沒有code的url重新生成code
window.location.href = urls
}
that.setCode(code) // 保存code
that.getConfig() // 注入企業(yè)權(quán)限
} else {
window.location.href = url
}
},
里面用到的方法：
// 獲取url后參數(shù)code
getQueryVariable(variable) {
var query = window.location.search.substring(1);
var vars = query.split("&");
for (var i = 0; i < vars.length; i++) {
var pair = vars[i].split("=");
if (pair[0] == variable) {
return pair[1];
}
}
return (false);
},
// 刪除URL中指定search參數(shù)
ridUrlParam(url, params) {
/**
* 刪除URL中指定search參數(shù),會將參數(shù)值一起刪除
* @param {string} url 地址字符串
* @param {array} aParam 要刪除的參數(shù)key數(shù)組，如['name','age']
* @return {string} 返回新URL字符串
*/
for (var index = 0; index < params.length; index++) {
var item = params[index];
var fromIndex = url.indexOf(item + "="); //必須加=號，避免參數(shù)值中包含item字符串
if (fromIndex !== -1) {
// 通過url特殊符號，計算出=號后面的的字符數(shù)，用于生成replace正則
var startIndex = url.indexOf("=", fromIndex);
var endIndex = url.indexOf("&", fromIndex);
var hashIndex = url.indexOf("#", fromIndex);
var reg = "";
if (endIndex !== -1) {
// 后面還有search參數(shù)的情況
var num = endIndex - startIndex;
reg = new RegExp(item + "=.{" + num + "}");
url = url.replace(reg, "");
} else if (hashIndex !== -1) {
// 有hash參數(shù)的情況
var num = hashIndex - startIndex - 1;
reg = new RegExp("&?" + item + "=.{" + num + "}");
url = url.replace(reg, "");
} else {
// search參數(shù)在最后或只有一個參數(shù)的情況
reg = new RegExp("&?" + item + "=.+");
url = url.replace(reg, "");
}
}
}
var noSearchParam = url.indexOf("=");
if (noSearchParam === -1) {
url = url.replace(/\?/, ""); // 如果已經(jīng)沒有參數(shù)，刪除？號
}
return url;
}
這個時候就會發(fā)現(xiàn)，如果你是從企業(yè)微信客戶端側(cè)邊欄配置的自定義應(yīng)用，點擊不同的外部聯(lián)系人時，獲取到的code都是一致的，這時候從企業(yè)微信后臺管理去配置，就每次獲取到不同的code了
2、注入企業(yè)權(quán)限、應(yīng)用權(quán)限、獲取當(dāng)前外部聯(lián)系人userid
html引入js文件
<script src="https://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>
然后在manifest.json中配置模板路徑
這個時候，一般頁面中會出現(xiàn)一個無法去掉的“取消”字樣，通過查看是多了個<uni-actionsheet__action>組件，這時候在index.html中加了一行代碼就解決了
<link rel="stylesheet" href="<%= BASE_URL %>static/index.css" />
完整代碼如下:
注入企業(yè)權(quán)限（必須先注入企業(yè)權(quán)限，不然wx（jWeixin）中找不到agentConfig方法，就沒法注入應(yīng)用權(quán)限）：
如果你使用的是uniapp，那么你會發(fā)現(xiàn)你在html引入js文件后，window中會找不到wx對象，這是因為uniapp把wx自用了，但是wx返回了wx和jWeixin兩個，這時候直接用jWeixin就行(這個方法僅限PC)。
如果需要兼容安卓和ios的手機(jī)端，那就需要進(jìn)行判斷，Android使用jWeixin這個變量，iPhone|iPad|iPod|iOS使用wx這個變量，可以通過一個全局方法進(jìn)行判斷，示例代碼：
// global.js
// 當(dāng)前手機(jī)系統(tǒng)
getEWechatSdk() {
let eWechatSdk = ''
if (/(Android)/i.test(navigator.userAgent)) {
eWechatSdk = 'jWeixin'
} else if (/(iPhone|iPad|iPod|iOS)/i.test(navigator.userAgent)) {
eWechatSdk = 'wx'
} else {
eWechatSdk = 'jWeixin'
}
return eWechatSdk
}
// index.vue
created() {
this.chatSdk = this.$global.getEWechatSdk()
},
methods: {
window?.[this.chatSdk].invoke('sendChatMessage', {
msgtype: "text", //消息類型，必填
enterChat: true, //為true時表示發(fā)送完成之后順便進(jìn)入會話，僅移動端3.1.10及以上版本支持該字段
text: {
content: "你好", //文本內(nèi)容
}
}, function(res) {
console.log(res, 'res')
if (res.err_msg == 'sendChatMessage:ok') {
//發(fā)送成功
}
})
}
tips：代碼中的getWxVerify是我們后臺的接口，用來獲取簽名的，，，，最重要的一點，告知后臺開發(fā)仔細(xì)看文檔，獲取access_token要用的corpsecret是應(yīng)用秘鑰，不是企業(yè)秘鑰
還有，請求你們后端接口是，要把請求的ip添加到企業(yè)微信后臺管理的白名單中
// 注入企業(yè)權(quán)限
getConfig() {
const that = this
const path = window.location.href.indexOf("#") !== -1 ? window.location.href.split("#")[0] : window.location.href;
getWxVerify({
url: encodeURIComponent(path),
appId: webConfig.appId
}).then(res => {
console.log(res, 'ressss')
window?.[chatSdk].config({
beta: true,// 必須這么寫，否則wx.invoke調(diào)用形式的jsapi會有問題
debug: false, // 開啟調(diào)試模式,調(diào)用的所有api的返回值會在客戶端alert出來，若要查看傳入的參數(shù)，可以在pc端打開，參數(shù)信息會通過log打出，僅在pc端時才會打印。
appId: res.result.appid, // 必填，企業(yè)微信的corpID，必須是本企業(yè)的corpID，不允許跨企業(yè)使用
timestamp: res.result.timestamp, // 必填，生成簽名的時間戳
nonceStr: res.result.noncestr, // 必填，生成簽名的隨機(jī)串
signature: res.result.signature,// 必填，簽名，見 附錄-JS-SDK使用權(quán)限簽名算法
jsApiList: ['getCurExternalContact'] ,// 必填，需要使用的JS接口列表，凡是要調(diào)用的接口都需要傳進(jìn)來
});
window?.[chatSdk].ready(function(){
console.log('注入企業(yè)權(quán)限成功')
console.log(window, 'window')
// config信息驗證后會執(zhí)行ready方法，所有接口調(diào)用都必須在config接口獲得結(jié)果之后，config是一個客戶端的異步操作，所以如果需要在頁面加載時就調(diào)用相關(guān)接口，則須把相關(guān)接口放在ready函數(shù)中調(diào)用來確保正確執(zhí)行。對于用戶觸發(fā)時才調(diào)用的接口，則可以直接調(diào)用，不需要放在ready函數(shù)中。
that.getAgentConfig() // 注入應(yīng)用權(quán)限
});
})
},
注入應(yīng)用權(quán)限：
// 注入應(yīng)用權(quán)限文章來源：http://www.zghlxwxcb.cn/news/detail-654849.html
getAgentConfig() {
const that = this
const path = window.location.href.indexOf("#") !== -1 ? window.location.href.split("#")[0] : window.location.href;
getWxVerify({
url: encodeURIComponent(path),
appId: webConfig.appId,
type: 'agent_config'
}).then(res => {
console.log(res, 'ressss')
window?.[chatSdk].agentConfig({
corpid: res.result.appid, // 必填，企業(yè)微信的corpID，必須是本企業(yè)的corpID，不允許跨企業(yè)使用
agentid: 1000066, // 必填，企業(yè)微信的應(yīng)用id （e.g. 1000247）
timestamp: res.result.timestamp, // 必填，生成簽名的時間戳
nonceStr: res.result.noncestr, // 必填，生成簽名的隨機(jī)串
signature: res.result.signature,// 必填，簽名，見 附錄-JS-SDK使用權(quán)限簽名算法
jsApiList: ['getCurExternalContact'] ,// 必填，需要使用的JS接口列表，凡是要調(diào)用的接口都需要傳進(jìn)來
success: function(res) {
// 回調(diào)
console.log('注入應(yīng)用權(quán)限成功',res)
that.getCurrentUserId() // 獲取當(dāng)前聯(lián)系人的userid
},
fail: function(res) {
console.log('注入應(yīng)用權(quán)限失敗',res)
if (res.errMsg.indexOf('function not exist') > -1) {
alert('版本過低請升級')
}
}
});
})
},
獲取當(dāng)前聯(lián)系人userid:文章來源地址http://www.zghlxwxcb.cn/news/detail-654849.html
getCurrentUserId() {
const that = this
window?.[chatSdk].invoke('getCurExternalContact', {
}, function(res){
console.log(res, '獲取當(dāng)前外部聯(lián)系人userIdres')
if(res.err_msg == "getCurExternalContact:ok"){
let userId = res.userId ; //返回當(dāng)前外部聯(lián)系人userId
that.setCurrentUserId(userId)
console.log(userId, '獲取當(dāng)前外部聯(lián)系人userId', res)
}else {
//錯誤處理
}
});
},
到了這里，關(guān)于uniapp 企業(yè)微信側(cè)邊欄開發(fā)網(wǎng)頁授權(quán) 注入企業(yè)權(quán)限 注入應(yīng)用權(quán)限 獲取userid（2）的文章就介紹完了。如果您還想了解更多內(nèi)容，請在右上角搜索TOY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章，希望大家以后多多支持TOY模板網(wǎng)！
