Question

当我通过AJAX获取静态地图图像以检查错误时，我得到：

拒绝获取不安全标头“x-staticmap-api-warning”

（在chrome中）

我对标题知之甚少，但似乎必须在服务器上允许它们。这是正确的？或者我能做些什么吗？

完成我的代码：

getImageUrl(mapAddress) {
    return "https://maps.googleapis.com/maps/api/staticmap?center=" + encodeURIComponent(mapAddress) + "&markers=color:red%7C" + encodeURIComponent(mapAddress) + "&zoom=17&size=" + this.state.boxWidth + "x" + this.state.boxHeight + "&maptype=roadmap&key=" + GOOGLE_KEY;
}

getImage(mapAddress) {
    let url = this.getImageUrl(mapAddress);
    let xhr = new XMLHttpRequest();
    xhr.open("GET", url, true);

    // Ask for the result as an ArrayBuffer.
    xhr.responseType = "arraybuffer";

    xhr.onload = (e) => {
        let warning;

        try {
            warning = xhr.getResponseHeader('x-staticmap-api-warning');
        } catch (e) {}

        if (warning && warning.indexOf('Error geocoding') === 0) {
            this.setState({
                imageFound: false,
                loading: false
            });
        }
        else {
            let imageBlob = new Blob([new window.Uint8Array(xhr.response)]);
            let imageUrl = URL.createObjectURL(imageBlob);

            this.setState({
                imageFound: true,
                imageSrc: imageUrl,
                loading: false
            });
        }
    };
    xhr.send();
}

Answer 1

我弄清楚问题是什么，你的代码没有任何问题。问题是您在(mapaddress)中使用的URL地址不完整或缺少详细信息。

在Static Maps API - Error Messages的文档中，它说：

对于某些错误情况，API会返回地图，但地图中可能会遗漏某些信息。发生这种情况时，会出现两个通知您警告的情况。

一，地图显示，但叠加了黄色错误条   带有文字的地图顶部＆＃34;地图错误：g.co/staticmaperror"。

二，   API以名为的HTTP标头的形式返回警告   X-Staticmap-API-警告。

我还尝试过你的网址，用一个有效的地址替换它，它运行正常。

https://maps.googleapis.com/maps/api/staticmap?center=plaza+catalunya+barcelona&markers=color:red%7Cplaza+catalunya+barcelona&zoom=17&size=600x300&maptype=roadmap&key=YOUR_KEY

Answer 2

OP知道了吗？

所有答案均无效，因为我和我也都假定OP，如果找不到地址，则只需不显示图像。

所以我们需要验证地址：

a）首先对地址进行地理编码，以检查其是否有效 b）或从静态映射中监听响应标头。

似乎不是后者的选择...只是以一种奇怪的方式出现，即google处理其静态地图服务中的错误。

通过AJAX读取静态地图时不安全标题

2 个答案: