vue项目中的vue.config.js配置文件中的proxy代理post请求时报ECONNRESET错误

最新推荐文章于 2025-06-17 15:57:19 发布

我在小楼听着风

最新推荐文章于 2025-06-17 15:57:19 发布

阅读量3.1k

点赞数 3

CC 4.0 BY-SA版权

分类专栏： vue

本文链接：https://blog.youkuaiyun.com/weixin_44490109/article/details/118544727

vue 专栏收录该内容

11 篇文章

订阅专栏

在Vue项目的开发环境中，遇到POST请求失败的问题。通过检查，接口本身及代理配置没有问题，推测可能是因为POST数据格式导致。解决方案是在vue.config.js中添加onProxyReq方法，处理请求体的数据格式，将Content-Type更改为application/json并正确设置Content-Length，确保数据能被正确发送到API服务器。最终，问题得到解决，POST请求成功完成。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

1、问题

错误如下所示：
在这里插入图片描述

vue.config.js中的代理配置如下：

devServer: {
	proxy: {
      // change xxx-api/login => mock/login
      // detail: https://cli.vuejs.org/config/#devserver-proxy
      '/ecustom': {
        target: 'http://xxx.xx.x.xxx:xx', //API服务器的地址
        // ws: true, //代理websockets
        changeOrigin: true, // 是否跨域，虚拟的站点需要更管origin
        pathRewrite: {
          // '^/api5'是一个正则表达式，表示要匹配请求的url中，全部'http://localhost:8081/api5' 转接为 http://localhost:8081/api/
          '^/ecustom': '',
        },
        logLevel: 'debug' // 打印调试信息
      },
   }
}

2、分析

（1）在postman上测试接口，数据能正常返回，说明接口是没问题。
（2）代理了get请求也能够请求成功，说明代理配置上也是没问题的。
（3）猜测可能是代理后post的数据格式上有问题。

3、解决

配置onProxyReq去处理返回的数据。
vue-config.js中的代理配置代码如下：

devServer: {
    proxy: {
      '/ecustom': {
        target: 'http://xxx.xx.x.xxx:xx', //API服务器的地址
        // ws: true, //代理websockets
        changeOrigin: true, // 是否跨域，虚拟的站点需要更管origin
        onProxyReq: function (proxyReq, req, res, options) {
          if (req.body) {
            let bodyData = JSON.stringify(req.body);
            // incase if content-type is application/x-www-form-urlencoded -> we need to change to application/json
            proxyReq.setHeader('Content-Type','application/json');
            proxyReq.setHeader('Content-Length', Buffer.byteLength(bodyData));
            // stream the content
            proxyReq.write(bodyData);
          }
        },
        pathRewrite: {
          // '^/api5'是一个正则表达式，表示要匹配请求的url中，全部'http://localhost:8081/api5' 转接为 http://localhost:8081/api/
          '^/ecustom': '',
        },
        logLevel: 'debug' // 打印调试信息
      },
    }
  },