如何拥有动态 .env 文件而不是硬编码的 localhost？答案

【问题标题】：How to have dynamic .env files instead of hard coded localhost?如何拥有动态 .env 文件而不是硬编码的 localhost？
【发布时间】：2021-02-03 15:55:57
【问题描述】：

我有 2 个.env 文件（一个用于 Vue，一个用于 Laravel）。他们两个都有localhost里面的硬编码。这意味着我无法从网络上的另一台计算机访问我的应用程序。如果是动态的就好了（生产除外）

例如，如果我转到我的另一台 PC 并通过 http://192.168.1.100:47344 访问我的站点，那么它将无法正常工作，因为它被硬编码为 localhost（尤其是前端调用）。

但我不能在 .env 文件中编写 javascript 或 PHP 来将 localhost 更改为 window.location.host 和 PHP $_SERVER['SERVER_ADDR']。我找不到解决方案..

我的 Vue .env

VITE_SERVER_URL=http://localhost:41166
VITE_APP_ENV=dev

还有我的 Laravel .env

APP_ENV=local
APP_CLIENT_URL=http://localhost:47344
APP_URL=http://localhost:41166

【问题讨论】：

如果您的意思是要从其他计算机访问您的服务器，您可以使用 0.0.0.0 而不是 localhost。这意味着服务器将侦听所有网络接口，不仅是虚拟环回网络接口（又名 localhost），还包括将您连接到局域网的真实网络接口。
@BoukeVersteegh 你的意思是把 0.0.0.0 放在 javascript 中？
您可以给您的开发服务器一个假域名（例如，mylocalserver.com），然后使用每个设备上的主机文件相应地重定向流量（服务器上的本地主机/外部设备上的 IP） .
@matticustard 是的，我可以给它一个域名，但这意味着每个用户都需要设置他们的主机文件。不理想。
另一个不理想且非常肮脏的解决方法是将 localhost 临时更改为 192.168.1.100 之类的东西 - 但这远非完美。

标签： javascript php laravel vue.js

【解决方案1】：

即使您的应用程序 url 设置为 localhost，只要没有防火墙限制，该应用程序仍然可以访问。您也可以通过127.0.0.1 或分配给您机器的本地IP 地址访问它。

获取本地 IP 地址的方式取决于您的系统，但您可以在 node 控制台中运行它

const { networkInterfaces } = require("os");
const nets = networkInterfaces();

for (const name of Object.keys(nets)) {
  for (const net of nets[name]) {
    if (net.family === "IPv4" && !net.internal) {
      console.log({name , address: net.address});
    }
  }
}

请注意，如果您在 docker 中运行此设置，则可能需要设置为 0.0.0.0，因为 127.0.0.1 是环回主机。

【讨论】：