使用vue-cli webpack模板配置代理至后端服务器遇ECONNREFUSED错误求助

你这是代理请求连不上后端服务的典型问题，我来帮你一步步排查解决：

1. 先确认后端服务是否正常运行 #

这个错误最常见的原因就是你要代理到的http://localhost:3000根本没启动服务。先检查你的后端项目是不是已经正常启动并监听3000端口，可以用命令行工具测试：

curl http://localhost:3000

如果返回无法连接，那先把后端服务跑起来再说！

2. 检查代理配置的语法错误 #

你提到的配置里写了target: 'http://localhost:3000...'，这里的...应该是输入错误吧？正确的target必须是完整且无多余字符的地址，标准配置示例如下：

proxyTable: {
  '/api': {
    target: 'http://localhost:3000',
    changeOrigin: true, // 跨域场景下这个参数必须加，否则后端会识别不到正确的请求来源
    pathRewrite: { '^/api': '' } // 如果后端接口本身没有/api前缀，记得用这个配置重写路径
  }
}

注意target后面不要加多余的符号，比如你写的...会直接导致地址无效。

3. 排查端口是否被占用 #

如果后端服务启动失败，大概率是3000端口被其他程序占用了。可以用以下命令查询端口占用情况：

• Windows系统：

netstat -ano | findstr :3000

• macOS/Linux系统：

lsof -i :3000

如果发现端口被占用，要么杀掉占用端口的进程，要么把后端服务改成其他端口，同时更新proxyTable里的target地址。

4. 别忘了重启Vue开发服务器 #

修改完config/index.js里的代理配置后，一定要重启你的Vue开发服务器，不然新的配置不会生效。很多人改完配置忘了重启，导致还是用旧规则，自然连不上后端。

5. 检查防火墙或安全软件拦截 #

有时候本地防火墙、杀毒软件会拦截本地端口的请求，你可以临时关闭防火墙试试，如果能正常代理了，就给3000端口添加一个允许访问的规则即可。

内容的提问来源于stack exchange，提问作者Sylvia