web-dev-qa-db-fra.com

Comment envoyer une requête HTTP avec un paramètre d'en-tête?

Je suis très nouveau dans le domaine du javascript et de la programmation Web en général et j'ai besoin d'aide pour cela. J'ai une requête HTTP que je dois envoyer via javascript et obtenir le besoin de stocker le résultat dans une variable. J'ai essayé d'utiliser uniquement l'URL d'appel:

https://api.fantasydata.net/nfl/v2/JSON/PlayerSeasonStats/2015

Mais cela renvoie une erreur d'authentification parce que je n'ai pas envoyé ma clé API et ne me montre pas comment le faire uniquement dans l'URL. La clé API est listée comme un en-tête et non comme un paramètre et je ne sais pas quoi faire avec cela. J'ai essayé d'utiliser la classe XMLHttpRequest () mais je ne suis pas sûr de bien comprendre ce qu'il fait ni de le faire fonctionner. 

La demande HTTP réelle 

GET https://api.fantasydata.net/nfl/v2/JSON/PlayerSeasonStats/2015 HTTP/1.1
Host: api.fantasydata.net
Ocp-Apim-Subscription-Key: ••••••••••••••••••••••••••••••••

Je dois juste comprendre comment envoyer cette demande avec la clé et comment stocker le document JSON renvoyé sous forme de variable javascript. 

EDIT: C'est ce que j'ai jusqu'à présent:

function testingAPI(){
var key = "8a1c6a354c884c658ff29a8636fd7c18";
httpGet("https://api.fantasydata.net/nfl/v2/JSON/PlayerSeasonStats/2015",key    );
alert(xmlHttp.responseText);
var x = 0;
}

function httpGet(theUrl,key)
{
var xmlHttp = new XMLHttpRequest();

xmlHttp.open( "GET", theUrl, false ); // false for synchronous request
xmlHttp.setRequestHeader("Ocp-Apim-Subscription-Key",key);
xmlHttp.send( null );
return xmlHttp.responseText;
}

Je vous remercie!

8
Faraz Ahsan

S'il indique que la clé d'API est répertoriée sous la forme d'un en-tête, vous devez probablement la définir dans l'option headers de votre demande http. Normalement, quelque chose comme ça:

headers: {'Authorization': '[your API key]'}

Voici un exemple tiré d'un autre Question

$http({method: 'GET', url: '[the-target-url]', headers: {
  'Authorization': '[your-api-key]'}
});

Edit: Vous venez de voir que vous vouliez stocker la réponse dans une variable. Dans ce cas, j'utiliserais probablement AJAX. Quelque chose comme ça :

$.ajax({ 
   type : "GET", 
   url : "[the-target-url]", 
   beforeSend: function(xhr){xhr.setRequestHeader('Authorization', '[your-api-key]');},
   success : function(result) { 
       //set your variable to the result 
   }, 
   error : function(result) { 
     //handle the error 
   } 
 }); 

Je viens de cette question et je suis au travail, donc je ne peux pas le tester pour le moment, mais j'ai l'air solide

Edit 2: Je suis sûr que vous devriez pouvoir utiliser cette ligne:

headers: {'Authorization': '[your API key]'},

au lieu de la ligne beforeSend dans la première édition. Cela peut être plus simple pour vous

6
Danny H

Avec votre propre Code et un Légère modification sans jQuery

function testingAPI(){ 
    var key = "8a1c6a354c884c658ff29a8636fd7c18"; 
    var url = "https://api.fantasydata.net/nfl/v2/JSON/PlayerSeasonStats/2015";
    console.log(httpGet(url,key)); 
}


function httpGet(url,key){
    var xmlHttp = new XMLHttpRequest();
    xmlHttp.open( "GET", url, false );
    xmlHttp.setRequestHeader("Ocp-Apim-Subscription-Key",key);
    xmlHttp.send(null);
    return xmlHttp.responseText;
}

Je vous remercie

0
Shashank