侧边栏JS-SDK
侧边栏JS-SDK是面向网页开发者提供的的网页开发工具包,类似企业微信JS-SDK。
使用说明
在需要调用JS接口的页面引入JS文件,通过wx对象调用相关接口。
<script src="//res.wx.qq.com/open/js/jweixin-1.2.0.js"></script>
<script src="https://cdn.botorange.com/js/sidebar/juzi-helper-1.0.7.js"></script>
<!--
1.juzi-helper仅在句子秒回侧边栏环境下覆写wx对象,成功后window.wx.isJuziWx === true
2.如果使用npm安装的jweixin或页面不存在wx对象,juzi-helper的覆写可能不会成功,此时可使用window.juziWx
-->
相关接口
获取当前外部联系人userid
同企业微信JS-SDK
wx.invoke('getCurExternalContact', { }, function(res){
if (res.err_msg == "getCurExternalContact:ok") {
//成功处理 {userId: 'xxx', err_msg: 'getCurExternalContact:ok'}
} else {
//错误处理 {userId: undefined, err_msg: 'getCurExternalContact:fail'}
}
});
获取当前客户群的群ID
从客户群的聊天工具栏进入页面时才可成功调用该接口
wx.invoke('getCurExternalChat', {}, function(res){
if (res.err_msg == "getCurExternalChat:ok") {
//成功处理 {chatId: 'xxx', err_msg: 'getCurExternalChat:ok'}
} else {
//错误处理 {chatId: undefined, err_msg: 'getCurExternalChat:fail'}
}
});
分享消息到当前会话
type TextMsg = { msgtype: 'text'; text: { content: string; } };
type ImageMsg = {
msgtype: 'image';
image: {
url: string;
title?: string;
};
}
type VideoMsg = {
msgtype: 'video';
video: {
url: string;
title?: string;
};
}
type FileMsg = {
msgtype: 'file';
file: {
url: string;
title?: string;
};
}
type NewsMsg = {
msgtype: 'news',
news: {
link: string,
title?: string,
desc?: string,
imgUrl?: string,
},
}
type MiniprogramMsg = {
msgtype: "miniprogram",
miniprogram: {
appid: string, // 小程序的appid
title: string, // 小程序消息的title
imgUrl: string, // 小程序消息的封面图。必须带http或者https协议头
page: string, // 小程序消息打开后的路径
desc: string, // 小程序描述
iconUrl: string, // 小程序icon地址
officialAccountId: string, // 小程序原始id
},
}
type SendParams = TextMsg | ImageMsg | VideoMsg | FileMsg | NewsMsg | MiniprogramMsg;
type ErrMsg = 'sendChatMessage:ok' | 'text content is empty' | 'url is empty';
type Callback = (res: { err_msg: ErrMsg; }) => void;
wx.invoke('sendChatMessage', sendParams: SendParams, callback: Callback);
打开会话
调用接口将会在【聚合聊天-全部】中打开会话
wx.openEnterpriseChat({
userIds: 'zhangsan', // 企业微信企业成员userId,必传
externalUserIds: 'wmEAlECwAAHrbWYDOK5u3Bf13xlYDAAA', // 企业微信外部联系人userId
chatId: 'CHATID', // 企业微信外部群chatId
success: function(res) {
// 成功处理 {err_msg: 'openEnterpriseChat:ok'}
},
fail: function(res) {
// 失败处理 {err_msg: 'xxx'}
}
})
TIP
仅新版聚合聊天支持,旧版聚合聊天不支持此接口
仅支持打开会话,暂不支持新建会话
externalUserIds 和 chatId 二选一,externalUserIds优先于chatId
预览图片
wx.previewImage({
current: '', // 可选,第一张显示的图片链接
urls: [], // 必填,需要预览的图片http链接列表
})
TIP
仅新版聚合聊天支持,旧版聚合聊天不支持此接口
代码示例
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>demo</title>
<script src="//res.wx.qq.com/open/js/jweixin-1.2.0.js"></script>
<script src="https://cdn.botorange.com/js/sidebar/juzi-helper-1.0.7.js"></script>
<style>
textarea {
display: block;
margin-bottom: 12px;
}
</style>
</head>
<body>
<textarea id="messageInput" rows="4"></textarea>
<button onclick="sendMessage()">发送</button>
<div style="margin-top: 40px;">
<span>userIds</span>
<input id="userIds" />
</div>
<div>
<span>externalUserIds</span>
<input id="externalUserIds" />
</div>
<div>
<span>chatId</span>
<input id="chatId" />
</div>
<button style="margin-top: 10px;" onclick="openEnterpriseChat()">打开会话</button>
<div style="margin-top: 40px;">
<img src="https://zos.alipayobjects.com/rmsportal/jkjgkEfvpUPVyRjUImniVslZfWPnJuuZ.png"/>
<button onclick="previewImage()">预览图片</button>
</div>
<script>
// 如果isJuziWx非true,wx对象没有覆写成功,可使用window.juziWx替代window.wx
console.log('isJuziWx: ', window.wx.isJuziWx);
// 获取当前外部联系人userid
wx.invoke('getCurExternalContact', {}, function (res) {
if (res.err_msg == "getCurExternalContact:ok") {
console.log('获取当前外部联系人:ok', res);
} else {
console.log('获取当前外部联系人:fail', res);
}
});
// 获取当前客户群的群ID
wx.invoke('getCurExternalChat', {}, function (res) {
if (res.err_msg == "getCurExternalChat:ok") {
console.log('获取当前客户群的群:ok', res);
} else {
console.log('获取当前客户群的群:fail', res);
}
});
// 分享消息到当前会话
function sendMessage() {
var message = document.getElementById("messageInput").value;
console.log("发送消息:" + message);
wx.invoke('sendChatMessage', {
msgtype: 'text',
text: { content: message }
}, res => {
console.log("发送结果:", res);
});
}
// 打开会话
function openEnterpriseChat() {
const userIds = document.getElementById("userIds").value;
const externalUserIds = document.getElementById("externalUserIds").value;
const chatId = document.getElementById("chatId").value;
wx.openEnterpriseChat({
userIds,
externalUserIds,
chatId,
success: function(res) {
console.log('打开会话success:', [res]);
var chatId = res.chatId;
},
fail: function(res) {
console.log('打开会话fail:', [res]);
}
});
}
// 预览图片
function previewImage() {
wx.previewImage({
urls: ['https://zos.alipayobjects.com/rmsportal/jkjgkEfvpUPVyRjUImniVslZfWPnJuuZ.png'],
});
}
</script>
</body>
</html>
身份认证
提供了OAuth的授权登录方式,可以让从自定义侧边栏打开的网页获取成员的身份信息,从而免去登录的环节。
构造授权链接
如果企业需要在打开的网页里面携带用户的身份信息,第一步需要构造如下的链接来获取code参数:
https://hub.juzibot.com/oauth/connect/authorize?redirect_uri=REDIRECT_URI&state=STATE
参数说明:
参数 | 必须 | 说明 |
---|---|---|
redirect_uri | 是 | 授权后重定向的回调链接地址,请使用urlencode对链接进行处理 |
state | 否 | 重定向后会带上state参数,企业可以填写a-zA-Z0-9的参数值,长度不可超过128个字节 |
将会以当前聊天窗口所属的托管企业微信进行自动授权,授权后页面将跳转至 redirect_uri?code=CODE&state=STATE&juziBotId=juziBotId,企业可根据code参数获得员工的userId。juziBotId为托管微信的id。
获取成员(托管账号)身份
该接口用于根据code获取成员信息
请求地址:
GET https://hub.juzibot.com/api/v1/oauth/getUserInfo?code=**
参数说明:
参数 | 类型 | 备注 | 是否必须 |
---|---|---|---|
code | string | 通过成员授权获取到的code。每次成员授权带上的code将不一样,code只能使用一次,5分钟未被使用自动过期。 | 是 |
返回示例:
{
"errcode": 0,
"errmsg": "",
"data": {
"userId":"userId",
"corpId":"ww5ecc1acd5dce6e9d",
"botId":"647844cd6059597fc5c79f38",
"orgId":"644a448ab93794cbdccf93cb",
"uid": "644a448ab93794cbdccf93ca",
"email": "donghao_12_15@163.com"
}
}
返回参数说明:
参数 | 类型 | 必定存在 | 备注 |
---|---|---|---|
errcode | number | 是 | 返回码,0 成功,-1 无效的授权码,-2 授权码已过期,-4 未找到授权码,-5 未知错误 |
errmsg | string | 否 | 对返回码的文本描述内容 |
data.userId | string | 是 | 托管账号的企业微信明文userId |
data.corpId | string | 是 | 托管账号的企业微信明文corpId |
data.botId | string | 是 | 托管账号id |
data.orgId | string | 是 | 秒回企业id |
data.uid | string | 是 | 秒回成员id |
data.email | string | 否 | 秒回成员邮箱 |