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中的opacity属性使用教程
Aug 19 HTML / CSS
CSS3中使用RGBa来调节透明度的教程
May 09 HTML / CSS
CSS3 filter(滤镜)实现网页灰色或者黑色模式的代码
Nov 30 HTML / CSS
HTML5新增的标签和属性归纳总结
May 02 HTML / CSS
html5的canvas元素使用方法介绍(画矩形、画折线、圆形)
Apr 14 HTML / CSS
使用canvas绘制贝塞尔曲线
Dec 17 HTML / CSS
HTML5实现获取地理位置信息并定位功能
Apr 25 HTML / CSS
HTML5对比HTML4的主要改变和改进总结
May 27 HTML / CSS
五分钟学会HTML5的WebSocket协议
Nov 22 HTML / CSS
使用canvas实现雪花飘动效果的示例代码
Mar 30 HTML / CSS
CSS3 实现NES游戏机的示例代码
Apr 21 HTML / CSS
html网页引入svg图片的4种方式
Aug 05 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
ThinkPHP3.1的Widget新用法
2014/06/19 PHP
php导出生成word的方法
2015/12/25 PHP
PHP实现的构造sql语句类实例
2016/02/03 PHP
浅析PHP反序列化中过滤函数使用不当导致的对象注入问题
2020/02/15 PHP
(jQuery,mootools,dojo)使用适合自己的编程别名命名
2010/09/14 Javascript
javascript 运算数的求值顺序
2011/08/23 Javascript
ASP.NET jQuery 实例2 (表单中使用回车在TextBox之间向下移动)
2012/01/13 Javascript
javascript中call和apply方法浅谈
2013/09/27 Javascript
Javasipt:操作radio标签详解
2013/12/30 Javascript
简单的邮箱登陆的提示效果类似于yahoo邮箱
2014/02/26 Javascript
原生js实现类似弹窗抖动效果
2015/04/02 Javascript
js实现类似新浪微博首页内容渐显效果的方法
2015/04/10 Javascript
13个PHP函数超实用
2015/10/21 Javascript
JavaScript对象参数的引用传递
2016/01/14 Javascript
使用bootstrap3开发响应式网站
2016/05/12 Javascript
谈谈对JavaScript原生拖放的深入理解
2016/09/20 Javascript
Node.js开启Https的实践详解
2016/10/25 Javascript
input获取焦点时底部菜单被顶上来问题的解决办法
2017/01/24 Javascript
JS完成画圆圈的小球
2017/03/07 Javascript
vue 实现数字滚动增加效果的实例代码
2018/07/06 Javascript
微信小程序动画(Animation)的实现及执行步骤
2018/10/28 Javascript
JavaScript中判断为整数的多种方式及保留两位小数的方法
2019/09/09 Javascript
[01:14:55]EG vs Spirit Supermajor 败者组 BO3 第三场 6.4
2018/06/05 DOTA
Python的Flask框架与数据库连接的教程
2015/04/20 Python
python输出指定月份日历的方法
2015/04/23 Python
python 定时修改数据库的示例代码
2018/04/08 Python
python实现生成字符串大小写字母和数字的各种组合
2019/01/01 Python
浅析Python 条件控制语句
2020/07/15 Python
Python环境使用OpenCV检测人脸实现教程
2020/10/19 Python
深入浅析css3 中display box使用方法
2015/11/25 HTML / CSS
英国花园、DIY、电器和家居用品商店:Robert Dyas
2019/03/18 全球购物
三八妇女节活动总结
2014/05/04 职场文书
村主任“四风”问题个人对照检查材料思想汇报
2014/10/02 职场文书
银行求职信范文怎么写
2015/03/20 职场文书
Redis6.0搭建集群Redis-cluster的方法
2021/05/08 Redis
Go语言的协程上下文的几个方法和用法
2022/04/11 Golang