AngularJS远程客户端属性共享给控制器/服务

Question

我想开发一个AngularJS的Web客户端，其REST后端可能位于不同的服务器上。所以基本上我正在考虑在前端有一个属性输入字段，对于每个会话，我将在其中输入基本的 REST url（例如，http://localhost:8080/backend/rest/ ）

是否有某种最佳实践能够在所有控制器/工厂/服务之间共享基本 URL，以便将其包含在所有$http请求中？

Answer 1

我会配置一个 HTTP 请求拦截器服务，该服务只是将值附加到传递给$http服务的 URL 前面。类似于以下内容（未测试）：

// register the interceptor as a service
$provide.factory('pathPrependerInterceptor', function() {
    var _path = 'http://localhost:8080/backend/rest'; // default value
    return {
        request: function(config) {
            config.url = _path + config.url
            return config;
        },
        setPath: function(path) {
            _path = path;
        }
    }
});
$httpProvider.interceptors.push('pathPrependerInterceptor');

Answer 2

我认为最简单的方法是使用 interceptors 来完成这一点。您可以在 AngularJs 文档中阅读有关此主题的更多信息。

这个想法是设置一个拦截器，它将在每个请求中预附加基本 url，如下所示：

var app = angular.module('MyApp',[]);
app.config(['$httpProvider', function($httpProvider) {
    $httpProvider.interceptors.push(function($q) {
        return {
            'request': function(config) {
                config.url = "http://api.openweathermap.org/data/2.5/" + config.url
                return config;
            }
        };
    });
}]);

我希望你有一个想法。

JSFiddle包含了这个想法。

Answer 3

其他答案来自更有经验的一群人，所以请对此持保留态度，但对我来说似乎有些矫枉过正。您正在配置需要注入的应用程序范围的变量。用

module.value("baseRestUrl", ...)

允许您在任何需要的地方注入baseRestUrl。