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自定义滚动条样式写法
Dec 25 HTML / CSS
HTML+CSS3模拟心的跳动实例代码
Sep 05 HTML / CSS
HTML5中canvas中的beginPath()和closePath()的重要性
Aug 24 HTML / CSS
HTML5实现的震撼3D焦点图动画的示例代码
Sep 26 HTML / CSS
HTML5资源预加载(Link prefetch)详细介绍(给你的网页加速)
May 07 HTML / CSS
用HTML5 实现橡皮擦的涂抹效果的教程
May 11 HTML / CSS
详解HTML5中的元素与元素
Aug 17 HTML / CSS
使用HTML5的Canvas绘制曲线的简单方法
Sep 08 HTML / CSS
探索HTML5本地存储功能运用技巧
Mar 02 HTML / CSS
手机端用rem+scss做适配的详解
Nov 15 HTML / CSS
详解快速开发基于 HTML5 网络拓扑图应用
Jan 08 HTML / CSS
amaze ui 的使用详细教程
Aug 19 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
PHP中对于浮点型的数据需要用不同的方法解决
2014/03/11 PHP
PHP中Session可能会引起并发问题
2015/06/26 PHP
PHP编程获取各个时间段具体时间的方法
2017/05/26 PHP
js jquery获取随机生成id的服务器控件的三种方法
2013/07/11 Javascript
extjs render 用法介绍
2013/09/11 Javascript
JS判断表单输入是否为空(示例代码)
2013/12/23 Javascript
parentElement,srcElement的使用小结
2014/01/13 Javascript
js检测网络是否具体连接功能的代码
2014/05/23 Javascript
transport.js和jquery冲突问题的解决方法
2015/02/10 Javascript
js实现按钮控制图片360度翻转特效的方法
2015/02/17 Javascript
判断访客终端类型集锦
2015/06/05 Javascript
详解JavaScript中setSeconds()方法的使用
2015/06/11 Javascript
第三章之Bootstrap 表格与按钮功能
2016/04/25 Javascript
老司机带你解读jQuery插件开发流程
2016/05/16 Javascript
深入理解angularjs过滤器
2016/05/25 Javascript
javascript运算符——逻辑运算符全面解析
2016/06/27 Javascript
json格式的javascript对象用法分析
2016/07/04 Javascript
最原始的jQuery注册验证方式
2016/10/11 Javascript
详解ECMAScript6入门--Class对象
2017/04/27 Javascript
JavaScript面向对象精要(上部)
2017/09/12 Javascript
JavaScript时间戳与时间日期间相互转换
2017/12/11 Javascript
基于node打包可执行文件工具_Pkg使用心得分享
2018/01/24 Javascript
angular 实现同步验证器跨字段验证的方法
2019/04/11 Javascript
Python按行读取文件的简单实现方法
2016/06/22 Python
python 通过xml获取测试节点和属性的实例
2018/03/31 Python
Python Pexpect库的简单使用方法
2019/01/29 Python
python des,aes,rsa加解密的实现
2021/01/16 Python
飞利浦西班牙官方网站:Philips西班牙
2020/02/17 全球购物
5.1手机促销活动
2014/01/17 职场文书
公务员中国梦演讲稿
2014/08/19 职场文书
邓小平理论心得体会
2014/09/09 职场文书
党支部审查意见
2015/06/02 职场文书
唐山大地震观后感
2015/06/05 职场文书
让子弹飞观后感
2015/06/11 职场文书
幼儿园家长心得体会
2016/01/21 职场文书
python 实现定时任务的四种方式
2021/04/01 Python