DingTalk「开发者说」第8期 钉钉微应用开发实战

分享人：悦铭，钉钉H5微应用前端开发链路负责人

视频地址：一键回看

目录：

一、初识钉钉H5微应用

二、H5微应用原理解析

三、钉钉JSAPI使用与鉴权

四、H5微应用开发

五、H5的性能优化建议

六、H5开发实战

七、Q&A

正文：

一、初识钉钉H5微应用

顾名思义，钉钉H5微应用是指用H5方式开发的钉钉应用。

1. 钉钉H5微应用的开发步骤

a. 开发一个H5页面，页面内（前端、服务端）接入钉钉开放平台的开放能力（如免登、扫一扫、通讯录等）；

b. 在钉钉开放平台上创建一个应用，将H5页面地址配置成应用的链接；

c. 在钉钉开放平台上发布应用；

d. 发布后，用户就能在钉钉平台内（如钉钉工作台、钉钉应用广场上）看到这个应用并使用（点击打开、购买）。

发布在钉钉工作台的H5微应用示例

2. 钉钉H5微应用的类型

钉钉H5微应用主要有两种类型：企业内部应用和第三方企业应用。

应用类型	开发者	使用人员	是否支持上架到钉钉应用广场
企业内部应用	企业内部开发者或委托的服务商开发者	安装了该应用的企业内部人员	否
第三方企业应用	产品方案商的开发者	购买开通该三方应用的企业内部人员	是，需要满足上架要求，上架流程请参考《钉钉开发平台-第三方企业应用开放-运营规范-产品方案商-合作全流程指引》

  

企业内部应用示例  第三方企业应用示例

二、钉钉H5微应用原理解析

在钉钉容器中访问H5微应用的核心时序：

1. 用户通过钉钉客户端点击钉钉微应用；

2. 钉钉客户端拿到页面的HTML后，向微应用服务端发起请求；

3. 微应用服务端返回页面模板并加载前端脚本JavaScript；

4. 微应用前端在JavaScript中向钉钉客户端请求免登授权码；

5. 客户端在进行身份校验并通过后返回授权码Code，微应用前端根据授权码向微应用服务端请求用户信息以及页面数据；

6. 微应用服务端需要根据请求获取Access Token，即用户和企业的身份认证信息，微应用服务端进行身份校验并通过后返回Access Token；

7. 然后微应用服务端根据免登授权码Code以及验证信息Access Token向钉钉服务端请求用户信息，钉钉服务端对Code和Access Token进行校验，通过后返回用户信息给微应用服务端；

8. 微应用服务端对用户信息进行校验，通过后返回微应用数