跨域xml获取请求失败

Question

我试图帮助一个朋友完成一个程序，但我的编码经验有些过时（10 年的付出或接受）。试图通过他们的 API 从数据库中提取数据的地方。我通过 XMLhttpRequest 发出此请求，但我什至在访问服务器时遇到问题。

发生的错误：

Failed to load resource: the server responded with a status of 404 (Not Found)
http://localhost/jasper/api.shiftbase.com/api/rosters?min_date=2020-07-13&max_date=2020-12-31&department_id=24477

它试图在我自己的域上搜索 url。但我需要它来搜索跨域。

整个函数：

function getRequest(){
    var _request = new XMLHttpRequest();
    var key = myKeyHere;
    var url = "api.shiftbase.com/api/rosters?min_date=2020-07-13&max_date=2020-12-31&department_id=24477";
    _request.onreadystatechange = function(event){
    console.log(_request.readyState + " + " + _request.status);
        if (_request.readyState == 4){
            if ((_request.status >= 200 && _request.status < 300) || _request.status == 304){
                alert(_request.responseText);
            } else {
                    alert('Request was unsucceful: ' + _request.status);
            }
        }
    };
    _request.open("get", url, true);
    _request.setRequestHeader("Accept", "application/JSON", false);
    _request.setRequestHeader("Content-Type", "application/JSON", false);
    _request.setRequestHeader("Authorization", key, false);
    _request.send(null);
};  

我还阅读了很多关于 CORS 以及它如何影响这些跨域请求的内容，但我不太了解它是如何工作的以及如何围绕它工作。

感谢任何帮助。

Answer 1

首先，您需要在您的 URL 前加上 https://。这样您就可以向外部服务器而不是 localhost 发出请求。第二件事是，在您的标题中，application/JSON 应该是 application/json。

另外不要忘记您的密钥必须是带有“API”的prefixed。示例API [some_random_key]

我已经测试了下面的代码并且它工作正常。您只需添加自己的 API KEY。

function getRequest(){
    var _request = new XMLHttpRequest();
    var key = "API [replace_this_with_your_key]"; // Example: "API a1b2c3d4e5f6g7h8i9"
    var url = "https://api.shiftbase.com/api/rosters?min_date=2020-07-13&max_date=2020-12-31&department_id=24477";
    _request.onreadystatechange = function(event){
    console.log(_request.readyState + " + " + _request.status);
        if (_request.readyState == 4){
            if ((_request.status >= 200 && _request.status < 300) || _request.status == 304){
                alert(_request.responseText);
            } else {
                    alert('Request was unsucceful: ' + _request.status);
            }
        }
    };
    _request.open("get", url, true);
    _request.setRequestHeader("Accept", "application/json", false);
    _request.setRequestHeader("Content-Type", "application/json", false);
    _request.setRequestHeader("Authorization", key, false);
    _request.send(null);
};

Answer 2

如果您想向外部服务器发出请求，请尝试在 url 变量声明（第 4 行）的行首添加 //。

您的请求已发送至本地网络服务器 http://localhost/jasper/...，您收到了 404（未找到）错误。