Call a website and grab text using javascript(api?)

Question

I am trying to use this website: https://api.mojang.com/users/profiles/minecraft/[VARIABLE_HERE] (use https://api.mojang.com/users/profiles/minecraft/Minecraftiscewl as an example)

I want to change the variable based on user input, and grab the text from the page:

{"id":"36c84ed1708a4fc1b31e031bf1511de6","name":"[TEXT_HERE]"}

Can I do this with javascript(and how), or do I need to use PHP?

say I enter this: https://api.mojang.com/users/profiles/minecraft/that_sam_guy I want to retrieve this from it: "Minecraftiscewl" — Boe6Eod7Nty, Jul 17 '15 at 20:45

score 1 · Answer 1 · edited May 23 '17 at 10:26

The answer at How to make an AJAX call without jQuery? shows you how to do this.

Basically you make an XMLHTTPRequest to that URL, expecting application/json as an accept type. You then pull it into the JS using JSON.parse to convert the incoming data as a JS object. You can then interact with it normally.

<script type="text/javascript">
function loadXMLDoc() {
var xmlhttp;

if (window.XMLHttpRequest) {
    // code for IE7+, Firefox, Chrome, Opera, Safari
    xmlhttp = new XMLHttpRequest();
} else {
    // code for IE6, IE5
    xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}

xmlhttp.onreadystatechange = function() {
    if (xmlhttp.readyState == XMLHttpRequest.DONE ) {
       if(xmlhttp.status == 200){
           document.getElementById("myDiv").innerHTML = xmlhttp.responseText;
       }
       else if(xmlhttp.status == 400) {
          alert('There was an error 400')
       }
       else {
           alert('something else other than 200 was returned')
       }
    }
}

xmlhttp.open("GET", "https://api.mojang.com/users/profiles/minecraft/[VARIABLE_HERE]", true);
xmlhttp.send();

}

There's a number of ways of interacting with the XMLHTTPRequest object (See: https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest). Alternatively, you can also use jQuery as stated in the answer if you already have it loaded for other purposes.

The object resulting from the JSON.parse() call would simply be exactly the JSON you posted, so you would do something like:

var playerData = JSON.parse(dataFromAjaxCall);
console.log(playerData.name); //[TEXT_HERE]

Call a website and grab text using javascript(api?)

1 Answers1