Authenticate Backend Requirements for Frontend Services

Catalyst Authentication offers you a solution to authenticate invocation calls made to backend services hosted on Catalyst; made from frontend services hosted in Catalyst frontend hosting services.

Note: This authentication method can only be applied if both your frontend service and backend service are hosted in the same project.

The following is an example code snippet highlighting the manner in which you can generate the required token to authenticate backend calls made to a Catalyst backend hosting service made from a Catalyst frontend hosting service.

generateAuthToken method
copy
document.getElementById("fn-btn").addEventListener("click", function(e) {
    e.preventDefault();
    var city = "test";
    var auth = catalyst.auth;
    auth.generateAuthToken().then((response) => {
            const token = response.access_token;
            fetch("URL_endpoint", {
                    <
                    !--URL end point of your backend service.-- >
                    method: "POST",
                    headers: {
                        Authorization: `${token}`,
                        "Content-Type": "application/json",
                    },
                    body: JSON.stringify({
                        city_name: city,
                    }),
                })
                .then((response) => response.json())
                .then((data) => {
                    alert(data.message);
                })
                .catch((err) => {
                    console.error("Error during fetch:", err);
                    alert("An error occurred. Please try again.");
                });
        })
        .catch((err) => {
            console.error("Error generating token:", err);
            alert("Failed to generate authentication token.");
        });
});

The logic detailed in the above snippet is explained below:

  • When an authenticated user accesses the application, their token can be obtained using the generateAuthToken method.

  • The user token that is obtained will be stored in the access_token response key.

  • The obtained token will be set as the value for the Authorization header key when the endpoint URL of the backend service is invoked.

  • A Functions URL, AppSail URL, or Slate’s Access URL, essentially, the URL generated by Catalyst when you host your backend code, will be the one you provide in line no 7.

Now, with the URL invoked, the following section will list the steps detailing the manner in which authentication will be carried out:

  • Once the backend service is invoked. The Catalyst SDK will be initialized using the request object.

  • The request object will contain the token, ensuring this initialization is done in an authenticated manner.

  • Catalyst will ensure that this initialization is made for all Catalyst required scopes. Thereby ensuring that the invocation calls made from the frontend service to the backend service hosted in Catalyst are effectively authenticated.

Notes:
  • The generated access token will only be valid for 1 hour.

  • You will need to ensure that the domain of the backend service and the frontend service are whitelisted using the CORS feature present in the Authentication component. You can find out more about the CORS feature from this help documentation.

Once the generateAuthToken method is plugged into your authentication logic, the applications hosted in Catalyst frontend hosting services will be able to make secure invocations of the backend services hosted in other Catalyst hosting services using Catalyst Authentication.

Last Updated 2025-09-19 16:27:28 +0530 IST

ON THIS PAGE