Question

所以我有一个Vue.js网络应用程序，它是在一台PC上开发的，可以随时通过localhost:<portnr>，127.0.0.1:<portnr>或<ip>:<portnr>来访问它。

现在我在另一台PC上工作，并且该项目到目前为止运行正常，问题是，如果我在浏览器中输入localhost或127.0.0.1的网址，则会得到“无法连接错误” 。

如果我在URL中使用PC ip或它的主机名，我可以照常访问该页面。我想知道可能是什么问题。我对网络了解不多，但是由于以前PC可能没有设置主机名，所以我认为这可能是个问题？

通过npm run serve启动项目时，我得到输出

App running at:
  - Local:   http://<host_name>:5050/ 
  - Network: http://<ip>:5050/

在另一台PC上，它用于打印localhost而不是URL上的主机名以进行本地访问。 感谢您提供有关解决此问题的任何提示！

Answer 1

我倾向于看到您的PC上存在本地DNS服务器设置问题。

使用%systemroot%\system32\drivers\etc\hosts或其他编辑器作为notepad打开administrator文件。也许文件看起来像这样：

... ... ...
# localhost name resolution is handled within DNS itself.
#       127.0.0.1       localhost
#       ::1             localhost

如果未将localhost绑定在 Windows

上，则需要取消注释2个底行。

使用/etc/hosts或其他具有nano特权的编辑器打开sudo文件。

您应该获得类似于以下内容的信息。如果没有，请这样。

##
# Host Database
# ... ... ...

127.0.0.1       localhost
255.255.255.255 broadcasthost
::1             localhost

Answer 2

问了这个问题之后，我发现每个遇到类似问题的人都有一个类似的here。

为我总结解决方案的方法是在package.json中的npm run serve命令中添加--host 0.0.0.0 ，使该行如下所示：

"scripts": {
    "serve": "vue-cli-service serve --host 0.0.0.0",
    "build": "vue-cli-service build",
    "lint": "vue-cli-service lint"
  },

此后，运行命令时，输出将更改回显示localhost，我可以通过localhost:<portnr>再次访问该页面。

在执行此简单修复程序时，我看不到任何不利之处。如果有，我将很高兴听到更好的解决方案！