我正在使用 cordova 应用程序,并且有 map 的浏览器 key 。
<script async defer
src="https://maps.googleapis.com/maps/api/js?key=AIzaSyBHJxzPHD_egYnhxntqcvfem35YRjruzAg&callback=initMap">
</script>
但是我想从服务器获取我的 key ,我获取了该 key 并将其存储为
localStorage.getItem("MapCode")
这个本地存储提供
"https://maps.googleapis.com/maps/api/js?key=AIzaSyBHJxzPHD_egYnhxntqcvfem35YRjruzAg&callback=initMap"
所以我想将其写入 src 但我无法做到。
<script async defer
src=localStorage.getItem("MapCode")>
</script>
我该如何解决这个问题?提前致谢
最佳答案
您可以动态加载 Google Maps JavaScript API。为此,您可以创建以下代码:
function loadScript() {
var script = document.createElement('script');
script.type = 'text/javascript';
script.src = localStorage.getItem("MapCode");
document.body.appendChild(script);
}
window.onload = loadScript;
请看示例代码http://jsbin.com/carobun/edit?html,output
代码片段:
var map;
function initialize() {
var c = new google.maps.LatLng(54.8867537,-1.557352);
var mapOptions = {
zoom:7,
center: c
};
map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);
}
function loadScript() {
var script = document.createElement('script');
script.type = 'text/javascript';
script.src = 'https://maps.googleapis.com/maps/api/js?v=3' +
'&key=AIzaSyDztlrk_3CnzGHo7CFvLFqE_2bUKEq1JEU&callback=initialize';
document.body.appendChild(script);
}
window.onload = loadScript;
html,
body,
#map-canvas {
height: 100%;
width: 100%;
margin: 0px;
padding: 0px
}
<div id="map-canvas"></div>
关于javascript - Google map javascript api key ,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37560955/