web-dev-qa-db-fra.com

Comment attribuer un en-tête d'authentification de base à XMLHTTPREQUEST?

J'ai lu de nombreuses réponses de contrôle en amont et de CORS, alors ne postez pas de liens faisant référence à ce que je devrais lire. Beaucoup de réponses sont du point de vue du serveur, mais je suis le client dans ce cas. Dois-je définir l'en-tête Origin? Mon hypothèse est qu'il s'agit d'une simple demande, ai-je raison?

 req.open("POST", url, true);
 req.setRequestHeader( 'Content-Type',   'application/blahblah' );
 req.setRequestHeader( 'Accept', 'application/blahblah' );
 req.setRequestHeader("Authorization", "Basic " + btoa(user + ":" + pass)); 
 req.send();

Pourtant, cela ne fonctionne toujours pas, mon erreur:

La réponse à la demande de contrôle en amont ne passe pas la vérification du contrôle d'accès: aucun en-tête "Access-Control-Allow-Origin" n'est présent sur la ressource demandée. L'origine 'null' n'est donc pas autorisée à accéder. La réponse avait le code d'état HTTP 500.

javascriptrestful-authenticationxmlhttprequest
14
carrots

Solution:

req.setRequestHeader('Authorization', 'Basic [base64 encoded password here]' );
8
carrots

Si vous souhaitez définir l'en-tête d'autorisation

req.setRequestHeader('Authorization','Basic ' + Base64StringOfUserColonPassword);
17
epascarello

Ce message est ancien, mais répond à quiconque le rencontre.

Il n'y a rien de mal avec votre en-tête d'autorisation. Le problème auquel vous êtes confronté est lié à CORS.

Vous ne définissez pas l'en-tête Origin vous-même. Le navigateur le fait pour vous. Si votre origine est nulle, je soupçonne que c'est parce que vous exécutez votre code à partir de file:/// au lieu de http://.

5
skinnysoftware

Si vous l'utilisez pour une demande d'API, l'ajout de l'en-tête Authorization obligera d'abord XMLHttpRequest à envoyer une demande OPTIONS, qui peut être refusée par certaines API.

Pour contourner cela, vous pouvez également faire:

var invocation = new XMLHttpRequest();
invocation.open("GET", url, true, username, password);
invocation.withCredentials = true;

Ce qui ajoutera l'en-tête d'autorisation et évitera également la demande de contrôle en amont.

4
Nick Spicer