1、以机构管理员身份在后台创建应用,记下corpId、appkey、appsecret、agentid等信息,配置好服务器入口信息等。
2、在开发pc上安装rc版钉钉,可以进行调试。
3、搭建开发环境,我选择的是前端js(jquery、bootstrap等)+后端php+数据库mysql。服务器在阿里云上。
4、前端代码:
index.html
<!DOCTYPE html>
<html lang="zh-cn">
<head>
。。。
<script src="js/jquery.3.2.1.min.js"></script>
<script src="js/dingtalk.open.2.7.13.js"></script>
</head>
<body>
<div class='container-fluid'>
<div class="row">
...
</div>
<div id="info"></div>
</div>
<script src="js/bootstrap.min.js"></script>
<script src="js/index.js"></script>
</body>
</html>
index.js
var _config = null;
$(function(){
$.ajaxSetup({ async: false });
$.getJSON("phpFiles/getAuthInfo.php",{"url":location.href},function(rs){
_config=rs;
var jsapilist = [
'device.notification.alert', //警告框
'device.notification.confirm',//确认框
'biz.navigation.setTitle',//设置导航栏标题
'biz.navigation.quit',//关闭页面
'biz.util.openModal',//打开弹窗(模态窗)
'biz.contact.complexPicker'//选择人员
] //需要使用的jsapi列表
//1、鉴权
dd.config({
agentId: "you agentid",
corpId: "your corpid", //必填,企业ID
timeStamp: _config.timestamp, // 必填,生成签名的时间戳
nonceStr: 'abcdefg', // 必填,生成签名的随机串
signature: _config.signature, // 必填,签名
jsApiList: jsapilist // 必填,需要使用的jsapi列表,注意:不要带dd。
});
dd.error(function(err) { //验证失败
console.log("进入到error中");
console.log('dd error: ' + JSON.stringify(err));
})
})
dd.ready(function () {
//2、根据corpId获取授权码AuthCode
dd.runtime.permission.requestAuthCode({
corpId: _config.corpId,
onSuccess: function (result)
{
_config.authCode = result.code; //记下授权码,以备不时之需
//利用api设置导航栏文字
dd.biz.navigation.setTitle({
title: '仓储管理',
onSuccess: function (result) { },
onFail: function (err) { }
});
},
onFail: function (err) {
// alert(JSON.stringify(err))
}
})
})
})
后端代码:
getAuthInfo.php
<?php
//获取构建dd.config所需要的参数
function isvConfig($url)
{
//固定变量
$corpId = "your corpid";
$agentId = "your agentid";
$nonceStr = "abcdefg";
$timeStamp =time();
//获取access_token
$urlToken="https://oapi.dingtalk.com/gettoken?appkey=yourappkey&appsecret=yourappsecret";
$data= https_request($urlToken);
$access_token = json_decode($data, true);
//获取ticket,这里一定要注意:上一步获取的$access_token 是个数组,里面下标为access_token 的元素才真正为access_token 值。我就掉入这个坑了。
$urlTicket="https://oapi.dingtalk.com/get_jsapi_ticket?access_token=".$access_token['access_token'];
$data= https_request($urlTicket);
$ticket=json_decode($data, true);
//生成签名信息,这里一定要注意:上一步获取的$ticket是个数组,里面下标为ticket的元素才真正为ticket值。我就掉入这个坑了。
$signature =sign($ticket['ticket'], $nonceStr, $timeStamp, $url);
//返回结果
return (json_encode(array("corpId"=>$corpId,"agentId"=>$agentId,"nonceStr"=>$nonceStr,"signature"=>$signature,"timestamp"=>$timeStamp,"url"=>$url,"access_token"=>$access_token,"jsapiticket"=>$ticket)));
}
//签名函数
function sign($ticket, $nonceStr, $timeStamp, $url)
{
$plain = 'jsapi_ticket=' . $ticket .'&noncestr=' . $nonceStr .'×tamp=' . $timeStamp .'&url=' . $url;
return sha1($plain);
}
//访问jsapi函数
function https_request($url)
{
$curl=curl_init();
curl_setopt($curl, CURLOPT_URL, $url);
curl_setopt($curl, CURLOPT_SSL_VERIFYPEER, false);
curl_setopt($curl, CURLOPT_SSL_VERIFYHOST, false);
curl_setopt($curl, CURLOPT_RETURNTRANSFER, true);
$result=curl_exec($curl);
curl_close($curl);
return $result;
}
echo (isvConfig($_REQUEST["url"]));
?>
以上步骤即可顺利通过鉴权。鉴权后端代码的过程如下:
(1)根据appkey和appsecret获得access_token;
(2)根据access_token获得jsapi_ticket;
(3)根据jsapi_ticket、noncestr(自定义随机字符串)、timestamp(时间戳)和指定url,利用php中的哈希函数sha1()生成签名值signature。
(4)将corpid、agentid、noncestr、signature、timestamp、url的值以JSON格式返回给前端,用于创建dd.config。