javascript - 为 标签发出的请求设置自定义 header

Question

假设我有这样的代码:

<img src='images/whatever.jpj' width='' height=''/>

如何为此请求配置自定义 header ？

将不胜感激。

Answer 1

我来晚了，但你可以使用 XMLHttpRequest 和一个 blob 来完成。

var xhr = new XMLHttpRequest();
xhr.responseType = 'blob'; //so you can access the response like a normal URL
xhr.onreadystatechange = function () {
    if (xhr.readyState == XMLHttpRequest.DONE && xhr.status == 200) {
        var img = document.createElement('img');
        img.src = URL.createObjectURL(xhr.response); //create <img> with src set to the blob
        document.body.appendChild(img);
    }
};
xhr.open('GET', 'http://images.example.com/my_secure_image.png', true);
xhr.setRequestHeader('SecretPassword', 'password123');
xhr.send();

如果需要，您可以检查以确保 blob 的 MIME 类型是图像。