使用vanilla JS AJAX请求访问本地JSON文件时出现CORS错误?

时间:2015-07-07 12:52:30

标签: javascript ajax json

我正在尝试使用vanilla JS AJAX请求从本地存储的JSON文件中撤回JSON字符串(特别是尝试不使用JQuery) - 下面的代码基于this answer - 但我一直在Chrome控制台中出现错误(请参阅下文)。我出错的任何想法?我试过改变xhr.open&的定位。 .send请求,但仍然收到错误消息。我怀疑问题出在.send()请求?

//Vanilla JS AJAX request to get species from JSON file & populate Select box
function getJSON(path,callback) {

    var xhr = new XMLHttpRequest();                                         //Instantiate new request

    xhr.open('GET', path ,true);                                            //prepare asynch GET request
    xhr.send();                                                             //send request

    xhr.onreadystatechange = function(){                                    //everytime ready state changes (0-4), check it
        if (xhr.readyState === 4) {                                         //if request finished & response ready (4)
            if (xhr.status === 0 || xhr.status === 200) {                   //then if status OK (local file || server)
                var data = JSON.parse(xhr.responseText);                    //parse the returned JSON string
                if (callback) {callback(data);}                             //if specified, run callback on data returned
            }
        }
    };
}
//-----------------------------------------------------------------------------

//Test execute above function with callback
getJSON('js/species.json', function(data){
    console.log(data);
});

Chrome中的控制台正在抛出此错误:

  

" XMLHttpRequest无法加载file:/// C:/Users/brett/Desktop/SightingsDB/js/species.json。交叉源请求仅支持协议方案:http,数据,chrome,chrome-extension,https,chrome-extension-resource。"

非常感谢任何见解 - 非常感谢。

2 个答案:

答案 0 :(得分:1)

尝试在本地服务器上运行应用程序,如apache或wamp,然后您将不会遇到任何问题

答案 1 :(得分:1)

基本上就像Felix,错误消息msg等人所说 - 根本无法针对本地文件运行AJAX请求。

感谢。