在使用axios进行经过身份验证的请求时,Jest返回“网络错误”

时间:2017-03-08 17:00:22

标签: javascript testing ecmascript-6 axios jestjs

这对我来说似乎有点奇怪。我正试图用Jest测试一个实际的(即真实的网络)请求。

这些是经过测试的情景:

  • 测试没有标题的外部API(fixer.io)< ---这可行
  • 使用标题< ---这不起作用
  • 测试本地API服务器
  • 使用来自node终端的标题测试相同的本地API< ---此作品

这种行为背后的原因是什么?什么是解决方案?

//This WORKS
test('testing no headers', () => {
  return axios.get('http://api.fixer.io/latest')
        .then( res => console.log(res) )
});

//This DOES NOT work
test('testing no headers', () => {
  return axios.get('http://localhost:3000/users/4/profile', 
                      {headers:{authorization:`Bearer ${mytoken}`}})
        .then( res => console.log(res) )
});

//...

//Node Terminal
//This WORKS
> axios.get('http://localhost:3000/users/4/profile', 
                   {headers:{authorization:`Bearer ${mytoken}`}})
        .then( res => console.log(res) )

4 个答案:

答案 0 :(得分:33)

这可能是Jest配置问题。我解决了强制“node”作为package.json中的jest环境:

“jest”:{     “testEnvironment”:“节点”   }

请参阅文档:https://facebook.github.io/jest/docs/configuration.html#testenvironment-string

答案 1 :(得分:20)

Jest允许您设置安装脚本文件。其他所有内容之前都需要此文件,并且您有机会修改运行测试的环境。这样,您可以在加载axios之前取消设置XMLHttpRequest,并在挂起导入之后评估适配器类型。 https://facebook.github.io/jest/docs/configuration.html#setuptestframeworkscriptfile-string

这对我有用:

<强>的package.json

{
  ...,
  "jest": {
    ...,
    "setupTestFrameworkScriptFile": "./__tests__/setup.js",
    ...
  },
  ...
}

<强> __测试__ / setup.js

global.XMLHttpRequest = undefined;

答案 2 :(得分:16)

有趣的是,axios主要使用XMLHttpRequest,而ajax请求无法跨域访问,因此您的测试失败,因此您可以通过设置axios适配器来让代码通过。

axios / defaults.js的原因

 function getDefaultAdapter() {
    var adapter;
    if (typeof XMLHttpRequest !== 'undefined') {
        // For browsers use XHR adapter
        adapter = require('./adapters/xhr');
    } else if (typeof process !== 'undefined') {
        // For node use HTTP adapter
        adapter = require('./adapters/http');   
    }
    return adapter;
 }

解决方案将axios适配器更改为http

import axios from 'axios';
//This WORKS
test('testing with headers', (done) => {
    var path=require('path');
    var lib=path.join(path.dirname(require.resolve('axios')),'lib/adapters/http');
    var http=require(lib);
    axios.get('http://192.168.1.253', {
        adapter: http,
        headers: {
            Authorization: "Basic YWRtaW46bHVveGlueGlhbjkx"
        }
    }).then((res) => {
        expect(res.status).toBe(200);
        done();
    }).catch(done.fail);
});

解决方案在package.json

中更改jest testURL
"jest": {
   "testURL":"http://192.168.1.253"
}

然后测试可以通过ajax访问http

import axios from 'axios';
    //This WORKS
    test('testing with headers', (done) => {
        axios.get('http://192.168.1.253', {
            headers: {
                Authorization: "Basic YWRtaW46bHVveGlueGlhbjkx"
            }
        }).then((res) => {
            expect(res.status).toBe(200);
            done();
        }).catch(done.fail);
    });

答案 3 :(得分:1)

我通过添加来解决它

axios.defaults.adapter = require('axios/lib/adapters/http');

对于特定的测试用例文件,由于设置global.XMLHttpRequest = undefined或env = node导致我的其他测试用例失败。