Getting Short-Lived and Long-Lived Access Tokens

Learn how to generate OAuth2 short-lived and long-lived access tokens.

We'll cover the following

After we have gotten our App ID and App secret, we will generate our access tokens.

Short-lived access token

In the Facebook Graph API, short-lived access tokens are temporary tokens used to access the API on behalf of a user. These tokens have a lifetime of about an hour, after which they expire and can no longer be used to access the API.

We can obtain the short-lived access tokens by redirecting to the Facebook OAuth dialog and getting an authorization code. Afterward, we exchange the authorization code for a short-lived access token by making a server-side request to the Facebook API.

These tokens can access the user's data that the app has permission to access. The apps can use these tokens to make API requests on behalf of the user, such as reading the user's profile information, posting to the user's timeline, and more.

Click the "Run" button in the widget below, click the app URL, and log in to your Facebook account to get a short-lived access token.

{
  "name": "frontend",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "@testing-library/jest-dom": "^5.16.5",
    "@testing-library/react": "^13.4.0",
    "@testing-library/user-event": "^13.5.0",
    "react": "^18.2.0",
    "react-dom": "^18.2.0",
    "react-router-dom": "^6.6.1",
    "react-scripts": "5.0.1",
    "web-vitals": "^2.1.4"
  },
  "scripts": {
    "start": "PORT=8080 react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject"
  },
  "eslintConfig": {
    "extends": [
      "react-app",
      "react-app/jest"
    ]
  },
  "browserslist": {
    "production": [
      ">0.2%",
      "not dead",
      "not op_mini all"
    ],
    "development": [
      "last 1 chrome version",
      "last 1 firefox version",
      "last 1 safari version"
    ]
  }
}
Getting a short-lived access token

Long-lived access token

Short-lived access tokens are temporary and should be exchanged for long-lived tokens. Long-lived access tokens can be obtained by exchanging a short-lived access token for a long-lived token by making a server-side request to the Facebook API. Once obtained, the long-lived token can access the user's data for up to 60 days.

Click the “Edit” button, paste the short-lived access token you got in the above widget, and click “Save.” Then, click the "Run" button below to get a long-lived access token.

Press + to interact
// Importing libraries here
import fetch from "node-fetch"
// Define endpoint URL here
const endpointUrl = new URL("https://graph.facebook.com/v16.0/oauth/access_token");
//Short lived token
const shortLivedToken = '{{SHORT_LIVED_ACCESS_TOKEN}}';
// App ID and App Secret of your app
const appId = '{{APP_ID}}';
const appSecret = '{{APP_SECRET}}';
const headerParameters = {
    contentType: "application/json",
};
// Setting API call options
const options = {
    method: "GET",
    headers: headerParameters,
};
// Define Query Parameters here
const queryParameters = new URLSearchParams({
    grant_type: "fb_exchange_token",
    client_id: appId,
    client_secret: appSecret,
    fb_exchange_token: shortLivedToken
});
// Function to make API call
async function fetchLongAccessToken() {
    try {
        endpointUrl.search = queryParameters;
        const response = await fetch(endpointUrl, options);
        // Printing response
        printResponse(response);
    } catch (error) {
        // Printing error message
        printError(error);
    }
}
// Calling function to make API call
fetchLongAccessToken();

In the code widget above:

  • Line 5: We define the endpoint URL in the endpointUrl variable.

  • Lines 25–30: We specify client_id, client_secret, fb_exchange_token, and set grant_type in the queryParameters variable.

  • Line 36: We use the fetch function to make the API call.