2013-11-20 2 views
1

Я не могу установить пользовательский заголовок HTTP, взятый из ngInit в AngularJS.Глобальный набор настраиваемого HTTP-заголовка в AngularJS от ngInit

Я установил переменную с помощью ngInit в HTML:

<div ng-init="myApiKey='valueOfVar'"></div> 

Теперь я хочу использовать эту переменную во всех запросах HTTP. Я попытался установить его в app.config и в контроллере тоже.

  • Если я установил его немедленно, переменная не определена.

  • Если я установил его в функции обратного вызова $scope.$watch, переменная определена, но HTTP-запросы без этого заголовка.

Я установил заголовок с:

$http.defaults.headers.common.Authorization = 'something'; 

(или с помощью $httpProvider, когда в app.config), а затем использовать его в процессе эксплуатации с использованием $resource. Мой код выглядит как [это] [1]

Я попытался установить его в config, в run, в контроллере и в качестве сервиса, но пока ничего не работало. Заранее благодарю вас за любой совет.

Edit: Теперь у меня есть перехватчик:

myApp.config(function ($httpProvider) { 
    $httpProvider.interceptors.push('httpRequestInterceptor'); 
}); 

myApp.factory('httpRequestInterceptor', ['$rootScope', function($rootScope) { 
    return { 
     request: function($config) { 
      $config.headers['Authorization'] = 'Basic ' + $rootScope.apiKey; 
      return $config; 
     } 
    }; 
}]); 

Но $rootscope.apiKey (который установлен в главном контроллере) является undefined при первом вызове. После этого все в порядке (и установлено).

+0

Почему бы не установить его на стороне сервера? – Fals

+0

@Fals Как? Если я хочу использовать эту переменную в Angular, она должна быть установлена ​​в ее js-файлах или нет? – user1023979

ответ

1

OK , поэтому для тех, кто пытается сделать то же самое - Перехватчики были ключевыми (спасибо Fals много), но проблема была с $rootScope.Как я писал в вопросе, когда Interceptor был вызван в первый раз, $rootScope.apiKey еще не был установлен (по последовательным запросам он уже был установлен).

Правильный способ (или Рабочий путь) должен был передать переменную AngularJS не через ngInit, но через $window. Поэтому я добавил к моему HTML код:

<script>window.apiKey = 'myValue';</script> 

, а затем передать его перехватчик точно так же, как $rootScope - Вы можете буквально заменить все вхождения $rootScope в редактировании моего вопроса с $window и теперь он работает - даже для первого запроса!

Еще раз спасибо Fals.

3

Если вы хотите изменить запрос/ответ в AngularJS вы должны сделать, глубоко читать о перехватчик:

  • Угловая JS Веб-сайт: $http

Вы можете позвонить $ HTTP (конфигурации) , где config - это объект с каждой конфигурацией. Там в конфигурации там headers, где вы должны поставить код:

заголовки - {Object} - Карта строк или функций, которые возвращают строки, представляющие HTTP заголовки для отправки на сервер. Если возвращаемое значение функции равно null, заголовок не будет отправлен.

Если Google о перехватчик, вы получите полный список блогов, объясняющих, как использовать его, и предоставление примеров кодов, вот один, который поможет мне некоторое время назад:

Understanding angular $http interceptors

+0

Спасибо. Я почти там, но я не могу получить свой «$ scope» в перехватчик, поэтому я мог бы взять эту переменную из него (из '$ scope'). Когда я помещаю его в качестве аргумента для запроса функции (с '$ config', который работает нормально), это' undefined'. – user1023979

+0

OK - теперь мне, наконец, удалось ввести $ rootScope в, моя переменная установлена, но не в первый раз, вызывается перехватчик. Первый HTTP-запрос без заголовка auth, но другие - все в порядке. Разве вы не знаете, как заставить его работать даже в первый раз? – user1023979

5

следующий код позволит вам перехватывать все HTTP requestes вашего приложения и добавить свойство «язык» в заголовке запроса

angular.module('app', ['ngRoute', 'ngResource']).run(function($http) { 
    $http.defaults.headers.common.language='fr-FR'; 
}); 

мы можем добавить многие свойства в HTTP заголовке

Смежные вопросы