Javascript 如何发送带有标头参数的 HTTP 请求?

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/34319709/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-23 16:09:01  来源:igfitidea点击:

How to send an HTTP request with a header parameter?

javascriptjsonapihttpcallback

提问by Faraz Ahsan

I'm very new to javascript and web programming in general and I need some help with this. I have an HTTP request that I need to send through javascript and get need to store the output in a variable. I tried using just the call url:

我对 javascript 和 web 编程一般都很陌生,我需要一些帮助。我有一个 HTTP 请求,我需要通过 javascript 发送它,并且需要将输出存储在一个变量中。我尝试只使用通话网址:

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

But it returns an authentication error because I didn't send my API key and it doesn't show me how to do it just in the URL. The API key is listed as a header and not a paramater and I'm not sure what to do with that. I tried using the XMLHttpRequest() class but I'm not quite sure I understand exactly what it does nor could I get it to work.

但它返回一个身份验证错误,因为我没有发送我的 API 密钥并且它没有告诉我如何仅在 URL 中执行此操作。API 密钥被列为标头而不是参数,我不确定该怎么做。我尝试使用 XMLHttpRequest() 类,但我不太确定我完全理解它的作用,也无法让它工作。

The actual HTTP Request

实际的 HTTP 请求

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

I just need to figure out how to send that request along with the key and how to store the JSON doc it returns as a variable in javascript.

我只需要弄清楚如何将请求与密钥一起发送,以及如何存储它作为 javascript 中的变量返回的 JSON 文档。

EDIT: This is what I have so far:

编辑:这是我到目前为止:

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;
}

Thank you!

谢谢!

回答by Danny H

If it says the API key is listed as a header, more than likely you need to set it in the headersoption of your http request. Normally something like this :

如果它说 API 密钥被列为标头,则您很可能需要在headershttp 请求的选项中设置它。通常是这样的:

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

Here is an example from another Question

这是另一个问题的示例

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

Edit :Just saw you wanted to store the response in a variable. In this case I would probably just use AJAX. Something like this :

编辑:刚刚看到您想将响应存储在变量中。在这种情况下,我可能只使用 AJAX。像这样的事情:

$.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 
   } 
 }); 

I got this from this questionand I'm at work so I can't test it at the moment but looks solid

我从这个问题中得到了这个,我正在工作,所以我现在无法测试它,但看起来很可靠

Edit 2:Pretty sure you should be able to use this line :

编辑 2:很确定你应该能够使用这一行:

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

instead of the beforeSendline in the first edit. This may be simpler for you

而不是beforeSend第一次编辑中的行。这对你来说可能更简单

回答by Shashank

With your own Codeand a Slight Changewithou jQuery,

使用您自己的代码和没有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;
}

Thank You

谢谢你