API Key in header?

p5.js Beginners
1

Hi
I’ve been following tutorials for using p5.js to access data through APIs. So far i’ve been getting along fine with the tutorials (Coding Train) but now i’m looking at the Bungie API test (http://destinydevs.github.io/BungieNetPlatform/docs/API-Test) to access stats from the game Destiny 2 and i’m not sure how how to use my Bungie API key. The option to use my own key is there on the API test and I know my key works but I only know how to use a variable to store my key, which becomes part of the url request.

That doesn’t seem possible here. I’ve done some searching and all I could find on Bungies side was this

In a HTTP request, include the following header:

X-API-Key: your-api-key-here

Then I tried a broader search and found some things about having a key stored in something called a header but quickly found myself lost in a bunch of information I wasn’t sure what to make of, but most of it was about making headers in Ajax and JQuery.

Is there a way of including my API key in a header (or any other method) using p5.js?

Thanks

2

Never did anything like that yet. But my guess you can begin w/ these links below: :roll_eyes:

p5js.org/reference/#/p5/httpDo



3

Did some search and maybe reading about the topic in general could help:

You can have it as part of the request, in the header under different tags (not an expert here). In your case, you don’t get to choose where to send it but it will be your API the one that dictates how to use it. Check the documentation, hunt for examples or even sent a short email to the API owners and they could assist you, specially if it is not clear in their documentation. Good luck,

Kf

4

Thanks. I’ll take a look at those links.

I ended up finding this, which I think is what I need but there’s a lot on there that i’m not familiar with so I might need to do some more research.

var apiKey = "YOUR-API-KEY-HERE";

var xhr = new XMLHttpRequest();
xhr.open("GET", "https://www.bungie.net/platform/Destiny/Manifest/InventoryItem/1274330687/", true);
xhr.setRequestHeader("X-API-Key", apiKey);

xhr.onreadystatechange = function(){
 if(this.readyState === 4 && this.status === 200){
  var json = JSON.parse(this.responseText);
  console.log(json.Response.data.inventoryItem.itemName); //Gjallarhorn
 }
}

xhr.send();

Edit -
I’ve been seeing a lot of things about OAuth Authentication, i’m not sure if that is something that needs to be included but I did get an ‘OAuth Authorization URL’ and ‘OAuth client_id’ when I generated my key. I also found this link

Everything seems well documented, so i’m sure the answer is out there somewhere but I could have the answer staring me in the face and wouldn’t even know.

1 Like