如何为网站中的 JS 变量赋值，具体取决于它是在本地运行还是在生产环境中运行？

Question

我在笔记本电脑上处理网络项目。完成后，我将文件上传到生产环境。每次上传到生产环境时，我都必须确保将 javascript 代码中的各种 URL 更改为生产 URL。例如：

var ping_url = 'http://10.10.128.233'      // locally
//var ping_url = 'http://ping.service.com' // in production

我在代码的不同部分有 3 个这样的网址。我经常忘记在上传到生产之前更改它们，结果我破坏了生产网站。

有没有办法检查我是在笔记本电脑上还是在生产环境中运行网站？

我想写：

if (local) {
  var ping_url = 'http://10.10.128.233'      // locally
}
else {
  var ping_url = 'http://ping.service.com' // in production
}

有什么想法吗？

Answer 1

您始终可以检查 location.hostname 并将其与 'localhost' 或您在笔记本电脑上使用的任何主机名进行比较。例如

var ping_url = ~location.hostname.indexOf('localhost')
    ? 'http://10.10.128.233' : 'http://ping.service.com'

Answer 2

理想情况下，您有一个部署系统，它可以准备和部署您的应用程序，并在此过程中处理环境差异。例如，我偏爱Capistrano。为了部署我的项目，我在命令行上键入cap deploy，它运行构建/打包/配置脚本，将站点上传到服务器，然后在那里运行迁移后脚本。您可以在此过程中部署不同的配置文件，或在此过程中对您的 Javascript 文件进行后处理。有很多不同的方法可以使这种改变坚持下去，都适合不同的目的。

如果您有任何类型的服务器端语言，您可能想要使用以下任何一种：

<?php if (...) : ?>
    var ping_url = '...';
<? else : ?>
    var ping_url = '...';
<?php endif; ?>

或

var ping_url = <?php echo json_encode($config['pingUrl']); ?>;

环境变量在这里非常有用；即在您的 Apache 配置或 .htaccess 文件中，您有类似以下内容：

SetEnv MYAPP_ENVIRONMENT production

在您的应用中，您可以按照以下方式进行操作：

$environment = getenv('MYAPP_ENVIRONMENT') ?: 'development';

然后你进一步决定你的环境是什么。

您必须弄清楚服务器端处理、环境变量和部署时处理的哪种组合最适合您。