在 VueJs 中发布带有未定义响应的请求

Question

我是 VueJs 和 Expressjs 的初学者。我试图用 Vuejs 做前端，用 ExpressJs 做后端。我向后端（expressJs）发送一个发布请求，然后：

1- 响应未定义 2-同时我可以在chrome开发工具中看到2个请求。一个是 Option，另一个是 Post。 3- 使用邮递员完全没有问题。

这里是express中app.js的代码

console.log('Server is running')

const express = require('express'),
    bodyParser = require('body-parser'),
    cors = require('cors'),
    morgan = require('morgan');

app = new express();

//Setup middleware
app.use(cors());
app.use(morgan('combined'))
app.use(bodyParser.json())

app.post('/register', (req, res, next) => {
    res.send({
        message: `Hello ${req.body.email}! your user was registered!`
    })
});

app.listen(8081);

这是 VueJs 中的代码：

// Api Setting

import axios from 'axios'

export const HTTP = axios.create({
    baseURL: `http://localhost:8081`
  });



// AuthenticationService

import { HTTP } from '../services/Api'

export default {

  register(credentials) {
     HTTP.post('register', credentials);
  }
}



// Register Component 
export default {
  data() {
    return {
      email: '',
      password: ''
    };
  },
  methods: {
   
   async register() {
        const response = await AuthenticationService.register({
        email: this.email,
        password: this.password
      });

      console.log(response);  // the value is undefined
    }
  }
};

我真的不知道我在这里错过了什么，我同时收到一个未定义的响应和 2 个请求。我很感激任何提示。

github repo 上的完整代码：here

Answer 1

也许吧。 Authentication.register 没有返回任何内容，或者更具体地说是 Promise，它应该用于在 await 调用中填充 const response。

尝试返回类似这样的内容：return HTTP.post('register', credentials); 内 register。

但要使其正常工作，HTTP.post('register', credentials) 也应该返回一些内容。

Answer 2

我使用 JSON.stringify 发送数据，你是直接发送对象，所以

register(credentials) {
    HTTP.post('register', credentials);
}

变成

register(credentials) {
    HTTP.post('register', JSON.stringify(credentials));
}