【问题标题】:Nuxt axios cannot handle the server sesponseNuxt axios 无法处理服务器响应
【发布时间】:2019-03-18 11:41:05
【问题描述】:

我是Nuxt.js 的新手,遇到了一个奇怪的问题。我的后端 API 中有一个端点,允许最终用户发送 token 和新的 password 并重置用户密码。

当请求被正确发送并且服务器以正确的数据响应时:

Nuxt.js 方面,我有一个问题,与响应数据有关。

所以,要使用 axios 处理所有 HTTP 请求,我有一个这样的类:

class WebAPI {
    // $axios is the instance used in the Nuxt.js context
    constructor($axios) {
        this.$http = $axios;
    }

    async call(config) {
        try {
            ///////////////////////////////////////////////////////
            // HERE IS THE PROBLEM. THE FOLLOWING CONSOLE.LOG
            // IT RETURNS undefined WHILE THE NETWORK RESPONSE
            // RETURNS WITH DATA
            ///////////////////////////////////////////////////////
            const result = await this.$http(config);
            console.log(result);
            // ...
        } catch( e) {
            // ...
        }
    }
}

我像这样使用这个类:

const data = {
    token,
    new_password
};

const options = {
    method: 'POST',
    url   : '/reset-password',
    data
};

return this.webApi.call(options);

但正如你可能看到的,在WebAPI 服务中,axios 的响应是undefined

另外,值得一提的是,完全相同的 WebAPI 类可以与我在整个应用程序中执行的其他 API 请求完美配合。

你能帮忙解决这个问题吗?你看出什么不对了吗?

【问题讨论】:

    标签: javascript vue.js vuejs2 nuxt.js


    【解决方案1】:

    我认为您使用 axios 错误。尝试使用$request 方法,像这样:

    async call(config) {
      try {
        const result = await this.$http.$request(config);
        console.log(result);
        // ...
      } catch( e) {
        // ...
      }
    }
    

    【讨论】:

    • 他们用对了,你和 OP 都调用了相同的方法github.com/axios/axios#axios-api
    • 也许一样。或不。 Nuxt $http 也不一样 axios。 Nuxt 对 get、post 等方法使用 $ 前缀。在该方法中,它返回response.datagithub.com/nuxt-community/axios-module/blob/master/lib/…
    • @AlexanderYakushev 感谢您的回复。不幸的是,这不起作用。最重要的是,正如我在描述中解释的那样,我对其他请求使用相同的 WebAPI 代码,并且其他请求正常工作。
    • 响应的HTTP代码是200还是400?如果是 400,则必须在 catch 部分处理响应。
    猜你喜欢
    • 1970-01-01
    • 2021-01-24
    • 1970-01-01
    • 2021-05-22
    • 2017-02-08
    • 2019-04-20
    • 1970-01-01
    • 1970-01-01
    • 2015-06-14
    相关资源
    最近更新 更多