axios 不会通过 http-proxy-middleware 向服务器发送 post 请求

时间:2021-06-01 23:56:15

标签: javascript axios http-proxy-middleware

import axios from 'axios';

axios
  .post('api/email', { id: 1 })
  .then((res) => {
     return res.data;
  })

server.js

const express = require('express');
const next = require('next');
const { createProxyMiddleware } = require('http-proxy-middleware');
const port = parseInt(process.env.PORT, 10) || 3000;
const dev = process.env.NODE_ENV !== 'production';

const app = next({ dev });
const handle = app.getRequestHandler();

const apiPaths = {
  '/api': {
    target: 'http://localhost:8080/',
    pathRewrite: {
      '^/api': '/api',
    },
    changeOrigin: true,
  },
};

const isDevelopment = process.env.NODE_ENV !== 'production';

app
  .prepare()
  .then(() => {
    const server = express();

    server.use(express.json());
    server.use(express.urlencoded({ extended: false }));
    if (isDevelopment) {
      console.log('ok');
      server.use('/api', createProxyMiddleware(apiPaths['/api']));
    }

    server.all('*', (req, res) => {
      return handle(req, res);
    });

    server.listen(port, (err) => {
      if (err) throw err;
      console.log('> Ready on http://localhost:' + port);
    });
  })
  .catch((ex) => {
    console.error(ex.stack);
    process.exit(1);
  });

我的服务器位于本地主机:8080。
我在 nextJS 中编写客户端,当 url 调用时,我使用 http-proxy-middleware 包。也就是说,我所有包含 /api/ 的请求都会从 localhost:3000 重定向到 localhost:8080。 axios 不发送 post 请求,get 没问题。
在开发者模式浏览器中查看 Network 选项卡时,它会显示请求标头本身,但没有方法。计时选项卡显示警告请求尚未完成。

UPD:我只是尝试通过 fetch 发送,结果是一样的,但我也删除了 Content-Type: 'application / json' 并且 fetch 对我有用。但这是为什么,我该如何解决?

enter image description here

enter image description here

1 个答案:

答案 0 :(得分:0)

我能够解决我的问题。此处找到的解决方案:https://github.com/chimurai/http-proxy-middleware/issues/40socket hang up error with nodejs
问题是 server.js
这是更正后的代码

if (isDevelopment) {
  console.log('ok');
  server.use('/api', createProxyMiddleware(apiPaths['/api']));
}
server.use(express.json());
server.use(express.urlencoded({ extended: false }));