在Squarespace代码块中嵌入自定义Google Map

Question

我正在尝试在Squarespace网站中创建带有自定义图标和弹出窗口的Google地图，由于跨域请求被阻止，我无法使用Maps Javascript API显示该地图。允许对Google Maps Javascript API进行跨域请求的最简单方法是什么？

我按照说明在[此处]（https://developers.google.com/maps/documentation/javascript/examples/overlay-popup）上的地图上放置自定义弹出窗口，但是当我尝试创建地图时，我收到一条错误消息，指出该请求已被CORS策略拒绝。我搜索了此问题，发现了一个可能涉及.htaccess文件的解决方案，但似乎Squarespace开发人员模式不允许创建/编辑.htaccess文件。

我在代码块中使用脚本标记加载Google Maps API，如下所示：

<script async defer
        src="https://maps.googleapis.com/maps/api/js?key=MY_API_KEY&callback=initMap">
</script>
<div id="map"></div>

而我尝试加载地图的initMap函数看起来像这样：

function initMap() {
  map = new google.maps.Map(document.getElementById("map"), mapOptions);
// Code to implement Popup class...
}

我希望可以调用“ google.maps.Map”构造函数来创建地图并将其显示在我的Squarespace代码块中，但是显示的只是一个空白的div。控制台会显示以下错误消息：

从原点'null'对'https://www.google.com/maps/d/gen204?cid=mme&_reqid=50029&rt=j'处XMLHttpRequest的访问已被CORS策略阻止：对预检请求的响应未通过访问控制检查：没有'Access-Control-Allow-Origin'标头出现在请求的资源上。