Как вы передаете HTTP-заголовки, чтобы сделать запрос от API?

0

Используя Angular, я пытаюсь передать HTTP-заголовки с запросом "App-Id" и "App-Key" для получения данных из этого API.

Я попытался настроить заголовки следующим образом:

 $http.defaults.headers.common["App-Id"] = '5a3d8b8d';
 $http.defaults.headers.common["App-Key"] = '738e9aca62e7465446b7be8fe4219ffa';

но я получил Response for preflight is invalid ошибка.

http://jsfiddle.net/9Ymvt/4573/

  • 0
    Squirrl: как вам удалось получить свой App-Id и App-Key? Я не могу понять это в моем аккаунте ...
Теги:
http

3 ответа

1
Лучший ответ

Добавление заголовков в $http запрос на основе запроса

Чтобы добавить заголовки в запрос $http для каждого запроса, добавьте их в свойство headers объекта $http config.

var xheaders = {};
xheaders["App-Id"] = '5a3d8b8d';
xheaders["App-Key"] = '738e9aca62e7465446b7be8fe4219ffa';

var xurl = 'https://uk.bookingbug.com/api/v1';
var configObj = { method: 'GET',
                  url: xurl, 
                  headers: xheaders
                };
$http(configObj)
    .then(function onFulfilled(response) {
        console.log(response);
        vm.headers = response.config.headers;
        vm.data = response.data
    }).catch( function onRejection(errorResponse) {
        console.log("Error: ", errorResponse.status);
        console.log(errorResponse);
        vm.error = errorResponse;
    })
;

В коде были ошибки перед полетом, потому что он использовал неправильный URL. Правильный базовый URL-адрес - https://uk.bookingbug.com/api/v1 который поддерживает заголовки App-Id и CORS.

ДЕМО на JSFiddle.

  • 0
    Да, я получил это в конечном итоге сам. Как вы могли бы сказать, что это был правильный URL? Для меня это было в основном методом проб и ошибок.
1

Я не думаю, что это полный ответ на ваш вопрос, но вот что я имею в своем проекте:

var app = angular.module('app', ['ngRoute']);
app.config(function($routeProvider) {
  // code for routes
});
app.config(['$httpProvider', function($httpProvider) {
  $httpProvider.defaults.useXDomain = true;
  delete $httpProvider.defaults.headers.common['X-Requested-With'];
}]);

Это решает мою проблему с CORS. Если вы хотите сделать другой тип заголовка, вы, вероятно, найдете свой ответ здесь.

1

Ошибки перед полетом связаны с CORS. Возможно, вам захочется взглянуть на стойку, чтобы включить межсайтовые вызовы api через javascript. Здесь есть ручная настройка: https://gist.github.com/dhoelzgen/cd7126b8652229d32eb4

Ещё вопросы

Сообщество Overcoder
Наверх
Меню