In this post we learn how to obtain and access token from the Instagram Basic Display API with a code passed to us from Instagram once the user has authorized our application. The access token we get is short lived meaning it will only be valid for an hour or so. In the next blog post we will learn how to exchange this short lived access token, for a long lived access token which can be used for up to 60 days.
Required to continue: Facebook app with Instagram product added
Step 1: Generate the Authorization URL
This URL will take the user to Instagram and present them with a pop up. The pop up will ask the user to Authorize our app so our app can read the users Instagram information.
Authorization URL Structure
https://api.instagram.com/oauth/authorize?app_id={app-id}&redirect_uri={redirect-uri}&scope=user_profile,user_media&response_type=code
- {app-id}: Instagram App ID. In the developer app dashboard got to “Instagram > Basic Display”
- {redirect-uri}: This must match a URI that has been entered into the apps “Valid OAuth Redirect URIs” in the apps dashboard.
Once you have the Authorization URL, place it inside of an <a> tag for the user to click on.
|
1 2 3 4 |
<!-- Link to take user to Instagram for authorization with our app --> <a href="https://api.instagram.com/oauth/authorize?app_id={app-id}&redirect_uri={redirect-uri}&scope=user_profile,user_media&response_type=code"> Authorize W/Instagram </a> |
Step 2: Obtaining the Access Token
When the user Authorizes our app, Instagram sends them to the {redirect-uri} we passed along in the authorization URL and appends on a code. On our website, we will check for this code in the URL. If code exists in the URL, use it to get an access token. If no code variable exists in the URL, display the “Authorize W/Instagram” link from step 1 above. The URL will look like this.
Instagram Redirect URI with code: {redirect-uri}?code={ig-code}
Access Token API Endpoint
Endpoint
https://api.instagram.com/oauth/access_token
Type
POST
Params
- app_id: Instagram App ID. In the developer app dashboard go to “Instagram > Basic Display” and copy the “Instagram App ID”.
- app_secret: Instagram App Secret. In the developer app dashboard go to “Instagram > Basic Display” and copy the “Instagram App Secret”.
- redirect_uri: This must match one of the URIs that has been entered into the apps “Valid OAuth Redirect URIs” in the apps dashboard.
- grant_type: authorization_code
- code: {ig-code}
PHP CURL call to the Access Token API Endpoint
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 |
// base endpoint $endpoint = 'https://api.instagram.com/oauth/access_token'; // params the endpoint requires $params = array( 'app_id' => 'INSTAGRAM_APP_ID', // our instagram app id 'app_secret' => 'INSTAGRAM_APP_SECRET', // our instagram app secret 'grant_type' => 'authorization_code', 'redirect_uri' => 'INSTAGRAM_APP_REDIRECT_URI', // our redirect uri 'code' => $_GET['code'] // code instagram sent us in the URL ); // open curl call $ch = curl_init(); // set type to post and pass the fields along curl_setopt( $ch, CURLOPT_POSTFIELDS, http_build_query( $params ) ); curl_setopt( $ch, CURLOPT_POST, 1 ); // set curl url curl_setopt( $ch, CURLOPT_URL, $endpoint ); // set other curl options curl_setopt( $ch, CURLOPT_SSL_VERIFYHOST, false ); curl_setopt( $ch, CURLOPT_SSL_VERIFYPEER, false ); curl_setopt( $ch, CURLOPT_RETURNTRANSFER, true ); // get response, close curl, make php array $response = curl_exec( $ch ); // close cur curl_close( $ch ); // make nice php array :D $responseArray = json_decode( $response, true ); // print out the response array that contains the access token echo '<pre>'; print_r( $responseArray ); |
This CURL call hits our Instagram endpoint with the required parameters and receives a response from Instagram with an access token. If any of the parameters are incorrect, an error message will be returned. The access token here is a short lived access token meaning it is not valid for very long. In the next post, this short lived access token will be exchanged for a long lived access token.
That is going to do it for this post! Leave any comments/questions/concerns below and thanks for stopping by the blog!
Hi Justin, very good post.
I was following the steps of the tutorial and it is more than clear, I only have 2 queries to ask you:
1) I am testing with a local application (localhost), when trying to configure it from facebook the app and put in CLIENT CONFIGURATION OAUTH, my localhost, when trying to save gives me an error, because it tells me that it must be a URI with HTTPS and not an HTTP. Seeing on facebook the Apply HTTPS option is enabled by default and I have no way to disable it. Any comments you can make about it to be able to test on localhost?
2) With this code, could I recover a person’s Followers and their engagment?
From already thank you very much
If your app is in development mode you should be able to use localhost. You can get the count for a persons followers if they authorize your app to do so.
Thanks justin for answering. I was looking at the instagram documentation to retrieve the engagment and the followers and seeing your code I have noticed the following observations
1. You are using as endpoint “graph.instagram.com” while in the documentation they use graph.facebook.com.
2. In the documentation https://developers.facebook.com/docs/instagram-api/reference/media/insights/?locale=es_ES they say that you should use the parameter insights? Metric = {metric}
3. By using the endpoint “https://graph.instagram.com/ {media-id} / insights? Metric = engagement, impressions, reach” to get engagement, I get “Tried accessing nonexisting field (insights) on node type (Media) ”.
4. I do not know if the documentation is not up to date or clear, I have tried directly passing the media-id that I obtained using your example with my account and nothing.
5. If you could help me and maybe tell me that I may be missing, I would appreciate it.