XMLHttpRequest kann 'URL' nicht laden. Antwort für Preflight hat ungültigen HTTP-Status-Code 401

Question

Ich arbeite an ionischen. und habe diesen Fehler bekommen. Hier sind meine app.js:

var app = angular.module('eMoMo', ['ionic', 'ngCordova']) 
.config(['$httpProvider', function ($httpProvider) { 
     //Reset headers to avoid OPTIONS request (aka preflight) 
     $httpProvider.defaults.headers.common = {}; 
     $httpProvider.defaults.headers.post = {}; 
     $httpProvider.defaults.headers.get = {}; 
     $httpProvider.defaults.headers.delete = {}; 
     $httpProvider.defaults.headers.put = {}; 
     $httpProvider.defaults.headers.patch = {}; 
     $httpProvider.defaults.headers.common['Access-Control-Allow-Headers'] = '*';          
     //$httpProvider.defaults.headers.common['Authorization'] = 'Basic ' + btoa(my_id+ ':' + my_pass") 
    }]); 

app.controller('MainViewController', function($scope, $http) { 
    $http({ 
    method:"GET", 
    url: "my_url" 
     headers: { 
     'content-type': 'application/x-www-form-urlencoded; charset=utf-8', 
     'authorization': 'Basic ' + btoa('my_username' + ':' + 'my_pass') 
     'access-control-allow-origin': '*' 
    } 
    }).then(function(categories){ 
    console.log(categories); 
    }); 

}); 

app.run(function($ionicPlatform) { 
    $ionicPlatform.ready(function() { 
    if(window.cordova && window.cordova.plugins.Keyboard) { 
     cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true); 
     cordova.plugins.Keyboard.disableScroll(true); 
    } 
    if(window.StatusBar) { 
     StatusBar.styleDefault(); 
    } 
    }); 
} 

)

ich zu Forschung versuchen, ist es über CORS beziehen, aber ich habe ein Plugin zu installieren, um Chrom diesen Fehler zu deaktivieren. Wie kann ich dieses Problem lösen? ?

Answer 1

Da Sie benutzerdefinierte Header hinzufügen, triggern Sie einen preflight request. Vermutlich steckt Ihr Plug-in nur in eine Antwort, bevor Chrome es verarbeitet. Das hilft nicht, wenn der Server auf die OPTIONS-Anfrage mit einem Fehler reagiert.

Sie haben vier Möglichkeiten:

1. Sicherstellen, dass der Server auf dem gleichen Ursprungs ist, so dass Sie CORS nicht benötigen (dies einen Entwicklungsserver einrichten beinhalten kann, die besser Ihre Live-Umgebung reflektiert)
2. Holen sie sich den Server zu unterstützen CORS
3. ein Plugin finden, die Preflight-Anfragen verarbeiten kann (oder reparieren ein vorhandenes so kann es)
4. Ihren Code ändern, damit es nicht erzeugen ist ein Preflight-Anfrage

Ein Ausgangspunkt für die Option 4 wäre zu entfernen:

$httpProvider.defaults.headers.common['Access-Control-Allow-Headers'] = '*';          

und

'access-control-allow-origin': '*' 

... da Access-Control-Allow-Origin und Access-Control-Allow-Header sind Antwort Header und machen auf eine Anfrage überhaupt keinen Sinn.

Sie können immer noch Probleme mit Ihrem manuellen Hinzufügen eines Autorisierungsheaders obwohl.

Answer 2

im Allgemeinen 401 bezieht sich auf eine nicht autorisierte Anfrage.

1. Pls Ihrem Passwort und Benutzernamen überprüfen,
2. wenn beide korrekt sind dann die destiantion Server tut btoa Codierung von Ihren Benutzernamen und passwoord akzeptieren. Versuchen BaseConverter64 Codierung