> ## Documentation Index
> Fetch the complete documentation index at: https://docs.supahub.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Embed on Mobile

> Setup SSO for All-In-One widget for a seamless experience.

<Tip>Starter or above plan is required.</Tip>

To integrate the All-In-Widget into your mobile app, simply follow these steps:

## Create a WebView

Create a WebView component in your mobile app to display your public hub.

```javascript theme={null}
https://workspace-name.supahub.com/widget
```

## Automatic User Login with SSO

To enable automatic user login, you can pass an additional `jwtToken` parameter to the WebView URL. This parameter should contain a JWT that you generate on the server-side.

By including the JWT token in the URL, users will be automatically logged in to the Supahub widget when it loads.

Here’s what you need to do:

1. Log in to acquire your private key from SSO settings. Ensure that you store this key securely on your server and prevent unauthorized access.

2. When a user visits the widget, send a request to your server to generate a JWT token.

3. Generate a token on your server with customer data using the provided snippet.

4. Pass the generated JWT token to the Supahub widget for authentication.

## SSO Setup

<Steps>
  <Step title="Install JWT packages">
    Install the required packages for JWT token generation on your server.

    <CodeGroup>
      ```javascript Node.js theme={null}
      npm install --save jsonwebtoken
      ```

      ```python Python theme={null}
      pip install pyjwt
      ```

      ```javascript C# theme={null}
      // Instructions here
      https://www.nuget.org/packages/System.IdentityModel.Tokens.Jwt/
      ```

      ```java Java theme={null}
      // Instructions here
      https://github.com/jwtk/jjwt#install
      ```

      ```go Go theme={null}
      go get github.com/golang-jwt/jwt
      ```

      ```php PHP theme={null}
      composer require firebase/php-jwt
      ```
    </CodeGroup>
  </Step>

  <Step title="Generate the JWT token">
    Copy and use the “Private Key” from SSO settings to generate a JWT token on your server.

    <CodeGroup>
      ```javascript Node.js theme={null}
      var jwt = require("jsonwebtoken");
      const SSO_KEY = "YOUR_PRIVATE_SSO_KEY";

      function generateJWTToken(user) {
          var userData = {
              email: user.email, // Required
              name: user.name, // Required
              id: user.id, // Required
          };

          // The userData object can include any additional details you wish to provide about a user to Supahub. Ensure to follow the same format shown in the Supahub.identify method, as outlined at https://docs.supahub.com/identify/user

          return jwt.sign(userData, SSO_KEY, {
              algorithm: "HS256",
          });
      }
      ```

      ```python Python theme={null}
      import jwt
      from datetime import datetime, timedelta

      SSO_KEY = "YOUR_PRIVATE_SSO_KEY"

      def generate_JWT_token(user):
          userData = {
              'email': user['email'], # Required
              'name': user['name'], # Required
              'id': user['id'], # Required
          }

          # The userData object can include any additional details you wish to provide about a user to Supahub. Ensure to follow the same format shown in the Supahub.identify method, as outlined at https://docs.supahub.com/identify/user

          return jwt.encode(userData, SSO_KEY, algorithm='HS256')
      ```

      ```javascript C# theme={null}
      using System;
      using System.IdentityModel.Tokens.Jwt;
      using System.Security.Claims;
      using Microsoft.IdentityModel.Tokens;

      public string GenerateJwtToken(User user)
      {
          var claims = new[]
          {
              new Claim("email", user.email), // Required
              new Claim("name", user.name), // Required
              new Claim("id", user.id), // Required
          };

          // The userData object can include any additional details you wish to provide about a user to Supahub. Ensure to follow the same format shown in the Supahub.identify method, as outlined at https://docs.supahub.com/identify/user

          var key = new SymmetricSecurityKey(Encoding.UTF8.GetBytes("YOUR_PRIVATE_SSO_KEY"));
          var creds = new SigningCredentials(key, SecurityAlgorithms.HmacSha256);

          var token = new JwtSecurityToken(
              claims: claims,
              signingCredentials: creds);

          return new JwtSecurityTokenHandler().WriteToken(token);
      }
      ```

      ```java Java theme={null}
      import io.jsonwebtoken.Jwts;
      import io.jsonwebtoken.SignatureAlgorithm;

      String SSO_KEY = "YOUR_PRIVATE_SSO_KEY";

      public String generateJwtToken(User user) {
          Map<String, Object> claims = new HashMap<>();
          claims.put("email", user.getEmail()); // Required
          claims.put("name", user.getName()); // Required
          claims.put("id", user.getId()); // Required

          // The userData object can include any additional details you wish to provide about a user to Supahub. Ensure to follow the same format shown in the Supahub.identify method, as outlined at https://docs.supahub.com/identify/user

          return Jwts.builder()
              .setClaims(claims)
              .signWith(SignatureAlgorithm.HS256, SSO_KEY)
              .compact();
      }
      ```

      ```go Go theme={null}
      import (
          "github.com/golang-jwt/jwt",
      )

      var SSO_KEY = []byte("YOUR_PRIVATE_SSO_KEY")

      func GenerateJwtToken(user User) (string, error) {
          token := jwt.NewWithClaims(jwt.SigningMethodHS256, jwt.MapClaims{
              "email": user.email, // Required
              "name": user.name, // Required
              "id": user.id, // Required
          })

          // The userData object can include any additional details you wish to provide about a user to Supahub. Ensure to follow the same format shown in the Supahub.identify method, as outlined at https://docs.supahub.com/identify/user

          return token.SignedString([]byte(PrivateKey));
      }
      ```

      ```php PHP theme={null}
      use FirebaseJWTJWT;

      $SSO_KEY = "YOUR_PRIVATE_SSO_KEY";

      function generateJwtToken($user) {
          $payload = array(
              "email" => $user['email'], // Required
              "name" => $user['name'], // Required
              "id" => $user['id'], // Required
          );

          // The userData object can include any additional details you wish to provide about a user to Supahub. Ensure to follow the same format shown in the Supahub.identify method, as outlined at https://docs.supahub.com/identify/user

          return JWT::encode($payload, $SSO_KEY);
      }
      ```
    </CodeGroup>

    <Warning>
      Private Key should be kept secure and not to be shared. Add it in your .env
      file.
    </Warning>

    <Note>
      To enhance security measures, Single Sign-On (SSO) tokens are restricted from authenticating users with administrative privileges within any Supahub workspace. Instead, these users will need to log in using the dedicated portal at workspace.supahub.com
    </Note>
  </Step>

  <Step title="Pass the token back to your app and into the URL">
    The token will be used for user authentication.

    ```javascript theme={null}
    https://workspace-name.supahub.com/widget?jwtToken=payload
    ```
  </Step>
</Steps>