1.前言
我是用 高德API 获取定位，如下的代码获取的定位，理论上是没有问题的，但是中间还是经过了很长时间的探索，其中的主要有几点：
- 1.需要配置js安全密钥
- 2.需要使用 Web端 的key，而不是 Web服务的key
- 3.获取到的ip地址并不准确，甚至是没有。
2.使用AMap.CitySearch
(1) 安装高德jsapi
1
| pnpm add @amap/amap-jsapi-loader --save
|
(2) 配置js密钥
这个按照官方的例子进行就可以了，JS API 安全密钥使用。
(3) 边写代码
准备工作做好了之后，就可以进行编码了，代码如下：
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
|
window._AMapSecurityConfig = {
serviceHost: "xxx"
}
AMapLoader.load({
key: "xxx",
plugins: ["AMap.CitySearch"]
}).then((AMap) => {
const city = new AMap.CitySearch()
console.log(city)
city.getLocalCity((status:any, result:any) => {
console.log(result)
console.log(status)
console.log("sddkkkjkkkkkk")
if (status === "complete" && result.info === "OK") {
console.log(result)
}
})
}).catch(e => {
console.log(e)
})
|
(4) 获取结果
我在百度上直接输入 ip 地址，可以查询到我的ip地址归属，但是使用高德的API竟然无法获取到我的ip地址归属，这个让我非常的费解。我同时发现了，使用官方的测试示例 也无法获取到定位地址，但是昨天我使用的时候，还是能获取到地址的啊。我使用高德地图打开，还是能获取到定位的。
3.使用AMap.Geolocation
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
| window._AMapSecurityConfig = {
serviceHost: "xxx"
}
AMapLoader.load({
key: "xxx",
version: "2.0",
plugins: ["AMap.Geolocation"]
}).then((AMap) => {
const geolocation = new AMap.Geolocation({
enableHighAccuracy: true,
timeout: 10000,
offset: [10, 20],
zoomToAccuracy: true,
position: "RB"
})
geolocation.getCurrentPosition(function(status:any, result:any) {
console.log(status)
console.log(result)
})
}).catch(e => {
console.log(e)
})
|
3.过程
我是用 高德API 获取定位，如下的代码获取的定位，理论上是没有问题的。
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
| AMapLoader.load({
key: "xxx",
version: "2.0",
plugins: ["AMap.CitySearch,AMap.Weather"]
}).then((AMap) => {
const city = new AMap.CitySearch()
console.log(city)
city.getLocalCity((status:any, result:any) => {
console.log(result)
console.log("sddkkkjkkkkkk")
if (status === "complete" && result.info === "OK") {
console.log(result)
}
})
}).catch(e => {
console.log(e)
})
|
问题就是这个 city.getLocalCity 函数无法执行，没有输出，没有报错。真是奇了大怪了。
【解决方法】
(1) 后来官方指导说是看下网络请求，结果显示的是 INVALID_USER_KEY。
(2) 我尝试申请了一个 “Web服务” 的key，替换上，结果网络请求里面显示：USERKEY_PLAT_NOMATCH，意思就是 用户的key 不匹配，这就让我很不理解了，到底是用基础服务的key呢，还是使用 Web服务 的key呢？
(3) 去掉 version 参数之后，虽然可以执行下去了，也能输出结果了，但是还是显示:USERKEY_PLAT_NOMATCH,我的可就是 Web服务的 key。
我配置的明明就是 Web服务的key，但是显示的却是 USERKEY_PLAT_NOMATCH
(4) 配置了两个key的时候
配置多个key 的时候，也是会出现问题的。
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
| AMapLoader.load({
key: "73492768ed63ce5506f574b936361f24",
version: "2.0"
}).then((AMap) => {
console.log("sdfsd")
}).catch(e => {
console.log(e)
})
AMapLoader.load({
key: "c884e5b3f6ca52da18925699ab2f502d",
plugins: ["AMap.CitySearch,AMap.Weather"]
}).then((AMap) => {
const city = new AMap.CitySearch()
console.log(city)
city.getLocalCity((status:any, result:any) => {
console.log(result)
console.log(status)
console.log("sddkkkjkkkkkk")
if (status === "complete" && result.info === "OK") {
console.log(result)
}
})
}).catch(e => {
console.log(e)
})
|
(5) 重新配置key
我按照官方大佬的说法，我要用jsweb的key进行调用，而不是使用web服务的key进行调用，而且我的key写成了密钥。于是我修改成了 key,结果显示：INVALID_USER_SCODE
按照官方人员的说法，就是说要用到安全密钥，最后终于算是没有报错了，但是还是查不到位置。
官方的说法就是说ip地址没有覆盖到，但是我在百度中直接输入ip之后，查询到自己的ip归属的，甚至可以查到哪个区的。
