GET XMLHttpRequest停在readstate 4和状态0的地方

Question

我一直试图从NewsAPI.org获取文章，但我得到了这个错误。

Access to XMLHttpRequest at 'https://newsapi.org/v2/top-headlines?country=us&category=general&apiKey=XXXXXXXXXXXXX' from origin 'null' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.

我注意到它停在了readstate 4和state 0.

这是我使用的函数的代码。

function getNews()
{
    var url = 'https://newsapi.org/v2/top-headlines?country='+country+'&category='+category+'&apiKey=XXXXXXXXXXXXX';
    var req = new XMLHttpRequest();
    req.open('GET' , url);
    req.send();

    req.onreadystatechange = function()
    {
        if(req.readyState == 4 && req.status == 200)   
            {
                news = JSON.parse(req.response);
                news = news.articles;
                displayNews();
            }
    }
}

注意： 我试图添加 "Access-Control-Allow-Origin "头，但没有任何改变。

Answer 1

首先，xhr的请求并没有停止于 req.readystate == 4 而是在 res.send(). 还 CORS 是浏览器提供的标准网络安全服务，以防止数据从其他来源泄露。

在本地测试时，你可以通过添加头部来绕过它。

Access-Control-Allow-Origin: *