没有& # 39;Access-Control-Allow-Origin& # 39;标头存在于请求的资源上.Chrom

No 'Access-Control-Allow-Origin' header is present on the requested resource. Chrome application

本文关键字:请求 Chrom 资源 存在 Access-Control-Allow-Origin 没有 于请求      更新时间:2023-09-26

A有一个问题…

创建一个对服务器的请求。我需要在URL下载照片,但是"Access-Control-Allow-Origin"不允许我这样做。请救救我!

var xhr = new XMLHttpRequest();
xhr.open('GET',"`http://scontent-b.cdninstagram.com/hphotos-ash/t51.2885-15/925251_476615232484089_631852735_n.jpg`", true);
xhr.responseType = 'blob';
xhr.setRequestHeader('Access-Control-Allow-Origin', '`https://ipfmnlpkligplampkpahcmideefmcmpl.chromiumapp.org/`');
xhr.onload = function(e){
$("<img src='"+window.URL.createObjectURL(this.response)+"'>").append("body");
  };
xhr.send();
控制台:

XMLHttpRequest cannot load `http://scontent-a.cdninstagram.com/hphotos-ash/t51.2885-15/10362165_1441926822728933_946328003_n.jpg`. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'chrome-`extension://ipfmnlpkligplampkpahcmideefmcmpl`' is therefore not allowed access. 

在Chrome应用程序中,您不需要担心xhr中的跨域权限。

你需要确保你加载的资源是在manifest的权限中指定的。

注:您的解决方法不工作,因为您正在设置请求字段,而错误是关于响应字段。

您可以在Vanilla中直接使用<img>完成这些操作。

(function (src) {
    var img = new Image(); // or document.createElement('img');
    function _load() {
        this.removeEventListener('load', _load);
        document.body.appendChild(this);
    }
    img.addEventListener('load', _load);
    img.src = src; // fetch
}('http://scontent-b.cdninstagram.com/hphotos-ash/t51.2885-15/925251_476615232484089_631852735_n.jpg'));