React Native

TikTok Shop OAuth2

See more TikTok Shop Examples

Demonstrates how to get the initial OAuth2 access token for a TikTop Shop application. This is for desktop applications and scripts only. It is not for server-side code running on a web server. React Native

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

function chilkatExample() {
  // This example requires the Chilkat API to have been previously unlocked.
  // See Global Unlock Sample for sample code.

  const oauth2 = new OAuth2();

  // This should be the port in the localhost callback URL for your app.  
  // The callback URL would look like "http://localhost:3017/" if the port number is 3017.
  oauth2.listenPort = 3017;

  oauth2.authorizationEndpoint = 'https://services.tiktokshop.com/open/authorize';
  oauth2.tokenEndpoint = 'https://auth.tiktok-shops.com/api/v2/token/get';

  // Replace these with actual values.
  oauth2.clientId = 'APP_KEY';
  oauth2.clientSecret = 'APP_SECRET';

  oauth2.scope = '';

  // See https://partner.tiktokshop.com/doc/page/63fd743c715d622a338c4e5a
  // for information about how to manually get your service_id
  // Once you have the service_id, it should not change.
  oauth2.addAuthQueryParam('service_id', 'YOUR_SERVICE_ID');

  // Begin the OAuth2 three-legged 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;
  }

  // Launch the system's default browser navigated to the URL.
  try {
    oauth2.launchBrowser(url);
  } catch {
    console.log(oauth2.lastErrorText);
    return;
  }

  // Now wait for the authorization.
  // We'll wait for a max of 60 seconds.
  let numMsWaited = 0;
  while ((numMsWaited < 60000) && (oauth2.authFlowState < 3)) {
    oauth2.sleepMs(100);
    numMsWaited += 100;
  }

  // If there was no response from the browser within 30 seconds, then 
  // the AuthFlowState will be equal to 1 or 2.
  // 1: Waiting for Redirect. The OAuth2 background thread is waiting to receive the redirect HTTP request from the browser.
  // 2: Waiting for Final Response. The OAuth2 background thread is waiting for the final access token response.
  // In that case, cancel the background task started in the call to StartAuth.
  if (oauth2.authFlowState < 3) {
    oauth2.cancel();
    console.log('No response from the browser!');
    return;
  }

  // Check the AuthFlowState to see if authorization was granted, denied, or if some error occurred
  // The possible AuthFlowState values are:
  // 3: Completed with Success. The OAuth2 flow has completed, the background thread exited, and the successful JSON response is available in AccessTokenResponse property.
  // 4: Completed with Access Denied. The OAuth2 flow has completed, the background thread exited, and the error JSON is available in AccessTokenResponse property.
  // 5: Failed Prior to Completion. The OAuth2 flow failed to complete, the background thread exited, and the error information is available in the FailureInfo property.
  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!');
  console.log(`Access Token = ${oauth2.accessToken}`);

  // Get the full JSON response:
  const json = new JsonObject();
  json.load(oauth2.accessTokenResponse);
  json.emitCompact = false;

  // The JSON response looks like this:

  // {
  //   "code": 0,
  //   "message": "success",
  //   "data": {
  //     "access_token": "GCP_3n......",
  //     "access_token_expire_in": 1722342011,
  //     "refresh_token": "GCP_hA......",
  //     "refresh_token_expire_in": 4841467787,
  //     "open_id": "_VIz.......",
  //     "seller_name": "****",
  //     "seller_base_region": "GB",
  //     "user_type": 0,
  //     "granted_scopes": [
  //       "seller.authorization.info",
  //       "seller.delivery.status.write",
  //       "seller.product.basic",
  //       "seller.order.info",
  //       "seller.fulfillment.basic",
  //       "seller.shop.info",
  //       "seller.fulfillment.package.write",
  //       "seller.product.write"
  //     ]
  //   },
  //   "request_id": "20240723......"
  // }

  console.log(json.emit());

  // How to get values from the JSON:
  let strVal = '';

  const code = json.intOf('code');
  const message = json.stringOf('message');
  const accessToken = json.stringOf('data.access_token');
  const accessTokenExpireIn = json.intOf('data.access_token_expire_in');
  const refreshToken = json.stringOf('data.refresh_token');
  const refreshTokenExpireIn = json.intOf('data.refresh_token_expire_in');
  const openId = json.stringOf('data.open_id');
  const sellerName = json.stringOf('data.seller_name');
  const sellerBaseRegion = json.stringOf('data.seller_base_region');
  const userType = json.intOf('data.user_type');
  const requestId = json.stringOf('request_id');
  let i = 0;
  const countI = json.sizeOfArray('data.granted_scopes');
  while (i < countI) {
    json.i = i;
    strVal = json.stringOf('data.granted_scopes[i]');
    i++;
  }

  // Save the JSON to a file for future requests, if needed..
  const fac = new FileAccess();
  fac.writeEntireTextFile('qa_data/tokens/tiktok-shops.json', json.emit(), 'utf-8', false);
}