javascript - 使用 karma 和 jasmine 获取 json 文件的 ajax 自定义实现调用的 404

Question

我对 karma 和 Jasmine 比较陌生。我喜欢这种语法，但现在我写的自定义 ajax 函数有问题:

function ajax(options, callback) {
    var xmlhttp;

    if (window.XMLHttpRequest) {
        // code for IE7+, Firefox, Chrome, Opera, Safari
        xmlhttp = new XMLHttpRequest();
    } else {
        // code for IE6, IE5
        xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
    }

    xmlhttp.onreadystatechange = function() {
        if (xmlhttp.readyState == XMLHttpRequest.DONE) {
            if (xmlhttp.status == 200) {
                callback(xmlhttp);
            } else if (xmlhttp.status == 404) {
                callback(null, xmlhttp);
            } else {
                callback(null, xmlhttp);
            }
        }
    };

    xmlhttp.open(options.method, options.url, true);
    xmlhttp.send(options.data);
}

所以在我的测试文件中:

describe('ajax', function() {
describe('$.ajax', function() {
    it('should be able to get data', function(done) {
        $.ajax({
            url: 'test.json',
            method: 'GET'
        }, function(data, err) {
            expect(data).toBeDefined();
            console.log(data);
            console.log(err);
            done();
        });
    });
});
});

它返回一个带有 404 错误的 xhr 对象。仔细检查 PhantomJS 说:[web-server]: 404:/test.json。在搜索了一些答案后，我尝试了代理，但仍然返回 404。

顺便说一句，这不使用 jquery。它是一个自定义实现，设置在编写的 $ 模块上。所有 src 代码都在 vanilla JS 中。

那么如何让ajax函数能够访问json文件呢。我的根文件结构是:

/
--src 
  --js 
--tests 
--karma.conf.js

我已经将 test.json 文件放在 src 和 test 目录中。

最后是我的 karma.conf.js:

// karma.conf.js
module.exports = function(config) {
  config.set({
    frameworks: ['jasmine'],
    reporters: ['spec'],
    browsers: ['PhantomJS'],
    files: [
      'src/js/**/*.js',
      'tests/*.js'
    ]

  });
};

如果您发现它相关，这将由 Gulp 处理。

Answer 1

好的，我明白了。这非常令人困惑，而且没有太多关于它的信息。要访问项目中的 json 文件，您需要使用 karma.conf.js 文件。在我的例子中，我不得不改变这个:

module.exports = function(config) {
  config.set({
    frameworks: ['jasmine'],
    reporters: ['spec'],
    browsers: ['PhantomJS'],
    files: [
      'src/js/**/*.js',
      'tests/*.js'
    ]

  });
};

为此:

module.exports = function(config) {
config.set({
    frameworks: ['jasmine'],
    reporters: ['spec'],
    browsers: ['PhantomJS'],
    files: [
        'src/js/**/*.js',
        'tests/*.js', {
            pattern: 'tests/*.json',
            served: true,
            included: false
        }
    ],
    proxies: {
        '/tests/': '/base/tests/'
    }

});
};

模式部分是在不引发可怕错误的情况下抓取 json 文件的部分。显然这些被称为固定装置？

注意代理部分。我会尽量解释清楚。基本上，Karma 提供从链接到目录根目录的基本目录中的所有内容。现在，当我说 base 时，我不是指 root 或/，而是/base/。这就是我感到困惑的地方。

所以如果你有一个目录你想为你的 {pattern: 'spec/fixtures/*.json'} 提供服务，你将需要一个像这样的代理: proxies: { '/spec/fixtures/': '/base/spec/fixtures/' } 然后你在测试中的 ajax 调用将转到 url spec/fixtures/test.json。