Go后端绑定localhost时，如何实现React应用的代理访问？

问题根源 #

你的Go服务绑定的是localhost:8080，Postman能正常访问是因为它直接在本地发起请求，但React的开发代理（webpack-dev-server）在MacOS下可能因为localhost的解析逻辑差异，无法成功连接到Go服务；而绑定所有接口（:8080）会触发系统防火墙的权限请求，你又没有管理员权限处理。

几个简便的解决办法 #

1. 把Go服务绑定到127.0.0.1而非localhost #

修改Go代码里的监听地址：

log.Fatal(http.ListenAndServe("127.0.0.1:8080", api.router))

React的package.json里的proxy配置可以保持不变，或者也改成http://127.0.0.1:8080，两种都能绕开防火墙权限提示，同时让代理正常工作。

2. 手动配置React代理 #

如果上面的方法没用，试试用http-proxy-middleware手动配置代理，避免默认proxy的解析问题：

• 先安装依赖：

npm install http-proxy-middleware --save-dev

• 在src目录下新建setupProxy.js，写入：

const { createProxyMiddleware } = require('http-proxy-middleware');

module.exports = function(app) {
  app.use(
    '/login', // 匹配需要代理的接口路径
    createProxyMiddleware({
      target: 'http://127.0.0.1:8080',
      changeOrigin: true,
    })
  );
};

这种方式更灵活，也能解决默认proxy的连接问题。

3. 直接在请求里用127.0.0.1地址 #

干脆跳过proxy配置，直接在React的请求代码里写完整的服务地址：

fetch('http://127.0.0.1:8080/login', {
  method: 'POST',
  // 你的请求参数、header等配置
})

这种方式不需要依赖代理，直接连接Go服务，也不会触发防火墙的权限提示。

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