I'm new to Instagram apps development and struggling with this issue for some time now. Basically, this is how it looks like:

I'm redirecting user to authorization url like this:

window.open("/?client_id=" + igClientId + "&redirect_uri=" + igCallbackUrl + "&response_type=code", "_blank");

Then, when user will login, page reloads and Instagram CODE is added at the end of callback url ('?code=returned_by_instagram_code').

And this is the place where I've stuck.

How can I obtain returned code from url after page reloads (it is stored in cookies or session so I could access it in some way, or should I get it somehow through callback url and some function attached to it)?

How next, when I'll obtain the code, can I send (POST) request to Instagram for access_token?

Thank you in advance for any help.

PS. I'm using javascript without any frameworks (e.g. jquery) and this is the response that I'm looking for.

I'm new to Instagram apps development and struggling with this issue for some time now. Basically, this is how it looks like:

I'm redirecting user to authorization url like this:

window.open("https://api.instagram./oauth/authorize/?client_id=" + igClientId + "&redirect_uri=" + igCallbackUrl + "&response_type=code", "_blank");

Then, when user will login, page reloads and Instagram CODE is added at the end of callback url ('?code=returned_by_instagram_code').

And this is the place where I've stuck.

How can I obtain returned code from url after page reloads (it is stored in cookies or session so I could access it in some way, or should I get it somehow through callback url and some function attached to it)?

How next, when I'll obtain the code, can I send (POST) request to Instagram for access_token?

Thank you in advance for any help.

PS. I'm using javascript without any frameworks (e.g. jquery) and this is the response that I'm looking for.

• javascript
• instagram

• 1 This tutorial includes a link that generates your auth token and your user id. Then it goes on to show you what you can do with it. See here: blueprintinteractive./blog/… – Rivers Commented Jun 12, 2012 at 20:53

3 Answers 3

From the documentation on using Client-Side access token generation only (http://instagram./developer/authentication/) and the key thing you need to change is the responsecode in your URL to be: &response_type=token

Client-Side (Implicit) Authentication If you’re building an app that does not have a server ponent (a purely javascript app, for instance), you’ll notice that it’s impossible to plete step three above to receive your access_token without also having to ship your client secret. You should never ship your client secret onto devices you don’t control. Then how do you get an access_token? Well the smart folks in charge of the OAuth 2.0 spec anticipated this problem and created the Implicit Authentication Flow.

Step One: Direct your user to our authorization URL

https://instagram./oauth/authorize/?client_id=CLIENT-ID&redirect_uri=REDIRECTURI&response_type=token

At this point, we present the user with a login screen and then a confirmation screen where they approve your app’s access to their Instagram data. Note that unlike the explicit flow the response type here is “token”.

Step Two: Receive the access_token via the URL fragment

Once the user has authenticated and then authorized your application, we’ll redirect them to your redirect_uri with the access_token in the url fragment. It’ll look like so:

http://your-redirect-uri#access_token=270740070.f59def8.d58713f2c81741c5b3686109306f98b4

Simply grab the access_token off the URL fragment and you’re good to go. If the user chooses not to authorize your application, you’ll receive the same error response as in the explicit flow

A simple example, get your token in registration app on api.instagran (https://instagram./developer/clients/register/). Make your login before:

var accessToken = '5e6e329062f047dd95ggj6c9df202c828';

$.ajax({
 url: 'https://api.instagram./v1/media/popular',
 dataType: 'jsonp',
 type: 'GET',
 data: {client_id: accessToken},
 success: function(data){
    console.log(data);
    for(x in data.data){
      $('ul').append('<li><img  src="'+data.data[x].images.low_resolution.url+'"></li>');  
    }
},
error: function(data){
    console.log(data);
}

});

The igCallbackUrl will redirect to a page. The code can be accessed as a GET parameter to that request.

Something like GET['code'] in php. If you give more details about the Server side framework then it will be helpful to answer your qwery.

You can use github./Instagram/instagram-javascript-sdk if you are using on Javascript.