Create a Custom Social Connection with TikTok

​

Configure TikTok

1. In TikTok developer, select Manage apps.
2. Select Connect an app.
3. Under the Configuration section, add an application icon, application name, and description.
4. Under Platforms, choose your application type:
   1. For Web applications, add a valid URL.
   2. For Android, add the Android package name, Play Store URL, and application signature(s).
   3. For iOS, add the App Store URL and Bundle ID.
5. Under the Product menu, select Add Product.
6. Select the Login Kit.
7. Then, select the TikTok API.
8. In the Product section, add the URL of your Terms of Service page, the URL of your Privacy Policy page, and your redirect domain to the Login Kit. The redirect domain is your Auth0 domain found in Dashboard > Applications > Applications under the Settings tab. For example: dev-test-1.us.auth0.com.
9. Select Save Changes. Then, select Submit for review.
10. Wait until your application status moves from Staging to Production. It could take up to several hours for TikTok to review your application and update the status.

​

Configure Auth0

1. Navigate to Auth0 Dashboard > Authentication > Social.
2. Choose Create Connection.
3. Scroll to the bottom of the list and choose Create Custom.
4. Enter the following to create a New Custom Social Connection:
   1. Name: TikTok
   2. Authorization URL: TikTok’s Authorization URL https://www.tiktok.com/auth/authorize/
   3. Token URL: This will eventually be your proxy. Use a placeholder URL: https://example.com
   4. Scope: user.info.basic
   5. Client ID: Client key assigned to you by TikTok
   6. Client Secret: Client secret assigned to you by TikTok
5. Configure the Fetch User Profile Script to fetch profile information from TikTok’s user_info endpoint. Map attributes to Auth0’s normalized user profile.
   Auth0 only requires the user_id attribute, which corresponds to TikTok’s union_id.

function fetchUserProfile(accessToken, context, cb) {
  const axios = require('axios@0.22.0');
  const userInfoEndpoint = 'https://open.tiktokapis.com/v2/user/info?fields=union_id';
  const headers = { 'Authorization': 'Bearer ' + accessToken };

  axios
    .get(userInfoEndpoint, { headers })
    .then(res => {
      if (res.status !== 200) {
        return cb(new Error(res.data));
      }

      const profile = {
        user_id: res.data.user.union_id,
      };

      cb(null, profile);
    })
    .catch(err => cb(err));
}

6. Click Create.
7. Navigate to the application you want to use with the TikTok connection under Dashboard > Applications > Applications.
8. Under the Connections tab, toggle on the TikTok option.

​

Pass customs parameters to TikTok with the Management API

1. Navigate to Auth0 Dashboard > Applications > APIs and select the Auth0 Management API.
2. Select the API Explorer tab.
3. Select Create & Authorize Test Application.
4. Copy the provided token.
5. Navigate to the Auth0 Management API Explorer. You may need to open an incognito window.
6. Select Set API Token in the top, left-hand corner.
   
7. Paste the token and select Set Token.

​

Configure the client_key field

1. Use the Get a connection method to retrieve the options object values. The following is a sample response object:

{
  "options": {
    "client_id": "",
    "client_secret": "",
    "scope": "user.info.basic"
  }
}

2. Add the upstream_params object with the client_key field:

{
  "options": {
    "client_id": "",
    "client_secret": "",
    "scope": "user.info.basic",
    "upstream_params": { 
      "client_key": { "value": "<Client Key from TikTok>" } 
    }
  }
}

3. Use the Update a connection method with the options object as the body. Auth0 will send the client_key=<value> parameter to TikTok’s authorization endpoint.

​

Access token request

​

Deploy TikTok integration proxy

1. Use the sample code from the GitHub repository and follow the instructions in the README to install dependencies and start the development server.
   1. The example server has one POST route, /proxy/token. The server should be running on http://localhost:3333.
2. Copy the proxy endpoint to be used in your TikTok Developer setup. The proxy endpoint should be something similar to: https://405a-104-129-13b-250.ngrok.io/proxy/token.
3. In TikTok Developer, navigate back to the social connection configuration. Update the Token URL that you set to https://example.com and enter the proxy URL.