React Native Requires Chilkat v10.1.2+

Dropbox: OAuth2 Authorization to Obtain an Access Token

See more Dropbox Examples

Demonstrates how to get a Dropbox OAuth2 access token from a desktop application or script.

This example runs the OAuth 2.0 authorization flow that lets the user sign in to Dropbox and authorize your app.

React Native

import { JsonObject, OAuth2 } from '@chilkat/react-native'

function chilkatExample() {
  // For more information about the OAuth2, see OAuth 2.0 Authorization Flow

  const oauth2 = new OAuth2();

  // The port should match the Authorized Redirect URL in your Dropbox app, 
  // which would look like "http://localhost:3017/"
  oauth2.listenPort = 3017;

  // IMPORTANT: One of the OAuth2 redirect URIs for your Dropbox app must be
  // exactly this string:  http://localhost:3017/

  oauth2.authorizationEndpoint = 'https://www.dropbox.com/oauth2/authorize';
  oauth2.tokenEndpoint = 'https://api.dropboxapi.com/oauth2/token';

  // Replace this with your actual Dropbox App Key
  oauth2.clientId = 'DROPBOX_APP_KEY';

  // This is for Require Proof Key for Code Exchange (PKCE)
  // See OAuth2 PKCE Explained
  oauth2.codeChallenge = true;
  oauth2.codeChallengeMethod = 'S256';

  // Add token_access_type=offline to also get a refresh token in the response
  oauth2.addAuthQueryParam('token_access_type', 'offline');

  // Begin the OAuth2 Authorization code flow.  This returns a URL that should be loaded in a browser.
  let url: string;
  try {
    url = oauth2.startAuth();
  } catch {
    console.log(oauth2.lastErrorText);
    return;
  }

  console.log(`url = ${url}`);

  // Launch the default browser on the system and navigate to the url.
  // The LaunchBrowser method was added in Chilkat v10.1.2.
  try {
    oauth2.launchBrowser(url);
  } catch {
    console.log(oauth2.lastErrorText);
    return;
  }

  // Wait for the user to approve or deny authorization in the browser.
  let numMsWaited = 0;
  while ((numMsWaited < 90000) && (oauth2.authFlowState < 3)) {
    oauth2.sleepMs(100);
    numMsWaited += 100;
  }

  // If the browser does not respond within the specified time, AuthFlowState will be:
  // 
  // 1: Waiting for Redirect - The OAuth2 background thread is waiting for the browser's redirect request.
  // 2: Waiting for Final Response - The thread is awaiting the final access token response.
  // In either case, cancel the background task initiated by StartAuth.

  if (oauth2.authFlowState < 3) {
    oauth2.cancel();
    console.log('No response from the browser!');
    return;
  }

  // Check AuthFlowState to determine if authorization was granted, denied, or failed:
  // 
  // 3: Success - OAuth2 flow completed, the background thread exited, and the successful response is in AccessTokenResponse.
  // 4: Access Denied - OAuth2 flow completed, the background thread exited, and the error response is in AccessTokenResponse.
  // 5: Failure - OAuth2 flow failed before completion, the background thread exited, and error details are in FailureInfo.

  if (oauth2.authFlowState === 5) {
    console.log('OAuth2 failed to complete.');
    console.log(oauth2.failureInfo);
    return;
  }

  if (oauth2.authFlowState === 4) {
    console.log('OAuth2 authorization was denied.');
    console.log(oauth2.accessTokenResponse);
    return;
  }

  if (oauth2.authFlowState !== 3) {
    console.log(`Unexpected AuthFlowState:${oauth2.authFlowState}`);
    return;
  }

  console.log('OAuth2 authorization granted!');

  const json = new JsonObject();
  json.load(oauth2.accessTokenResponse);
  json.emitCompact = false;

  console.log(`Access Token Response = ${json.emit()}`);

  // A sample access token response:

  // {
  //   "access_token": "...",
  //   "token_type": "bearer",
  //   "expires_in": 14399,
  //   "refresh_token": "...",
  //   "scope": "account_info.read",
  //   "uid": "562542581",
  //   "account_id": "dbid:AACQhDS0E3_Vb72Ynd0F-GxGWdTI2qcTHzA"
  // }

  console.log(`Access Token = ${oauth2.accessToken}`);

  // Save the JSON access token response to a file for subsequent use..
  json.writeFile('qa_data/tokens/dropbox.json');
}