Setting up Khalis SSO in sttm‐desktop

Overview

After logging in with Khalis SSO, users gain access to shared user data, which is currently utilized by both sttm-desktop and sttm-web. We have the 'Favourite shabad' functionality, which is synchronized between sttm-web and sttm-desktop. For instance, if a user logs in and marks a shabad as a favourite on sttm-web, this preference will also be reflected in the sttm-desktop app upon logging in. As of now, the 'Favourite shabad' functionality is the only feature implemented in this manner. Moving forward, we plan to implement additional features that can be shared across applications

Process of Khalis SSO

• The Khalis App (in this case, sttm-desktop) initiates the process by sending a request to the Khalis SSO Service Provider.
• The Service Provider accepts this request and then redirects the user to the Khalis login page.
• Upon successful login, the user is redirected back to the Service Provider, along with a User token.
• The Service Provider then forwards the User token back to the app (sttm-desktop).

Deployment link

Khalis SSO service provider: https://serviceprovider.khalis.net

(In the code snippets below, the SP_API variable would refer to this deployment link)

Get the user token

Step 1: Sending a Login Request

To initiate a login request, redirect the user to the following URL:
https://serviceprovider.khalis.net/login/sso?redirect_url={your_app's_redirect_url}

Upon successful login, the user will be redirected to the specified redirect URL.

For instance, in the case of sttm-desktop, the redirect URL is: sttm-desktop://login

Ensure that you include the complete URL, along with the protocol, when specifying the value of the redirect URL. For instance, if it's a web application, the redirect URL should begin with either http://domain.com/ or https://domain.com/

Since sttm-desktop is a desktop application, we utilize a custom protocol sttm-desktop:// for the redirect URL.

Step 2: Saving the User Token

Following a successful login, the service provider will navigate to the redirect URL specified in Step 1.
The user token will be transmitted as a parameter named token.

For instance, in the case of sttm-desktop, the service provider will redirect to the following URL:
sttm-desktop://login?token={user_token_here}

Retrieve the token from the above URL and ensure it is securely stored within the app.

Logged in user info

To get the details of the logged in user, send request to the /user endpoint. Send a GET request with the Authorization header as shown below. Don't forget to add Bearer with the user token in header.

• JS implementation:

const response = await fetch(`${SP_API}/user`, {
   headers: {
     Authorization: `Bearer ${userToken}`,
   },
});
const userData = response.json().then((data) => data);

• Data format

{
   email: "abc@xyz.com",
   firstname: "John",
   lastname: "Doe",
   exp: <token expiration>,
   iat: <token generation time>,
   nameID: "",
   nameIDFormat: ""
}

Using the favourite shabad feature

For any request related to fav shabad, we would need to send the Authorization header.

Add a fav shabad

• To add a new fav shabad, send a POST request to /favourite-shabads
• It needs two parameters
  • shabadId: id of the shabad to be marked as fav
  • verseId: id of the verse to be used as title of fav shabad

await fetch(`${SP_API}/favourite-shabads`, {
    method: 'POST',
    body: JSON.stringify({
      shabadId: 223,
      verseId: 12,
    }),
    headers: {
      'Content-Type': 'application/json',
       Authorization: `Bearer ${userToken}`,
    },
  });

Delete a fav shabad

• To delete a fav shabad, send a DELETE request to /favourite-shabads/[shabadId]
• Send the shabad id in the endpoint to delete it from favourites.

await fetch(`${SP_API}/favourite-shabads/${shabadId}`, {
    method: 'DELETE',
    headers: {
      Authorization: `Bearer ${userToken}`,
    },
  });

List all fav shabads

• To list all the fav shabads send a GET request to endpoint /favourite-shabads

  const response = await fetch(`${SP_API}/favourite-shabads`, {
    headers: {
      Authorization: `Bearer ${userToken}`,
    },
  });
  const favShabadList = response.json().then((data) => data.favouriteShabads);

• The resulting fav shabad response would be in the following format:

{
    "favouriteShabads": [
        {
            "id": 551,
            "user_id": 15,
            "shabad_id": 957,
            "verse_id": 12303,
            "comment": null,
            "created_at": "2023-05-11T06:10:39.000Z",
            "updated_at": "2023-05-11T06:10:39.000Z"
        },
        {
            "id": 552,
            "user_id": 15,
            "shabad_id": 10365,
            "verse_id": 114771,
            "comment": null,
            "created_at": "2023-05-11T06:22:05.000Z",
            "updated_at": "2023-05-11T06:22:05.000Z"
        }
    ]
}