DEV Community

Andrea Olivato
Andrea Olivato

Posted on • Originally published at andreaolivato.Medium

How to implement the TikTok Login Kit for Web in PHP

TikTok has recently released their new API to allow Social Login via their platform. They called it Login Kit for Web.

With more Gen-Z and Millennials in the platform, allowing the simplified signup and login process via TikTok is the logical step for many Web Apps, including our very own Lnk.Bio.

While the implementation is a very basic oauth2 flow, there were no published class nor guides specific to PHP implementation, so I thought useful to publish an Open-source class and this quick tutorial based on such class.

Step 1: Register your App

First of all, you need to register in the TikTok Developers platform. Process is easy and approval is quite fast; it took us just 24hrs to get approved with Lnk.Bio](https://lnk.bio/).

Pay attention to the approved redirect URLs. While the TikTok page calls them “Redirect Domains”, they actually require full URLs, so the full path of the page where you’re redirected after the TikTok login.

After you register your application you will receive, as usual a Client Key and Client Secret.

Step 2: Install helper class

Use Composer to install the PHP helper

composer require gimucco/tiktok-loginkit
Enter fullscreen mode Exit fullscreen mode

If, for any reason, you’re not using Composer, you can download the class from Github. Current stable is v0.1.

Step 3: Full Login Example

The login flow is typical:

  • Generate a Redirect Url to send the user to TikTok to authorise your app
  • Receive the Authorisation Token
  • Exchange the Authorisation Token with an Access Token that you can use for the rest of the calls
  • Make a sample call to retrieve the User Information

Here’s a quick code sample

session_start(); // Important! Required for STATE Variable check and prevent CSRF attacks
require_once __DIR__.'/../../../autoload.php';
use gimucco\TikTokLoginKit;

$api_key = ''; // Your API Key, as obtained from TikTok Developers portal
$api_secret = ''; // Your API Secret, as obtained from TikTok Developers portal
$redirect_uri = ''; // Where to return after authorization. Must be approved in the TikTok Developers portal
$_TK = new TikTokLoginKit($api_key, $api_secret, $redirect_uri);

if (TikTokLoginKit\Connector::receivingResponse()) { // Check if you're receiving the Authorisation Code
    try {
        $token = $_TK->verifyCode($_GET[TikTokLoginKit\Connector::CODE_PARAM]); // Verify the Authorisation code and get the Access Token

        // ** Your logic to store the access token goes here


        $user = $_TK->getUser(); // Retrieve the User Object

        // ** Your logic to store or use the User Info goes here

        // Print some HTML as example
        echo <<<HTML
        <table width="500">
            <tr>
                <td with="200"><img src="{$user->getAvatarLarger()}"></td>
                <td>
                    <br />
                    <strong>ID</strong>: {$user->getOpenID()}<br /><br />
                    <strong>Name</strong>: {$user->getDisplayName()}
                </td>
            </tr>
        </table>
HTML;
    } catch (Exception $e) {
        echo "Error: ".$e->getMessage();
        echo '<br /><a href="?">Retry</a>';
    }
} else { // Print the initial login button that redirects to TikTok
    echo '<a href="'.$_TK->getRedirect().'">Log in with TikTok</a>';
}
Enter fullscreen mode Exit fullscreen mode

All done! If you have any suggestion on the class or its implementation please feel free to reach out on GitHub or Twitter.

Top comments (2)

Collapse
 
amara_wazir profile image
amara wazir

please help ma out this error .. i didnt find file ..Fatal error: Uncaught Exception: Ini file not found in requested path: D:\laragon\www\tiktok\vendor\gimucco\tiktok-loginkit\examples/env.ini in D:\laragon\www\tiktok\vendor\gimucco\tiktok-loginkit\src\Connector.php:72 Stack trace: #0 D:\laragon\www\tiktok\vendor\gimucco\tiktok-loginkit\examples\login.php(17): gimucco\TikTokLoginKit\Connector::fromIni('D:\laragon\www\...') #1 {main} thrown in D:\laragon\www\tiktok\vendor\gimucco\tiktok-loginkit\src\Connector.php on line 72

Collapse
 
sayemkhan profile image
KM Shariful Islam

Can I use it in wordpress?

Some comments have been hidden by the post's author - find out more