UPDATE 7/30: As of June 29th, the API to access Instagram changed. Read this post to learn how to get data from the new setup.

Naturally, the cross-domain ajax call is going to be a problem, and SharePoint’s library adds a lot of unnecessary complexity to what would ideally be a simple call.

The key is to use JSONP and jQuery; you provide a callback function to the Instagram endpoint, and then specify the datatype “jsonp” in the ajax call, and jQuery will handle the invocation of the callback when the data is ready.

On the Instagram side, you don’t even need to step outside the client’s sandbox mode.

In Instagram, you’ll need to go to the Developer section and register a new client.

You’ll need to uncheck the Disable implicit OAuth:

The new client will appear under the Manage Clients section. Copy the Client ID from the listing.

Then, under the security tab, provide a redirect address. This can be anything because we will not be leaving sandbox mode to achieve the connection, it will simply be any valid address Instagram redirects to and at the same time provides a token value at the end of that URL.

I’m just going to use brave.com because I like the browser and I don’t like Google:

Now you need to hit the Instagram authentication URL, which is:

Replace the Client ID with the value you copied off the client listing, and replace the redirect URL with exactly what you entered above (so if there is a ‘/’ at the end of the URL you provided, you will need to enter that).

After you modify the URL, and enter it into the browser and go, you will be prompted to confirm access for your client, when you do so, you will be taken to the redirect site you specified and the access token will appear at the end of the URL, like so:

Copy the value which appears after “access_token=” and use it in your api calls:

$.ajax({
  url:"https://api.instagram.com/v1/users/self/media/recent/",
  data:{access_token:"123456789.ab22100.34a13013341345283a641139940c38f8"},
  type:"GET",
  dataType:"jsonp",
  jsonpCallback: "handleInstagramResults"
  });

…this call will return JSON of the most recent posts, and jQuery will invoke handleInstagramResults to process it.

Notice I’m using the /self/ endpoint above; this doesn’t require that the app be migrated out of the Sandbox Mode or a user ID.