从0搭建钉钉企业内部H5微应用-前端钉钉免登获取用户信息 ...

 一.开辟者背景操作

1.创建应用 

2.记载下这三个 后面有用到

3.添加应用能力-选择网页应用

4.配置网页地址必填，有pc端地址也可填写

5.安全设置必填

二.下载依赖

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. // 1.获取免登授权码
2. function getAuthCode() {
3.   dd.requestAuthCode({
4.     clientId: clientId, // 钉钉应用id
5.     corpId: corpId, // 企业id
6.     success: res => {
7.       const { code } = res;
8.       authCode = code;  // 免登授权码
9.     },
10.     fail: err => {
11.       message("失败" + JSON.parse(err), { type: "error" });
12.     },
13.     complete: () => {}
14.   });
15. }

复制代码

1. // 2.根据appkey和appSecret获取 access_token
2. http
3.     .axiosRequest({
4.       baseURL: "https://oapi.dingtalk.com",
5.       url: `/gettoken?appkey=${clientId}&appsecret=${clientSecret}`,
6.       method: "GET"
7.     })
8.     .then((res: any) => {
9.       // 3.根据access_token获取userid
10.       http
11.         .axiosRequest({
12.           baseURL: "https://oapi.dingtalk.com",
13.           url: `/topapi/v2/user/getuserinfo?access_token=${res.access_token}`,
14.           method: "POST",
15.           data: {
16.             code: authCode
17.           }
18.         })
19.         .then((res: any) => {;
20.              //拿到用户信息
21.         })
22.         .catch(err => {
23.           message("获取钉钉人员信息失败" + err, { type: "error" });
24.         });
25.     })
26.     .catch(err => {
27.       message("获取钉钉token失败" + err, { type: "error" });
28.     });

复制代码

后两步钉钉跨域交由后端处理，调用一个接口直接返回用户信息就好了。

免责声明：如果侵犯了您的权益，请联系站长，我们会及时删除侵权内容，谢谢合作！更多信息从访问主页：qidao123.com:ToB企服之家，中国第一个企服评测及商务社交产业平台。