从0搭建钉钉企业内部H5微应用-前端钉钉免登获取用户信息
一.开辟者背景操作1.创建应用
https://i-blog.csdnimg.cn/direct/64f1487d413e4ccdb4d9b45bb5c168fc.png
2.记载下这三个 后面有用到
https://i-blog.csdnimg.cn/direct/de71b68a1ad0410da8277f1649e71f6d.png
3.添加应用能力-选择网页应用
https://i-blog.csdnimg.cn/direct/16ff167e11424c83ae9eb20a168c80df.png
4.配置网页地址必填,有pc端地址也可填写
https://i-blog.csdnimg.cn/direct/a764066329ea444bb0cc7a7615c55276.png
5.安全设置必填
https://i-blog.csdnimg.cn/direct/8f120d29bfe44d6e8e6b0651aa833df9.png
二.下载依赖
1.安装依赖
npm install dingtalk-jsapi --save
2.引入钉钉依赖
import * as dd from "dingtalk-jsapi";
三.免登前端代码
一共分三步(钉钉api文档提供):
1.获取免登授权码
2.根据Client ID和Client Secret获取 access_token
3.根据access_token和免登授权码获取用户信息
// 1.获取免登授权码
function getAuthCode() {
dd.requestAuthCode({
clientId: clientId, // 钉钉应用id
corpId: corpId, // 企业id
success: res => {
const { code } = res;
authCode = code;// 免登授权码
},
fail: err => {
message("失败" + JSON.parse(err), { type: "error" });
},
complete: () => {}
});
} // 2.根据appkey和appSecret获取 access_token
http
.axiosRequest({
baseURL: "https://oapi.dingtalk.com",
url: `/gettoken?appkey=${clientId}&appsecret=${clientSecret}`,
method: "GET"
})
.then((res: any) => {
// 3.根据access_token获取userid
http
.axiosRequest({
baseURL: "https://oapi.dingtalk.com",
url: `/topapi/v2/user/getuserinfo?access_token=${res.access_token}`,
method: "POST",
data: {
code: authCode
}
})
.then((res: any) => {;
//拿到用户信息
})
.catch(err => {
message("获取钉钉人员信息失败" + err, { type: "error" });
});
})
.catch(err => {
message("获取钉钉token失败" + err, { type: "error" });
}); 后两步钉钉跨域交由后端处理,调用一个接口直接返回用户信息就好了。
免责声明:如果侵犯了您的权益,请联系站长,我们会及时删除侵权内容,谢谢合作!更多信息从访问主页:qidao123.com:ToB企服之家,中国第一个企服评测及商务社交产业平台。
页:
[1]