从es6中的文件中获取json数据

时间:2018-07-24 07:23:02

标签: javascript json ecmascript-6

我从文件获取json数据时遇到问题。 我在控制台中遇到错误404(未找到)。我不知道这是怎么回事,当我将url代替文件路径时,它会起作用

export const loadProducts = {
    init: function () {
        this.getFromJson();
    },

    getFromJson: function() {
        const request = new XMLHttpRequest();

        request.open('GET', '../data/products.json', true);

        request.onreadystatechange = function() {
            if (request.status == 200){
                console.log('data')
                const files = JSON.parse(request.response);
            } 
            else {
                console.log('connected, but API returned an error');
            }
        };

        request.onerror = function() {
            console.log('connection error');
        };

        request.send(); 
    }

}

1 个答案:

答案 0 :(得分:2)

尝试一下。它对我有用。

export const loadProducts = {
  init: function() {
    this.getFromJson();
  },

  getFromJson: function() {
    const request = new XMLHttpRequest();
    requeest.overrideMimeType("application/json");

    let path = 'file:///C:/folder/blah.json';

    request.open('GET', 'file:///C:/some/file.json', true);

    request.onreadystatechange = function() {
      if (request.readyState == 4 && request.status == "200") {
        console.log('data')
        const files = JSON.parse(request.response);
      } else {
        console.log('connected, but API returned an error');
      }
    };

    request.onerror = function() {
      console.log('connection error');
    };

    request.send();
  }

}

P.s。 XMLHttpRequest使用file协议。阅读here