钉钉企业内部H5微应用开发
企业内部H5微应用开发 分为 服务端API和前端API的开发,主要涉及到进入应用免登流程和JSAPI鉴权。
JSAPI鉴权开发步骤:
1、创建H5微应用
登入钉钉开放平台(https://open-dev.dingtalk.com/#/index),进入“应用开发”->企业内部开发H5微应用->创建应用,并填写基本信息和配置开发信息
2、JSAPI鉴权服务端API的开发:
(1)通过appKey 和 appSecret 获取调用接口凭证AccessToken(https://oapi.dingtalk.com/gettoken?appkey=appKey&appsecret=appSecret)
(2)通过AccessToken 获取用于JSAPI的临时票据Ticket(https://oapi.dingtalk.com/get_jsapi_ticket?access_token=ACCESS_TOKEN)
(3)ticket(JSAPI的临时票据),nonceStr(随机串),timeStamp(时间戳),url(当前网页的URL,不包含#及其后面部分)计算签名信息
计算签名参数
/**ticket(JSAPI的临时票据),nonceStr(随机串),timeStamp(时间戳),url(当前网页的URL,不包含#及其后面部分)计算签名信息* */public static function sign($ticket, $nonceStr, $timeStamp, $url){$plain = 'jsapi_ticket=' . $ticket .'&noncestr=' . $nonceStr .'×tamp=' . $timeStamp .'&url=' . $url;return sha1($plain);}
(4)通过AccessToken 获取用于JSAPI的临时票据Ticket(说明:由于会牵涉到多个企业,企业的appKey 和 appSecret的一些信息都是写在JSON配置文件中,前端传企业ID到服务端,服务端就会从JSON配置文件中获取企业信息)
/** 根据企业ID corpid 返回 JSAPI 鉴权配置信息* */public static function getConfig($corpid){$_config = self::getApiConfig($corpid);$appkey = $_config["AppKey"];$appsecret = $_config["AppSecret"];$agentid = $_config["AgentId"];$nonceStr = 'flywong';$timeStamp = time();//$url = self::getCurrentUrl();$url = $_config["AppUrl"];$accessToken = self::getAccessToken($appkey,$appsecret);$ticket = self::getTicket($accessToken);$signature = self::sign($ticket, $nonceStr, $timeStamp, $url);$config = array('agentId' => $agentid,'corpId' => $corpid,'timeStamp' => $timeStamp,'nonceStr' => $nonceStr,'signature' => $signature,'url' => $url,'type'=>0);return json_encode($config, JSON_UNESCAPED_SLASHES);}
/** 根据企业ID corpid 从api_config.json配置文件中找到 企业对应的信息,并返回企业应用开发信息* */public static function getApiConfig($corpid){$json_string = file_get_contents(__DIR__ .'/../api_config.json'); //从文件中读取数据到PHP变量$arrs = json_decode($json_string, true); foreach($arrs as $key => $value){if($value["CorpId"] == $corpid){return $value;}}}
企业的配置文件api_config.json
3、JSAPI鉴权前端API的开发:
前端发送GET请求获取服务端的JSAPI 鉴权配置信息
// 异步获取dd.config async getDDConfig({commit, state},callback) {// 发送异步ajax请求const result = await reqDDConfig(state.CorpId)// 提交一个mutationconst ddconfig = resultddconfig.jsApiList= state.jsApiList
dd.config(ddconfig); commit(RECEIVE_DDCONFIG, {ddconfig}) // 数据更新了, 通知一下组件 callback && callback() }
let that = this;//获取 JSAPI 鉴权配置信息that.$store.dispatch('getDDConfig', () => {// that.$nextTick(() => {// 数据ddconfig state 更新后执行that.$store.dispatch('getUserinfo')//获取登入用户信息that.$store.dispatch('getGeolocation')//获取地图定位信息 })})
/* 状态管理*/ export default {CorpId:'dingb0bd5c5a3ba53e1231232378f',//企业IDddconfig:{},//钉钉签权配置信息 jsApiList:['runtime.info','biz.contact.choose','device.notification.confirm','device.notification.alert','device.notification.prompt','biz.ding.post','biz.util.openLink','device.geolocation.get','biz.util.scanCard'],//需要签权的JSAPIuserinfo:{}, //用户信息geolocation:{} //地图定位信息 }
4、H5微应用的免登
“免登”是指用户进入应用后,无需输入钉钉用户名和密码,应用程序可自动获取当前用户身份,进而登录系统的流程。
1、前端去获取微应用免登授权码,然后把授权码发送到服务端api得到当前用户信息
// 异步获取userinfo getUserinfo({commit, state}) {dd.runtime.permission.requestAuthCode({corpId: state.CorpId, // 企业idonSuccess: async function (info) {let code = info.code // 通过该免登授权码可以获取用户身份// 发送异步ajax请求const result = await reqUserinfo(code,state.CorpId)// 提交一个mutationconst userinfo = resultcommit(RECEIVE_USERINFO, {userinfo})}})}
2、服务端API获取用户信息
/** 通过免登授权码code和access_token获取用户的userid* */public static function getUserInfo($accessToken, $code){$response = \util\Http::get("/user/getuserinfo",array("access_token" => $accessToken, "code" => $code));$userinfo = json_decode(json_encode($response),true);$userid = $userinfo["userid"];return self::getuser($accessToken,$userid);}/** 通过access_token 和 userid 获取用户详情* */private static function getuser($accessToken,$userid){$response = \util\Http::get("/user/get",array("access_token" => $accessToken, "userid" => $userid));return json_encode($response);}
提醒:钉钉的信息获取必须在钉钉应用环境中运行。(我是在电脑上安装安卓模拟器然后安装钉钉APP进行调试的)
转载于:https://www.cnblogs.com/flywong/p/10862933.html
钉钉企业内部H5微应用开发相关推荐
- h5应用 vue 钉钉_钉钉企业内部H5微应用开发
企业内部H5微应用开发 分为 服务端API和前端API的开发,主要涉及到进入应用免登流程和JSAPI鉴权. JSAPI鉴权开发步骤: 1.创建H5微应用 登入钉钉开放平台(https://open-d ...
- vue项目对接钉钉企业内部H5微应用
最近公司项目又需要接入钉钉啦
- 钉钉通知-调用钉钉发送企业内部消息开发
首先,我们要明确需求:自己的系统需要发送通知消息到用户,接收消息用户为同一企业内的人员,选用短信可能涉及到费用问题,故可以选用钉钉或者企业微信,在此我使用钉钉进行发送消息. 调用钉钉发送企业内部消息: ...
- 钉钉H5微应用开发免登以及接口调试
钉钉H5微应用开发以及接口调试 企业内部应用免登 https://open.dingtalk.com/document/orgapp-server/enterprise-internal-applic ...
- 浙里办H5微应用开发流程
一.代码开发 1. 源代码准备: 由于源代码需要能够部署到政务中台,即要支持npm run build构建源码.(解释:把源代码上传政务中台后,它会后台自动编译构建项目并取build文件夹下的产物 ...
- 如何在钉钉上开发自己的应用_快速上手——钉钉H5微应用开发接入
创建钉钉H5应用 顾名思义,钉钉H5应用,和微信WEB应用一样,本质都是一个有前端有后端的网站,由平台本身对网站基础功能进行扩充,提供专用接口满足开发者各式各样的和平台相关的需求.开发者平台:http ...
- 浙政钉h5微应用开发vue
浙政钉h5开发简单总结 1.在页面引入专有钉钉 JSAPI npm install --save gdt-jsapi import dd from 'gdt-jsapi'; /在使用页面导入 Vue. ...
- 使用钉钉创建企业内部机器人
目录 玩转钉钉机器人 创建钉钉机器人: 如何创建钉钉机器人 如何调用机器人api 支持的消息格式 text类型 markdown类型 整体跳转actionCard类型 feedCard类型 使用钉钉机 ...
- 记录:实现钉钉(企业内部应用)登录第三方网站
由于后台无法配合前端配置路由为history模式,故vue路由采用hash模式.但是钉钉扫码成功后会导致重定向地址格式错误: 错误格式:https://xxx.com/?authCode=xxxx#/ ...
- 钉钉企业内部H5应用IOS点击下载pdf附件后乱码问题
IOS点击下载pdf附件按钮后会出现如下问题,安卓会跳转到浏览器页面下载pdf文件不会出现乱码问题 前端的下载操作按钮 ExportPDF(){postAction(this.exportPdfUrl ...
最新文章
- Java程序员的日常—— 《编程思想》关于类的使用常识
- ubuntu 终端批量复制文件_《卡死你3000》批量文件复制命令详解
- 2018刑侦推理 java_2018年刑侦科目推理试题
- 6-1 数组元素的区间删除
- php定时红包,PHP随机红包和等额红包的简单实现
- Android开发 ---多线程操作:Handler对象,消息队列,异步任务下载
- 在Kotlin中使用libGDX
- 【计算机网络复习 数据链路层】3.5.4 CSMA-CD协议
- 不要低估AI面临的困境
- 飞鸽传书系统上开发是一件多么惬意的事情
- readfile读取串口数据_谈一谈使用字体库加密数据仿58同城
- ormlite更改数据库默认位置
- Datadog Agent是啥?它消耗什么资源?
- 独家专访@爱可可-爱生活:如何做好科学研究(干货满满)
- 转:不同的行业和工作的真实情况是怎样的?
- java界面跳转代码_java软件里面的跳转页面代码实现
- JZOJ7月18日提高组T1 Family
- rap韵脚大全(包含各种诗词歌曲的韵脚等)
- GB与CE标准对照表-转载
- 谷歌邮箱lmap服务器填什么_Gmail IMAP的应用技巧
热门文章
- TableViewCell分割线消失的问题
- line-height学习与总结
- Android layoutInflate.inflate 方法具体解释,removeView()错误解决
- 支持ipv6类型的ddos测试工具thc-ipv6
- 防火墙配置十大任务之五,有NAT的两个接口的配置
- mysql left join 耗时_性能调优:mysql之left join
- netlink 0010 -- Generic Netlink 实现通信
- 如何利用systrace分析Android App的死锁问题
- 深入解读Linux进程调度系列(1)——调度的初始化
- Win10环境下使用VS2015编译PJProject