Angular js读取环境变量

Question

我试图在http get调用中读取环境变量

$http.get('http://'  + $location.host() + ':8080/api')

我希望能够读取environmen变量并将其用作上面API调用中的http rest服务器,如下所示

 $http.get('environmental_variable ':8080/api')

注意:我不知道环境变量直到运行时因此我不能将值作为常量使用

Answer 1

有许多示例说明如何将设置放入不同的文件或常量中。这些工作大多数都可以，但是遗漏了重点。

您的配置设置不是代码的一部分！

除了“ Hello World”示例外，还应由CI / CD服务器执行部署，这应负责设置配置设置。这有很多好处：

1）您正在将相同的代码部署到不同的环境。如果将代码部署到测试环境，则要将相同的代码部署到生产环境。如果服务器必须重建代码，以添加生产配置设置，那么您将部署其他代码。

2）无需共享您的API详细信息，AWS设置和其他机密信息，即可共享代码。

3）它允许轻松添加新环境。

Answer 2

浏览器中没有环境变量之类的东西。

该$location服务始终会获取您当前的 URL。我猜你的 API 可能位于不同的主机上。

可以通过将配置存储在 Angular 常量中来模拟环境变量。

app.constant('env', {
  API_URL: "http://someurl.com:8080/api"
});

然后您可以将此常量注入到其他提供程序中。

app.controller('MyController', function($http, env) {  
  $http.get(env.API_URL);
});

这是一篇关于常量最佳实践的不错的文章。本文赞成不使用常量，因为无需重建代码即可修改配置，这很有用。

我通常处理此问题的方法是将所有实例配置详细信息移至文件中，然后在引导应用程序时config.json加载它。$http

例如，您可能有一个像这样的配置文件。

{
  apiUrl: "http://someurl.com:8080/api"
}

然后是加载它的 Angular 服务。

app.service('Config', function($http) {
  return function() {
    return $http.get('config.json');
  };
});

然后其他服务就可以得到承诺，这将在解析时公开配置。

app.controller('MyController', function($http, Config) {
  Config()
    .then(function(config) {
      $http.get(config.apiUrl);
    });
});