在使用时获取不到数据只能得到经纬度,
打印时会报INVALID_USER_SCODE
其实这在官网里提到了,之前没有通篇全读注意
4. 添加成功后,可获取到key值和安全密钥jscode(自2021年12月02日升级,升级之后所申请的 key 必须配备安全密钥 jscode一起使用)
注意:此次升级不会影响之前已获得 key 的使用;升级之后的新增的key必须要配备安全密钥一起使用,具体用法请您参看下文《JSAPI key和安全密钥设置和使用》(本次key升级新增安全密钥,是为了提升广大用户的对自己的key安全有效管理,降低明文传输被窃取的风险 。)
以上是官网原话
注意是必须搭配安全密钥一起使用!
以前可能老版本的项目没有这样使用,照着写就会拿不到数据
官网提供了两种解决办法:
一:1)JSAPI key搭配代理服务器并携带安全密钥转发(安全)
引入地图 JSAPI 脚本之前增加代理服务器设置脚本标签,设置代理服务器域名或地址,将下面示例代码中的「您的代理服务器域名或地址」替换为您的代理服务器域名或ip地址,其中_AMapService为代理请求固定前缀,不可省略或修改。(注意您这个设置必须是在 JSAPI 的脚本加载之前进行设置,否则设置无效。)
<script type="text/javascript">
window._AMapSecurityConfig = {
serviceHost:'您的代理服务器域名或地址/_AMapService',
// 例如 :serviceHost:'http://1.1.1.1:80/_AMapService',
}
</script>
<script type="text/javascript" src="https://webapi.amap.com/maps?v=1.4.15&key=您申请的key值"></script>
2)代理服务器的设置
以 Nginx 反向代理为例,参考以下三个location配置,进行反向代理设置,分别对应自定义地图、海外地图、Web服务,其中自定义地图和海外地图如果没有使用到相关功能也可以不设置。需要将以下配置中的“您的安全密钥”六个字替换为您刚刚获取的jscode安全密钥。如果您使用了多个key,需要在代理设置中根据 key来映射不同的安全密钥。
server {
listen 80; #nginx端口设置,可按实际端口修改
server_name 127.0.0.1; #nginx server_name 对应进行配置,可按实际添加或修改
# 自定义地图服务代理
location /_AMapService/v4/map/styles {
set $args "$args&jscode=您的安全密钥";
proxy_pass https://webapi.amap.com/v4/map/styles;
}
# 海外地图服务代理
location /_AMapService/v3/vectormap {
set $args "$args&jscode=您的安全密钥";
proxy_pass https://fmap01.amap.com/v3/vectormap;
}
# Web服务API 代理
location /_AMapService/ {
set $args "$args&jscode=您的安全密钥";
proxy_pass https://restapi.amap.com/;
}
}
方式二【不建议】:
JSAPI key搭配静态安全密钥以明文设置(不安全,建议开发环境用):
引入地图 JSAPI 脚本之前增加设置 JSAPI 安全密钥的脚本标签,并将您的安全密钥「您申请的安全密钥」替换为您的安全密钥;(注意这个设置必须是在 JSAPI 的脚本加载之前进行设置,否则设置无效。)
<script type="text/javascript">
window._AMapSecurityConfig = {
securityJsCode:'您申请的安全密钥',
}
</script>
<script type="text/javascript" src="https://webapi.amap.com/maps?v=1.4.15&key=您申请的key值"></script>
虽然说这种不建议,但小伙伴平时可能还是使用这种方便点,如果有实际开发需要则使用第一种更好。