简介

最近开发的一个项目需要对接钉钉的生态，做了小程序和微应用，还开发了定制工作台。于是就想写篇文章记录下踩的坑。

首先从搜索引擎搜索“钉钉开放平台”，这里可以获取官方的文档和编辑器，对后续的开发有很大帮助。

开发小程序和工作台插件，建议使用官方的小程序开发工具，在里面关联账号后能直接上传发布。

贴几个地址：

官方文档

在线API调试工具

IDE与脚手架

应用场景

钉钉的应用场景非常广泛，这里就只介绍我实际开发过的三种。

首先小程序和H5微应用创建成功后，都有自己的appkey和appsecret。这两个东西在请求钉钉接口的时候会用到。

小程序

可以参考官方文档来创建一个钉钉小程序。

如果使用官方的IDE开发，在后台注册完小程序后，用对应的账号登录IDE，就可以在关联应用那里关联小程序了。在IDE点击上传后，可以在开发者后台选择发布。这时候应用已经发布到钉钉中了，可以在工作台-我的-全部-未分组应用里找到。

当然，只有企业内部应用可以不经审核发布，如果是第三方应用需要经过审核。

使用第三方组件

小程序初始化的目录里没有packge.json，但是又想通过npm装其他组件该怎么办呢？

先在小程序根目录初始化：

npm init --yes
复制代码

再用npm安装组件就好了。

使用时别忘了在对应页面的json文件中加入

"usingComponents": {
    "组件名": "组件地址"
  }
复制代码

纯前端获取用户信息

真的很麻烦，首先要在后台打开小程序的通讯录权限，然后步骤大概是这样的。

1.获取免登码
2.获取access_token(需要小程序的key和secret)
3.用免登码和access_token获取userid
4.用access_tokentoken和userid获取用户详细信息
复制代码

1.获取免登码

 const code = await dd.getAuthCode({})
复制代码

2.获取access_token(需要小程序的key和secret)

const res1 = await dd.httpRequest({url:"https://oapi.dingtalk.com/gettoken?appkey=aaa&appsecret=xxx"})
复制代码

3.用免登码和access_token获取userid

const res2 = await dd.httpRequest({url:`https://oapi.dingtalk.com/user/getuserinfo?access_token=${res1.data.access_token}&code=${code.authCode}`})
复制代码

4.用access_tokentoken和userid获取用户详细信息

const res3 = await dd.httpRequest({url:`https://oapi.dingtalk.com/topapi/v2/user/get?access_token=${res1.data.access_token}`,method:'POST',data:{userid:res2.data.userid}})
复制代码

工作台插件

要想开发这玩意需要企业申请服务商资质。申请完了后，开发者后台的导航栏会多一个定制服务的按钮，点击后在跳转的页面选择工作台-插件管理，创建一个插件。

然后使用官方的小程序开发者工具，创建一个小程序插件，并选择关联应用。就可以用小程序的语法开发插件了。

步骤的详情可以参考官方文档，包括了开发完成后如何上传，上传发布后如何调试等。

一些注意事项可以参考这篇博客

跳转其他页面

文档里说这个链接最好是微应用链接，但实际上第三方链接也行，只要在钉钉的环境打开。不过模拟器调试不会跳转，需要上传后在自定义工作台扫码调试。

 getSdk().openApp({
   url: '应用链接',
});
复制代码

前后端通信

首先需要在后台配置数据源，选择定制服务-工作台-数据源管理。然后参考创建数据源配置。

然后在插件的config.js中，注册配置好的数据源。

"dataSources": [{
        "apiKey": "myApiKey",
        "propName": "getData1"
    },{
      "apiKey": "myApiKeyLogin",
      "propName": "getData2"
}],
复制代码

之后便能通过sdk的方法调用数据源接口了

getSdk().request(this.props.componentProps.getData2,{
        //参数
      },{
        //这些要与注册的数据源相匹配
        url:'xxx',
        apiKey:'myApiKeyLogin',
        httpMethod:'POST',
        params:'参数列表',
        apiSecret:'mytoken',
        system:{//这里是mock的数据，本地调试会传这个给后端，线上则传使用用户的userid和对应企业的corpId
          userid:'xxxx',
          corpId:'xxxx'
        }
      })
复制代码

工作台插件会直接通过钉钉网关获取到corpId和userid，也就是说，只要你正确配置了数据源，在进行前后端通信时，url就会带上这两个参数。

获取用户信息

调用接口的时候会自动传入corpId和userid，可以参考小程序和H5获取用户信息的方法，利用同一个企业下的小程序或h5实现获取用户信息（免登）的操作。

使用缓存

打印一下getSdk会发现几个自带的方法

_setStorageItem: ƒ U(e,t,r)
复制代码

_getStorageItem: ƒ z(e,t)
复制代码

这名字一看就是localStorage嘛

调用示例：

namespace可以写成公司的名称

getSdk()._setStorageItem('namespace','token',token)
复制代码

getSdk()._getStorageItem('namespace','token')
复制代码

该缓存可以应用到跳转的外部链接。

H5微应用

参考官方文档来创建一个微应用

你完全可以按照开发web应用的方式去开发一个h5微应用，只需要在后台配置好服务器的出口IP、首页地址、权限等。与小程序相似，发布后会可以在我的-全部-未分组应用里看到。

JSAPI

使用钉钉的API之前要安装JSAPI包。在钉钉环境内才可以调用，普通的浏览器环境会报错。

npm install dingtalk-jsapi --save
复制代码

import * as dd from 'dingtalk-jsapi'
复制代码

获取用户信息

步骤和小程序是类似的，但是H5无法直接调钉钉的接口，所以前端只能做到步骤1，不过可以通过钉钉提供的服务端在线API完成剩下步骤。

大概步骤是这样的：

1.获取免登码（需要企业的corpId）
2.获取access_token（需要h5的key和secret）
3.获取userid（需要access_token和免登码）
4.获取userInfo（需要userid）
复制代码

1.获取免登码（需要企业的corpId）

const getCode = (callSucc, callFail) => {
  const corpid = 'xxx'
  dd.runtime.permission.requestAuthCode({
    corpId: corpid,
    onSuccess: function(res) {
      // 调用成功时回调
      callSucc(res)
    },
    onFail: function(err) {
      // 调用失败时回调
      callFail(err)
    }
  })
getCode(succgetCode,failgetCode)
const succgetCode = (code)=>{
    console.log(code)
}
const failgetCode = (err)=>{
    console.log(err)
}
复制代码

剩下的步骤可以通过API Explorer来完成，不过要注意，对应的h5微应用也要开放权限。

打开小程序

dd.biz.microApp.openApp({
    agentId: "123",//在小程序的基础信息里可以找到
    appId: "miniAppId",//在小程序的基础信息里可以找到
    corpId: "dingxxxx",//后台首页右上方自己的信息里可以找到
});
复制代码