钉钉用户免登Demo
1. 功能介绍
“应用免登录”是指当用户点击一个应用时，无需单独手动输入钉钉用户名和密码，应用程序可自动获取当前用户的钉钉身份，通过钉钉的身份登录应用。
2. 项目结构
frontend：前端模块，使用react构建，主要功能有：接入钉钉JSAPI获取authCode、展示免登用户信息。
backend：后端模块，使用springboot构建，主要功能有：使用authCode获取access_token、使用access_token获取用户信息、使用用户id获取用户详情等。
以下为目录结构与部分核心代码文件：
.
├── README.md ----- 说明文档
├── backend
│ ├── dingBoot-linux.sh ----- 启动脚本（linux）
│ ├── dingBoot-mac.sh ----- 启动脚本（mac）
│ ├── dingBoot-windows.bat ----- 启动脚本（windows）
│ ├── lib ----- 开发SDK包
│ ├── pom.xml
│ └── src
│ └── main
│ ├── java
│ │ └── com
│ │ └── aliyun
│ │ └── dingtalk
│ │ ├── Application.java ----- 启动类
│ │ ├── config
│ │ │ └── AppConfig.java ----- 应用配置类
│ │ ├── constant
│ │ │ └── UrlConstant.java ----- 接口API
│ │ ├── controller
│ │ │ ├── DingTalkConfig.java ----- 获取配置接口
│ │ │ └── DingTalkUserController.java ----- 核心业务接口
│ │ └── service
│ │ └── DingTalkUserService.java ----- 核心业务代码
│ └── resources
│ └── application.properties ----- 应用配置文件
├── frontend
│ └── src
│ └── App.js ----- 前端展示页面和交互代码
└── pom.xml
3. 开发环境准备
-
需要有一个钉钉注册企业，如果没有可以创建：https://oa.dingtalk.com/register_new.htm#/
-
成为钉钉开发者，参考文档：https://developers.dingtalk.com/document/app/become-a-dingtalk-developer
-
登录钉钉开放平台后台创建一个H5应用： https://open-dev.dingtalk.com/#/index
-
配置应用：
① 配置开发管理，参考文档：https://developers.dingtalk.com/document/app/configure-orgapp
此处配置“应用首页地址”需公网地址，若无公网ip，可使用钉钉内网穿透工具： https://developers.dingtalk.com/document/resourcedownload/http-intranet-penetration
② 配置相关权限，参考文档：https://developers.dingtalk.com/document/app/address-book-permissions
本demo使用接口权限："成员信息读权限"
4. 启动项目
4.1 脚本启动（推荐）
脚本启动，只需执行一条命令即可启动项目，方便快速体验。
4.1.1 脚本说明
① 脚本启动前置条件：
- 安装配置了java开发环境（jdk、maven）
- 安装配置了git工具
② 脚本类型如下：
dingBoot-linux.sh # linux版本
dingBoot-mac.sh # mac版本
dingBoot-windows.bat # windows版本4.1.2 下载项目
git clone https://github.com/open-dingtalk/h5app-auth-demo.git4.1.3 启动脚本
执行时将命令中示例参数替换为应用参数，在后端项目（脚本同级目录）下运行命令。
① 脚本运行命令：
- 执行linux脚本
./dingBoot-linux.sh start {项目名} {端口号} {appKey} {appSecret} {agentId} {corpId}- mac系统（使用终端运行，mac m1芯片暂不支持）
./dingBoot-mac.sh start {项目名} {端口号} {appKey} {appSecret} {agentId} {corpId}- windows系统 使用cmd命令行启动
./dingBoot-windows.bat {项目名} {端口号} {appKey} {appSecret} {agentId} {corpId}- 示例（linux脚本执行）
./dingBoot-linux.sh start h5-demo 8080 ding1jmkwa4o19bxxxx ua2qNVhleIx14ld6xgoZqtg84EE94sbizRvCimfXrIqYCeyj7b8QvqYxxx 122549400 ding9f50b15bccd1000② 参数获取方法：
-
获取corpId——开发者后台首页：https://open-dev.dingtalk.com/#/index
-
进入应用开发-企业内部开发-点击进入应用-基础信息-获取appKey、appSecret、agentId
4.1.4 启动后配置
① 配置访问地址
启动完成会自动生成临时域名，配置方法：进入开发者后台->进入应用->开发管理->应用首页地址和PC端首页地址
-
生成的域名：
-
配置地址：
② 发布应用
配置好地址后进入“版本管理与发布页面”，发布应用，发布后即可在PC钉钉或移动钉钉工作台访问应用
- 发布应用：
4.2 手动启动（与脚本启动二选一）
4.2.1 下载项目
git clone https://github.com/open-dingtalk/h5app-auth-demo.git4.2.2 配置应用参数
获取到以下参数，修改后端application.properties
app:
app_key: *****
app_secret: *****
agent_id: *****
corp_id: *****参数获取方法：登录开发者后台
-
获取corpId——开发者后台首页：https://open-dev.dingtalk.com/#/index
-
进入应用开发-企业内部开发-点击进入应用-基础信息-获取appKey、appSecret、agentId
4.2.3 修改前端页面
打开项目，命令行中执行以下命令，编译打包生成build文件（如果不修改页面，则可跳过此步骤）
cd frontend
npm install
npm run build将打包好的静态资源文件放入后端（如果不修改页面，则可跳过此步骤）
4.2.4 启动项目
-
启动SpringBoot（运行启动类Application.java）
-
启动内网穿透工具，配置应用访问链接并发布应用（参考上方“脚本启动” -> “启动后配置”）
-
移动端/PC端钉钉点击工作台，找到应用，进入应用体验demo
5. 页面展示
6. 参考文档
- H5应用接入JSAPI，文档链接：https://developers.dingtalk.com/document/app/logon-free-process?spm=ding_open_doc.document.0.0.6dbdad29INJCRg#topic-2025319
- 获取企业内部应用access_token，文档链接：https://developers.dingtalk.com/document/app/obtain-orgapp-token?spm=ding_open_doc.document.0.0.938247e54bE13v#topic-1936350
- 获取用户userId，文档链接：https://developers.dingtalk.com/document/app/obtain-the-userid-of-a-user-by-using-the-log-free?spm=ding_open_doc.document.0.0.5b9077a26qJ9aI#topic-2010561
- 获取用户详情，文档链接：https://developers.dingtalk.com/document/app/query-user-details?spm=ding_open_doc.document.0.0.938247e54bE13v#topic-1960047