Html5嵌入钉钉的实现示例


Posted in HTML / CSS onJune 04, 2020

1,需要在项目种引入钉钉官方的js

<script type="text/javascript" src="http://g.alicdn.com/dingding/dingtalk-jsapi/2.3.0/dingtalk.open.js" >
</script>

或者npm 也可以的

2,钉钉自带的api,有写是需要鉴权的,所以在使用之前一定要先鉴权

获取钉钉接口的鉴权

dd.config({
              agentId:agentid, // 必填,微应用ID
              corpId:corpId,//必填,企业ID
              timeStamp:timeStamp, // 必填,生成签名的时间戳
              nonceStr: nonceStr, // 必填,生成签名的随机串
              signature:signature, // 必填,签名
              type:0,
              jsApiList : [ 'runtime.info', 'biz.contact.choose','biz.contact.chooseMobileContacts',
                'device.notification.confirm', 'device.notification.alert',
                'device.notification.prompt', 'biz.ding.post','biz.util.previewImage',
                'biz.util.openLink','device.geolocation.start','device.geolocation.get','biz.util.uploadImageFromCamera','biz.util.uploadImage' ,
                'device.audio.startRecord','device.audio.stopRecord','device.audio.play','device.audio.pause','device.audio.download','device.audio.translateVoice','device.audio.onPlayEnd'
                ] // 必填,需要使用的jsapi列表,注意:不要带dd。
            });

3,鉴权以后就可以在项目中使用钉钉的api了,但是在调用钉钉的api的时候一定要在 dd.ready里面执行,不然会报错

dd.ready(()=>{
      //获取地理位置
              dd.device.geolocation.get({
      targetAccuracy : Number,
      coordinate : Number,
      withReGeocode : Boolean,
      useCache:true, //默认是true,如果需要频繁获取地理位置,请设置false
       onSuccess : (result) =>{
        alert('succe: ' + JSON.stringify(result))
                   
       },
      onFail : (err) => {
       alert('fail: ' + JSON.stringify(err))
       }
      })
 })

ps:如果是全局使用钉钉的api,可以在app.vue页面种调用,也可以在main.js种调用

到此这篇关于Html5嵌入钉钉的实现示例的文章就介绍到这了,更多相关Html5嵌入钉钉内容请搜索三水点靠木以前的文章或继续浏览下面的相关文章,希望大家以后多多支持三水点靠木!

HTML / CSS 相关文章推荐
css3 iphone玻璃透明气泡完美实现
Mar 20 HTML / CSS
CSS3实现缺角矩形,折角矩形以及缺角边框
Dec 20 HTML / CSS
css3利用transform变形结合事件完成扇形导航
Oct 26 HTML / CSS
CSS 说明横向进度条最后显示文字的实现代码
Nov 10 HTML / CSS
canvas实现图片马赛克的示例代码
Mar 26 HTML / CSS
html5使用canvas绘制太阳系效果
Dec 15 HTML / CSS
详解Html5页面实现下载文件(apk、txt等)的三种方式
Oct 22 HTML / CSS
VSCode 自定义html5模板的实现
Dec 05 HTML / CSS
AmazeUI 模态窗口的实现代码
Aug 18 HTML / CSS
CSS 新特性 contain控制页面的重绘与重排问题
Apr 30 HTML / CSS
CSS中float高度塌陷问题的四种解决方案
Apr 18 HTML / CSS
Li list-style-image 图片垂直居中实现方法
May 21 HTML / CSS
浅析数据存储的三种方式 cookie sessionstorage localstorage 的异同
Jun 04 #HTML / CSS
h5页面唤起app如果没安装就跳转下载(iOS和Android)
Jun 03 #HTML / CSS
html5视频自动横过来自适应页面且点击播放功能的实现
Jun 03 #HTML / CSS
使用Html5 Stream开发实时监控系统
Jun 02 #HTML / CSS
Html5 canvas画图白板踩坑
Jun 01 #HTML / CSS
HTML5页面嵌入小程序没有返回按钮及返回页面空白的问题
May 28 #HTML / CSS
HTML5实现直播间评论滚动效果的代码
May 27 #HTML / CSS
You might like
POSIX 风格和兼容 Perl 风格两种正则表达式主要函数的类比(preg_match, preg_replace, ereg, ereg_replace)
2010/10/12 PHP
PHP-CGI进程CPU 100% 与 file_get_contents 函数的关系分析
2011/08/15 PHP
老生常谈PHP 文件写入和读取(必看篇)
2017/05/22 PHP
PHP给源代码加密的几种方法汇总(推荐)
2018/02/06 PHP
PHP中类与对象功能、用法实例解读
2020/03/27 PHP
详解PHP中的8个魔术常量
2020/07/06 PHP
js 复制或插入Html的实现方法小结
2010/05/19 Javascript
NodeJS的模块写法入门(实例代码)
2012/03/07 NodeJs
jQuery学习笔记之jQuery.fn.init()的参数分析
2014/06/09 Javascript
AngularJS中一般函数参数传递用法分析
2016/11/22 Javascript
js实现日历的简单算法
2017/01/24 Javascript
jquery实现下拉框左右选择功能
2017/02/21 Javascript
IScroll5实现下拉刷新上拉加载的功能实例
2017/08/11 Javascript
BootStrap Table实现server分页序号连续显示功能(当前页从上一页的结束序号开始)
2017/09/12 Javascript
浅谈Angular2 模块懒加载的方法
2017/10/04 Javascript
Vue-cli-webpack搭建斗鱼直播步骤详解
2017/11/17 Javascript
vue实现select下拉显示隐藏功能
2019/09/30 Javascript
react-native聊天室|RN版聊天App仿微信实例|RN仿微信界面
2019/11/12 Javascript
jQuery实现可编辑的表格
2019/12/11 jQuery
vue实现五子棋游戏
2020/05/28 Javascript
Python设计模式之单例模式实例
2014/04/26 Python
python递归计算N!的方法
2015/05/05 Python
Python搭建FTP服务器的方法示例
2018/01/19 Python
使用PyCharm进行远程开发和调试的实现
2019/11/04 Python
python base64库给用户名或密码加密的流程
2020/01/02 Python
Python环境管理virtualenv&amp;virtualenvwrapper的配置详解
2020/07/01 Python
Soft Cotton捷克:来自爱琴海棉花的浴袍
2017/02/01 全球购物
嘻哈珠宝品牌:KRKC&CO
2020/10/19 全球购物
俄罗斯奢侈品牌衣服、鞋子和配饰的在线商店:INTERMODA
2020/07/17 全球购物
物流司机岗位职责
2013/12/28 职场文书
九年级化学教学反思
2014/01/28 职场文书
2014群众路线学习笔记
2014/11/06 职场文书
幽默口才训练经典句子(48句)
2019/08/19 职场文书
新手初学Java网络编程
2021/07/07 Java/Android
Vue ECharts实现机舱座位选择展示功能
2022/05/15 Vue.js
蓝牙耳机怎么连接电脑win11? Win11蓝牙耳机连接电脑的技巧
2023/01/09 数码科技