CometChat Pro Documentation

You'll find comprehensive guides and documentation to help you start working with CometChat as quickly as possible. Let's jump right in!

Javascript

This guide demonstrates how to add Liftoff in your website.

1. Configuration

Signup for CometChat to get your Application Id and Application Auth Token.

Steps:

  1. Create a new app and get AppID
  2. Head over to the API Keys section and click on the Create API Key button
  3. Enter a name and select the scope as Auth Only
  4. Now note the API Key and App ID
  5. Create an Auth Token via the CometChat API

👍

Recommendation : Use Only Auth Token

This advanced authentication procedure does not use the API Key directly in your client code and thus ensuring that your API Key is not leaked even if the client code is reverse engineered.

Add the Liftoff Plugin Dependency in your project.

npm install @cometchat-pro/liftoff --save
<script  type="module"  src="https://unpkg.com/@cometchat-pro/[email protected]/liftoff.min.js" />

2. Launching CometChat

  1. Initialize Liftoff plugin
var APP_ID = "12345APPID";

Liftoff.init(APP_ID).then(
   ()=> {
     console.log("Application is initialized");
   }, 
  error => {
    console.log("Initialized failed with error : " + error);
  }
} //end

After the initialization is completed, You can launch the Liftoff plugin using Launch method.

  1. Launch Liftoff Plugin
let chatView = document.getElementsByTagName("BODY")[0];
let UID = "superhero1";
let CID = "superhero2";

let settings = new Liftoff.LiftoffSettingsBuilder(UID,"AUTH_TOKEN",chatView)
                  .setConversationID(CID)
                  .setConversationType(Liftoff.ConversationType.USER)
                    .build();

Liftoff.launch(liftoffsettings);
  1. Set your custom theme colour.
let chatView = document.getElementsByTagName("BODY")[0];
let UID = "superhero1";
let CID = "superhero2";
let color "#7b56a4";

let settings = new Liftoff.LiftoffSettingsBuilder(UID,"AUTH_TOKEN",chatView)
                  .setConversationID(CID)
                  .setConversationType(Liftoff.ConversationType.USER)
                  .setPrimaryColor(color)
                    .build();

Liftoff.launch(liftoffsettings);

Updated about a year ago


Javascript


Suggested Edits are limited on API Reference Pages

You can only suggest edits to Markdown body content, but not to the API spec.