反应 axios cros 身体空答案

【问题标题】：react axios cros body empty反应 axios cros 身体空
【发布时间】：2022-01-25 17:55:13
【问题描述】：

正在开发我的第一个 MERN 应用。当我试图调用我的后端 api 时，似乎正文内容丢失了。但是使用 Postman 可以正常工作。所以我想我的 CORS 有问题。

下面是我的前端和后端代码：

前端 - login.jsx

import axios from 'axios';
...
axios.get(process.env.REACT_APP_API_URL+'/auth/login'
        , {username: 'demo', password: '1234567'}
    ).then(user => {
        console.log(user);

    }).catch(error =>{
        console.log(error);

    });

后端 - index.js

const express = require('express');
const bodyParses = require('body-parser');
const cors = require('cors');

const authRoute = require('./routes/auth');

const app = express();
app.use(bodyParses.json());
app.use(bodyParses.urlencoded({ extended: true }));
app.use(cors());

app.use('/api/auth', authRoute);
...

后端 - auth.js

const rooter = require('express').Router();

rooter.get('/login', async (req, res) => {
   console.log('*** req.body:', req.body);
   ...
}

我在浏览器控制台中收到了这条消息：

GET http://localhost:5000/api/auth/login 401（未经授权）xhr.js:210

在后端我得到了这个

*** req.body: {}

任何帮助将不胜感激。

【问题讨论】：

标签： node.js reactjs express axios

【解决方案1】：

使用 axios 的 GET 请求不支持正文，请将其更改为 POST：

rooter.post('/login', async (req, res) => {
   console.log('*** req.body:', req.body);

axios.post(process.env.REACT_APP_API_URL+'/auth/login'

【讨论】：

确实如此。现在可以了。非常感谢。