首页 > 解决方案 > 测试 400 状态码 axios 抛出错误

问题描述

我正在为我正在处理的项目创建一个 api 测试框架,并且我正在寻找验证发送到端点的 JSON 对象中的必填字段。

我正在尝试发送一个缺少字段的 JSON 对象,并期望我的应用程序收到 400 响应并带有验证消息。但是当使用 axios 进行此调用时,它(有点正确)在收到 400 时会引发错误。

我希望能够断言 400 是预期的并断言验证消息。

我遇到的所有示例都是关于以正确的方式处理 400 响应,如果您不期待 400 响应,但我期待它。

我似乎找不到其他人在尝试这个。

async function createReminder(reminderObject) {
  const response = await axios.post(`${config.get('baseUrl')}/reminder`, {
    ...reminderObject
  });

  return response;
}

module.exports.createReminder = createReminder;

这是我的工作代码。当与有效呼叫一起使用时,这将产生有效的 200。

我需要在响应对象中返回 400 响应/验证消息,以便在调用此函数的函数中进行处理。

标签: javascripttestingaxiosweb-api-testing

解决方案


实际上,您希望拦截响应并根据需要对其进行转换。axios 文档中有一个专门用于拦截器的部分。作为你可以用它做什么的一个例子,这是我在最近一个带有 Laravel 后端的项目中使用的:

axios.interceptors.response.use(
  res => Promise.resolve(res.data),
  error => {
    let message = null;
    if (error.response) {
      // if error has a data.error property, it's an error formatted by server
      if (error.response.data.error) message = error.response.data.error;
      else if (error.response.status === 500) message = 'Oops! Something went wrong.';
    } else {
      // if error has a code property, it's an error defined by axios
      if (error.code === 'ECONNABORTED') message = 'Timeout exceeded';
      else message = 'Oops! Something went wrong.';
    }
    // eslint-disable-next-line prefer-promise-reject-errors
    return Promise.reject({ error: message });
  }
);

上面的代码允许我按如下方式进行 axios 调用,并且始终期望相同的格式:

axios.post('/url', { data: { ... }})
  .then(({ jsonProp1 }) => console.log(jsonProp1))
  .catch(({ error }) => console.log(error);

注意:如果你创建了一个新的 axios 实例,你也需要为这个实例重新注入响应拦截器。


推荐阅读