关于钉钉开发，心得

最近草草做了些项目，关于地图、定位、嵌到钉钉APP里

地图嵌的是高德地图，查找附近公司之类的是用的高德接口，后端返回数据

高德的定位在钉钉里不知为啥没起到作用，而且发现高德的定位有时候有些许偏差

这里用的是钉钉的定位

钉钉有的功能需要鉴权，有的不需要

定位功能需要鉴权

先过一遍config

 1 //初始化钉钉鉴权
 2     initDdConfig () {
 3         //此处取当前url  上线后需更换  不能带#号
 4         let data = {
 5           "url": `${this.api.curUrl}`
 6         }
 7         //访问后端接口   调取钉钉config参数
 8         this.$http(`${this.api.getJSSDK}` + JSON.stringify(data)).then(res => {
 9           //过一遍config
10           this.dd.config({
11                   agentId : res.data.resultdata.appid,
12                   corpId : res.data.resultdata.corpid,
13                   timeStamp : res.data.resultdata.timestamp,
14                   nonceStr : res.data.resultdata.noncestr,
15                   signature : res.data.resultdata.signature,
16                   jsApiList : [ 'runtime.info', 'biz.contact.choose',
17                       'device.notification.confirm', 'device.notification.alert',
18                       'device.notification.prompt', 'biz.ding.post','device.geolocation.get',
19                       'biz.util.openLink' ]
20                 })
21           //正确走完config进ready
22           dd.ready(() => {
23             this.getLocation()
24           })
25           //否则进error
26           dd.error(function(error){
27             this.$ui.MessageBox.alert(JSON.stringify(error), {}) 
28           }) 
29         }).catch(e =>{
30           this.$ui.MessageBox.alert(e.data.msg, {})
31         })   
32     }

然后在ready里进行钉钉定位

 1   //获取当前位置
 2     getLocation (fn) {
 3       this.dd.device.geolocation.get({
 4                targetAccuracy : 200,
 5                coordinate : 1,
 6                withReGeocode : true,
 7                useCache:true, //默认是true，如果需要频繁获取地理位置，请设置false
 8                onSuccess : (result) => {
 9                   this.CurrentCoordinate[0] = result.longitude
10                   this.CurrentCoordinate[1] = result.latitude
11                   this.CurrentLocation = result.road
12                   this.getMap()
13                   fn && fn()
14                },
15                onFail : (err) => {
16                 this.$ui.MessageBox.alert(err.data.msg, {})
17                }
18            })
19     },

getMap方法是根据钉钉定位的当前坐标获取在高德地图上定到位置

 1 //根据当前坐标得到地图
 2     getMap () {
 3       this.map = new AMap.Map('container', {
 4         zoom: 17,
 5         center: this.CurrentCoordinate
 6       })
 7       this.map.plugin(["AMap.ToolBar","AMap.Geolocation"], () => {
 8           this.map.addControl(new AMap.ToolBar())
 9           this.map.addControl(new AMap.Geolocation())
10       })
11       this.clickListener = AMap.event.addListener(this.map, "click", this._onClick)
12     },
13     _onClick (e) {
14       this.focusAddress(e.lnglat)
15     },
16     focusAddress (pos,nearby) {
17       this.map.clearMap()
18       let location  = pos.location||pos
19       this.currentPos = new AMap.Marker({
20           position : location,
21           icon : 'http://vdata.amap.com/icons/b18/1/2.png',
22           zIndex:999,
23           map : this.map
24       })
25       this.CurrentCoordinate[0] = location.lng
26       this.CurrentCoordinate[1] = location.lat
27       let circle = new AMap.Circle({
28           center: [location.lng,location.lat],
29           radius: 100,
30           fillOpacity:0.2,
31           strokeWeight:1,
32           strokeColor:"#7eb8fc",
33           fillColor:"rgba(104, 149, 229, 0.8)"
34       })
35       circle.setMap(this.map)
36       !nearby && this.map.setFitView()
37       let geo_req = {'location':location,'radius':100,'type':'range','currentPage': 1,'pageSize': 5}
38       //根据坐标获取地理位置的接口
39       this.$http(`${this.api.getNeighboursByLocationUrl}` + JSON.stringify(geo_req)).then(res => {
40         if(res.data&&res.data.success&&res.data.resultdata.company_geo_list){
41           document.getElementById('neighbourhood').innerHTML=''
42           let markers = res.data.resultdata.company_geo_list
43           for(let i=0;i<markers.length;i++){
44             if(!markers[i].company_name){
45               return
46             }
47             document.getElementById('neighbourhood').innerHTML+='<li>'+markers[i].company_name+'</li>'
48             this.placeMarker(markers[i])
49           }
50         }
51       }).catch(e =>{
52         this.$ui.MessageBox.alert(e.data.msg, {})
53       })  
54       this.getNearbyCompanysList(true)
55     },
56     placeMarker (pos){
57       this.marker = new AMap.Marker({
58           position: [pos.longitude, pos.latitude],
59           title:pos.company_name,
60           clickable:true,
61           topWhenClick:true,
62           extData:pos
63       })
64       this.marker.setMap(this.map)
65     }