如何从Angular中的服务器获取配置值?

时间:2016-04-20 15:51:08

标签: angularjs angular-module angular-config

我的应用程序在应用程序启动时需要一些配置值。来自社区的建议是将它们作为常量存储为单独的模块,最好是在单独的.js文件中。这可能对我有用。
但是我的配置值也存储在服务器上,并且不想在客户端复制那些,所以我在考虑通过服务器调用来获取这些值。
我是角色的新手,在模块的配置方法中进行服务器调用是有效的设计实践吗?如果是,那么我应该使用$ http服务从服务器获取值吗?

    var main = angular.module('myapp', ['AdalAngular']);

    main.config(['$stateProvider',$httpProvider, adalAuthenticationServiceProvider', function ($stateProvider,$httpProvider,adalProvider) {

        // $stateProvider configuration goes here

        // ?????CAN I make server call here to get configuration values for adalProvider.init method below???

        adalProvider.init(
            {
                instance: 'someurl', 
                tenant: 'tenantid',
                clientId: 'clientid',
                extraQueryParameter: 'someparameter',
                cacheLocation: 'localStorage',
            },
            $httpProvider
            );

    }]);

    main.run(["$rootScope", "$state", .....
        function ($rootScope, $state,.....) {

            // application start logic

        }]);


    main.factory("API", ["$http", "$rootScope", function ($http, $rootScope) {

        // API service that makes server call to get data

    }]);

EDIT1

因此,根据以下建议,我将继续宣布不断的方法。基本上我将有单独的config.js文件,在部署过程中,我将用相应的基于环境的config.js文件覆盖config.js文件。

问题
如果必须有10个常量,那么我必须将它们分别传递给module.config()。是否可以将常量值声明为JSON对象,并以某种方式在配置函数中读取它,这样我就不会传递10个不同的参数?

angular.module('myconfig', [])
            .constant('CONFIGOBJECT','{Const1:somevalue,Const2:somevalue,Const3:somevalue,Const4:somevalue}');

然后如何读取config方法中的值?

var main = angular.module('myapp',['myconfig']);
main.config(['CONFIGOBJECT',function(CONFIGOBJECT){

 ?? How do I read CONFIGOBJECT value that is a string not json object?

})

3 个答案:

答案 0 :(得分:3)

我将描述我之前正在使用的项目中使用的解决方案。

阶段确实 > config 阶段。 所以我们使用下一个解决方案: 首先,我们用config创建了简单的对象,比如

var config = {
    someConfig1: true,
    someConfig2: false,
    someConfigEvents: {
        event1: 'eventConfig1',
        event2: 'eventConfig2'
    }
    etc...
}

然后我们还用jQuery lib声明了角度值:

app.value('jQuery', jQuery);

现在我们不能使用像$ http这样的服务,但是我们可以使用jQuery,所以我们只是调用配置服务器并扩展我们的配置:

jQuery.ajax("path/to/config", { async: false, cache: false })
   .done(function (data) {
      var response = angular.fromJson(data)
      if (response) {
         angular.extend(config, response.returnData.data);
      } else {
         alert('error');
      }
   })
   .fail(function () {
      alertError();
   })
   .always(function () {
      appInit();
   });

答案 1 :(得分:2)

在配置阶段只有提供商可用,而不是服务。因此,在此阶段您无法使用$ http。

但您可以在执行阶段(在传递给run()的函数中)使用它。

另一种方法是让服务器动态生成一些JavaScript文件,并定义所需的常量。

另一种方法是在构建期间根据服务器端代码读取的某个文件生成这样的JS文件。

答案 2 :(得分:2)

无法将服务注入config部分 您可以将服务注入run部分。

因此,您不能使用 - 例如$http服务从config()内的服务器检索数据,但您可以在run()内部执行,这会初始化提供程序的服务。

另见更完整的答案here

希望这有帮助。

<强>更新

为什么string?你为什么不单纯使用

.constant('CONFIGOBJECT', {Const1:somevalue,Const2:somevalue,Const3:somevalue,Const4:somevalue}

.constant('CONFIGOBJECT', '{Const1:somevalue,Const2:somevalue,Const3:somevalue,Const4:somevalue}'