Żądanie API Vimeo z AngularJs "Wymagana autoryzacja 401" - javascript, ajax, angularjs, vimeo-api

Próbowałem wywołać zewnętrzny interfejs API (Vimeo)z mojego kodu AngularJS, używając $ http.jsonp. Ale dostaję tylko wymaganą autoryzację 401, mimo że dodałem mój klucz autoryzacyjny do nagłówka. miał podobny problem, robiąc to samo z jQuery.ajax (). Ale z jQuery i rozwiązałem problem, ustawiając funkcję beforeSend, aby ustawić mój klucz autoryzacyjny na nagłówku żądania za pomocą obiektu xhr.

Mój kod:

function(){
var config = {
headers: {Authorization: "bearer 34210aeac4e02a251b8821a53620e93c"},
params : {
callback: "JSON_CALLBACK"
}
};
var url = "https://api.vimeo.com/tags/fun/videos?per_page=5";
$http.jsonp(url, config).success(function(response){
console.log(response);
});
};

Jak mogę to uruchomić? Czy jest to plik config.beforeSend, którego można użyć do ustawienia nagłówka, tak jak jQuery

Odpowiedzi:

W kanciastym można użyć przechwytujący http

1. Zdefiniuj przechwytywacz HTTP: ten doda token na każde żądanie http

   ng.module("interceptors")
   .factory("authorizationInterceptor", function () {
   return {
   request: function (config) {
   config.headers = config.headers || {};
   config.headers.Authorization = "Bearer " +  "34210aeac4e02a251b8821a53620e93c";
   return config;
   }
   };});
   

2. zarejestruj swój interceptor

   angular.module("myApp",[]).config(["$httpProvider",function ($httpProvider) {
   $httpProvider.interceptors.push("authorizationInterceptor");
   $httpProvider.defaults.headers.common["X-Requested-With"] = "XMLHttpRequest";
   }]);
   

Uwaga, myślę, że pierwsza litera okaziciela musi być wielką literą w nagłówku

Nie znam zbyt dobrze Angulara, ale myślę, że problem polega na tym, że ty go używasz JSONP. Ponieważ używa tagu skryptu przeglądarki, aby obejść ograniczenia CORS, nie pozwala na czasowniki inne niż GET ani ustawianie nagłówków.

Interfejs API Vimeo obsługuje nagłówki CORS, więc faktycznie chcesz utworzyć regularne żądanie GET przy użyciu funkcjonalności przeglądarki AJAX. Wierzę, że AngularJS zapewnia to za pomocą $http.get funkcja do robienia tego, co aktualnie robisz (docs).

Chciałbym wypróbować:

function(){
var config = {
headers: {Authorization: "Bearer 34210aeac4e02a251b8821a53620e93c"}
};
var url = "https://api.vimeo.com/tags/fun/videos?per_page=5";
$http.get(url, config).success(function(response){
console.log(response);
});
};