Gatsby 错误 [HPM] 尝试将请求 / 从 localhost:8000 代理到 http://localhost:4000 时发生错误(ECONNREFUSED)

Posted

技术标签:

【中文标题】Gatsby 错误 [HPM] 尝试将请求 / 从 localhost:8000 代理到 http://localhost:4000 时发生错误(ECONNREFUSED)【英文标题】:Gatsby error [HPM] Error occurred while trying to proxy request / from localhost:8000 to http://localhost:4000 (ECONNREFUSED) 【发布时间】:2019-11-11 04:50:41 【问题描述】:

使用此 Starter 开发 Gatsby 应用程序 https://github.com/the-road-to-react-with-firebase/react-gatsby-firebase-authentication

当我在运行 Gatsby Develop 后尝试访问我的页面时,更新我的节点包后,我不断收到此 HPM 错误。该项目编译成功,但随后我在浏览器中收到此错误,但没有任何显示。

尝试代理时出错:localhost:8000/

这个在终端:

error [HPM] 尝试将请求 / 从 localhost:8000 代理到 http://localhost:4000 时出错(ECONNREFUSED

一旦我从 gatsby-config.js 文件它可以工作并且在浏览器中生成的页面:

module.exports = 
    developMiddleware: app => 
        app.use(
            proxy(
                target: "http://localhost:4000",
            )
        )
    ,

但是,我在终端中收到此错误:

在“/404.html”中加载页面查询结果时出错。查询未运行,也未找到缓存结果。 找不到页面/404.html

我想知道代理为什么不工作以及上面的模块导出到底在做什么。我觉得我正在做的这种解决方法不好。任何帮助或建议都会很棒!

Github 回购:

GitHub Repo for The project

【问题讨论】:

【参考方案1】:

在尝试使用 VS Code 和 WSL2 Ubuntu-20.04 环境调试 Angular 和 Node.js 时,我确实遇到了相同的错误 ECONNREFUSED。显然,这是通过添加不推荐使用的 useWSL 标志解决的


  "type": "node",
  "request": "launch",
  "name": "Launch Node Express via NPM",
  "runtimeExecutable": "npm",
  "useWSL": true,
  "runtimeArgs": ["run-script", "node:debug"],
  "port": 9229
,

【讨论】:

【参考方案2】:

该错误意味着http://localhost:4000 上没有运行任何内容。您的设置似乎存在一些问题:

首先,您的 developMiddleware 设置指向 http://localhost:4000,但您的服务器 (server.js) 默认运行在 http://localhost:3000。也许您忘记启动服务器,或者在错误的端口启动它?

其次,如果我没看错的话,在您的代理中间件中,您将每条路由都代理到端口 4000 吗?这将使盖茨比毫无用处。下面是一个更好的代理设置示例:

module.exports = 
  developMiddleware: app => 
    app.use(
      "/api",
      proxy(
        target: "http://localhost:4000",
      )
    )
  ,

这样,只有对localhost:8000/api 的请求将被代理到localhost:4000

希望对你有帮助!

【讨论】:

感谢 Derek def 的帮助。我只是在更新我的包和重构代码时感到困惑。服务器正在运行,代理正在运行。

以上是关于Gatsby 错误 [HPM] 尝试将请求 / 从 localhost:8000 代理到 http://localhost:4000 时发生错误(ECONNREFUSED)的主要内容,如果未能解决你的问题,请参考以下文章

与前端和后端的错误通信(Java - Angular)

gatsby-source-wordpress 插件:我无法将数据从 WP 拉入 Gatsby(连接错误)

从 Gatsby JS 制作 Axios post Req

Angular 代理 HTTPs

Gatsby 错误无法读取 null 的“固定”属性

未捕获的类型错误:无法使用 Gatsby 和 graphQl 读取未定义的属性“数据”