$ http Auth Headers в AngularJS

Ответ 1

Вы смешиваете варианты использования; ($http) не могут использоваться в фазе конфигурации, тогда как провайдеры не будут работать в блоках запуска. Из docs:

• Блоки конфигурации - [& hellip;] Можно вводить только поставщиков и константы в конфигурационные блоки. Это делается для предотвращения случайного создания экземпляра услуг, прежде чем они будут полностью настроены.
• Запустить блоки - [& hellip;] Только экземпляры и константы могут быть введены в run блоки. Это необходимо для предотвращения дальнейшей конфигурации системы во время время выполнения приложения.

Поэтому используйте одно из следующих действий:

app.run(['$http', function($http) {
    $http.defaults.headers.common['Authorization'] = /* ... */;
}]);

app.config(['$httpProvider', function($httpProvider) {
    $httpProvider.defaults.headers.common['Authorization'] = /* ... */;
}])

Ответ 2

Вы можете использовать его в контроллере:

.controller('Controller Name', ['$http', function($http) {
   $http.defaults.headers.common['Authorization'] = 'Basic ' + login + ':' + password;
}]);

Ответ 3

У меня есть служба factory, у которой есть перехватчик запросов angular, например:

var module =  angular.module('MyAuthServices', ['ngResource']);

module
    .factory('MyAuth', function () {
    return {
        accessTokenId: null
    };
})    
.config(function ($httpProvider) {
    $httpProvider.interceptors.push('MyAuthRequestInterceptor');
})

.factory('MyAuthRequestInterceptor', [ '$q', '$location', 'MyAuth',
    function ($q, $location, MyAuth) {
        return {
            'request': function (config) {


                if (sessionStorage.getItem('accessToken')) {

                    console.log("token["+window.localStorage.getItem('accessToken')+"], config.headers: ", config.headers);
                    config.headers.authorization = sessionStorage.getItem('accessToken');
                }
                return config || $q.when(config);
            }
            ,
            responseError: function(rejection) {

                console.log("Found responseError: ", rejection);
                if (rejection.status == 401) {

                    console.log("Access denied (error 401), please login again");
                    //$location.nextAfterLogin = $location.path();
                    $location.path('/init/login');
                }
                return $q.reject(rejection);
            }
        }
    }]);

Затем при входе в мой контроллер входа я храню accesstoken, используя эту строку:

sessionStorage.setItem('currentUserId', $scope.loginResult.user.id);
sessionStorage.setItem('accessToken', $scope.loginResult.id);
sessionStorage.setItem('user', JSON.stringify($scope.loginResult.user));
sessionStorage.setItem('userRoles', JSON.stringify($scope.loginResult.roles));

Таким образом, я могу назначить заголовки запросу по каждому запросу, сделанному после входа в систему. Это именно так, как я это делаю, и полностью готов к критике, но, похоже, он работает очень хорошо.

Ответ 4

В angularjs documentation вы можете увидеть некоторые способы установки заголовков, но я думаю, что это то, что вы ищете:

$http({
    method: 'POST',
    url: '/theUrl',
    headers: {
        'Authorization': 'Bearer ' + 'token'
         //or
         //'Authorization': 'Basic ' + 'token'
    },
    data: someData
}).then(function successCallback(response) {
    $log.log("OK")
}, function errorCallback(response) {
    if(response.status = 401){ // If you have set 401
        $log.log("ohohoh")
    }
});

Я использую эту структуру в моем клиенте angularjs с сервером ASP.NET 5, и он работает.

Ответ 5

В $http doc вы можете увидеть, что вы должны установить заголовки по умолчанию, используя $httpProvider:

.config(['$httpProvider', function($httpProvider) {
    $httpProvider.defaults.headers.common['Authorization'] = 'Basic auth';
}]);

Ответ 6

ПРИМЕР РАБОТЫ: Я узнал об этом от @MrZime - Спасибо! и прочитайте https://docs.angularjs.org/api/ng/service/$ http # setting-http-headers

Последняя версия NGULARJS v1.6.x от 2 марта 2018 года

        var req = {
            method: 'POST',
            url: 'https://api.losant.com/applications/43fdsf5dfa5fcfe832ree/data/last-value-query',
            headers: {
                'Authorization': 'Bearer ' + 'adsadsdsdYXBpVG9rZW4iLCJzrdfiaWF0IjoxNdfsereOiJZ2V0c3RfdLmlvInfdfeweweFQI-dfdffwewdf34ee0',
                'Accept': 'application/json',
                'Content-Type': 'application/json'
            },
            data: {
                "deviceIds": [
                    "a6fdgdfd5dfqaadsdd5",
                    "azcxd7d0ghghghghd832"
                ],
                "attribute": "humidity"
            }
        }




        $http(req).then(function successCallback(response) {

            $log.log("OK!")
             returnedData = response.data

        }, function errorCallback(response) {

            if (response.status = 401) { // If you have set 401

                $log.log("BAD 401")

            }
            else {

                $log.log("broken at last")

            }
        });

Добавьте его в ваш файл .js и включите этот файл your.js в файл your.html и посмотрите на панель консоли в debug/F12 в chrome, вы должны получить статус "ОК", а "возвращенные данные" - это то, что вам нужно в конце. Наслаждайтесь данными!

Ответ 7

Попробуйте base64, кодирующий вашего пользователя: пароль, прежде чем добавлять его к "Basic", как в:

headers: {
  'Authorization': "Basic " + auth64EncodedUserColonPass
}

Ответ 8

добавьте строку ниже в вашем методе aap.run

$http.defaults.headers.common.Authorization = 'Basic YmVlcDpib29w';