h5应用 vue 钉钉_快速上手——钉钉H5微应用开发接入

创建钉钉H5应用

顾名思义，钉钉H5应用，和微信WEB应用一样，本质都是一个有前端有后端的网站，由平台本身对网站基础功能进行扩充，提供专用接口满足开发者各式各样的和平台相关的需求。 开发者平台：https://open-dev.dingtalk.com/ 先决条件：公司管理员和子管理员权限 创建应用的流程很简单，开发者平台里新建一个应用，再为应用配置域名、IP白名单、接口权限等信息即可。

关于免登

免登的关键在于如何识别用户，微信网页也好，微信小程序也好，钉钉也好，都开放了获取用户信息的接口，在这基础上做免登的流程是：向平台获取用户信息 -> 为用户登录。 微信网页获取用户信息的流程是：用户同意授权(scope=snsapi_userinfo时) -> 获取code -> 通过code换取网页授权access_token -> 拉取用户信息。在获取code时，本质是由微信客户端刷新页面，并在URL中添加CODE参数；此外，获取access_token时，scope参数如果是snsapi_base，可以进行无感知获取用户openid，所以只有当需要获取详细信息时，才会用scope=snsapi_userinfo来显示请求授权，其它场景中(不需要获取用户信息，或已经获取了对应openid的用户信息)只要使用snsapi_base即可。(官方文档地址：https://developers.weixin.qq.com/doc/offiaccount/OA_Web_Apps/Wechat_webpage_authorization.html) 钉钉流程与之类似，区别如下：

• 微信通过URL传递code，钉钉通过JSAPI的dd.runtime.permission.requestAuthCode接口获取code；

• 不需要用户授权(真正意义上的无感知)；

• 直接获取用户信息而不需要scope字段。

此外，因为平台性质的差异，钉钉的用户字段包含了丰富的真实个人信息。 签名校验

微信的wx.config参数配置，和钉钉H5的dd.config参数配置，不管是校验流程、签名参数的参数名和，还是校验算法都完全一样。

在整个过程中(包括其它开发步骤里)，有一个非常重要的原则需要格外留意：敏感参数绝对不能出现在前端(比如jsapi_ticket、access_token)。

流程如下：

• 获取access_token

• 获取jsapi_ticket

• 计算签名(微信和钉钉均为jsapi_ticket, nonceStr, timeStamp, url)

• 将生成签名的参数nonceStr，timeStamp, url和最终生成的签名Signature传到前端，供config接口配置和注册权限；除了这几个参数，dd.config还需要用到agentId(即应用ID)、corpId(即公司ID)，wx.config需要用到appId，本质上都是用来标识一个应用。

TOKEN的维护

钉钉的Token有一个服务端缓存刷新机制，只要在失效前请求接口，access_token的过期时间会恢复为7200秒，借由这个机制，可以在后台跑一个定时任务，隔一段时间请求一下，就可以保证当前access_token一直有效。

开发、部署流程(与微信WEB应用一样)：

• 开发阶段

  • 可以用自己熟悉的环境、熟悉的框架按普通的WEB开发过程进行前后端开发；

  • 在需要使用功能的前端页面引入核心JS-SDK；

  • 通过dd.config接口注入权限验证配置；

  • 调用钉钉JSAPI接