无法从Web应用程序连接到localhost:3000

时间:2018-06-18 19:16:49

标签: javascript go webpack vue.js mux

我正在研究一些样板代码,以使VueJS前端与Go-powered后端一起工作(使用gorilla/mux作为路由器):

目前,我似乎一切都在努力。我正在通过Go提供一个静态HTML文件,并使用与Webpack捆绑的Vue提供的东西(目前是webpack-dev-server,而不是物理捆绑包),我有一个奇怪的问题:

在我的浏览器中,Firefox不断告诉我以下内容:

Firefox can’t establish a connection to the server at http://localhost:3000/__webpack_hmr.

然而,当我更改Vue组件并保存它们时,它们会像我期望的那样在浏览器中自动刷新。我真的很困惑,我想,我不知道为什么会这样。

我已经尝试更改我的Go服务器运行的端口,并且它似乎总是在http://localhost:<Go Server Port>/__webpack_hmr处失败连接。

有什么想法?也许有一个我缺少的步骤或者设置比我想象的要复杂。

我是否需要运行Express服务器并使用基于webpack的中间件来修复此错误?如果是这样,如果我使用Go作为后端,这听起来很愚蠢(为什么我会运行两个服务器?)。我做错了吗?

至于Go方面,我已经尝试在不同的端口上运行Go服务器并让webpack服务器在不同的端口上运行,但它始终无法在http://localhost:<Go Server Port>/__webpack_hmr连接。

也许这比我想象的要复杂得多,或者因为它似乎“正常”,我可以放心地忽略这个错误?我不知道。

2 个答案:

答案 0 :(得分:0)

从您的webpack配置和代码库中的任何引用中删除'webpack-hot-middleware/client'。这仅用于热重新加载,因此可以安全地将其删除。

由于您需要热重新加载,因此您应该使用:https://github.com/go-webpack/webpack

  

此模块允许与webpack正确集成,支持在开发中使用适当的资产重新加载以及用于生产缓存的资产哈希。

但是,他们只展示了使用GinIris的示例,因此您可能需要打开一个基于纯net/http的示例的问题(假设这是什么?你正在使用)。

答案 1 :(得分:0)

如果我正确理解你的问题。您的客户端和服务器使用不同的端口,如果是这种情况,那么您将使用CORS(跨源资源共享)请求与客户端 - 服务器进行通信。 请参阅以下链接,希望它能帮助您解决CORS问题(它对我有很大帮助)