-6

I am trying to do this on client side using JavaScript.

Question: How to access JSON stored within https://www.instagram.com/xsolvesoftware/media/ with JavaScript and turn it into Object?

I tried xmlHttpRequest

function httpGet(theUrl)
{
    var xmlHttp = new XMLHttpRequest();
    xmlHttp.open( "GET", theUrl, false ); // false for synchronous request
    xmlHttp.send( null );
    return xmlHttp.responseText;
}
 var data = httpGet("https://www.instagram.com/xsolvesoftware/media/");
 console.log(data);

I have tried loading it with src but it obviously doesn't work as it works only on content inside of tags:

var jsonData = JSON.parse(document.getElementById('data').textContent)
<script id="data" type="application/json" src="https://www.instagram.com/xsolvesoftware/media/">
</script>

I have tried editing this example but it uses JSONP not JSON as a reply and i think i would get JSONP only if i would use registered with access to users content:

var token = '1362124742.3ad74ca.6df307b8ac184c2d830f6bd7c2ac5644',
    num_photos = 10,
    container = document.getElementById( 'rudr_instafeed' ),
    scrElement = document.createElement( 'script' );
 
window.mishaProcessResult = function( data ) {
 for( x in data.data ){
  container.innerHTML += '<li><img src="' + data.data[x].images.low_resolution.url + '"></li>';
 }
}
 
scrElement.setAttribute( 'src', 'https://api.instagram.com/v1/users/self/media/recent?access_token=' + token + '&count=' + num_photos + '&callback=mishaProcessResult' );
document.body.appendChild( scrElement );
<ul id="rudr_instafeed"></ul>
AESTHETICS
  • 989
  • 2
  • 14
  • 32
  • I am trying to access JSON stored in this link https://www.instagram.com/xsolvesoftware/media/ – AESTHETICS Aug 03 '17 at 19:33
  • I have tried XNLhttpRequest but with no luck. I have tried loading it via src as well but it did not work. – AESTHETICS Aug 03 '17 at 19:34
  • I was told it is not possible to do using JavaScript on client side. – AESTHETICS Aug 03 '17 at 19:34
  • I don't think i am supposed to create application token and access it via requests as it wasn't said + it requires user to agree of using images of given application – AESTHETICS Aug 03 '17 at 19:36
  • This is what i read and understood but no solution to given problem. – AESTHETICS Aug 03 '17 at 19:37
  • 1
    The downvotes aren't mine, but I suspect you'd get less of them if you just clearly stated what you're trying to do, the code you're trying to do it with, and the result you're getting and if you omitted stuff like "What is the point?," "This makes no sense!," "This is completely pointless," and "Like srsly!" – reirab Aug 03 '17 at 19:37
  • I know but i already asked this different and no one has given me solution so i just got annoyed and asked open question of what is the point of it? – AESTHETICS Aug 03 '17 at 19:38
  • Question is.. How to access JSON within this link/path instagram.com/xsolvesoftware/media with JavaScript so i can use it on client side by just turning it into object. – AESTHETICS Aug 03 '17 at 19:39
  • My question - What exactly isn't working and how? I don't see where you specify what the error is or what wrong output you have or anything. – takendarkk Aug 03 '17 at 20:06
  • I can not assign JSON at given link to variable and use it as an object. – AESTHETICS Aug 03 '17 at 20:07
  • I don't think you want to share that token value.. if it is an OAuth Token. Read.. If successful, this call will return a neatly packaged OAuth Token that you can use to make authenticated calls to the API. We also include the user who just authenticated for your convenience: – Donald Powell Aug 03 '17 at 20:08

1 Answers1

-1

have you already tried it? What is you concrete problem? If you have already tried, you could provide some code snippets and explain what you are struggeling with? (edit: you edited the question and added some code snippets, I'll have a look at them now)

From the distance it sounds like you are running into the CORS trap. You need a backend service that fetches the json for you running on the same origin as you page is served from. This answer is a good starting point :)

Hope this helps.

edit: Had a look at your snippets and it is like I assumed: you have a problem with CORS. Your javascript is not allowed to load data from any arbitrary URL.

Markus
  • 610
  • 1
  • 9
  • 23