> ## Documentation Index
> Fetch the complete documentation index at: https://developer.onetrust.com/llms.txt
> Use this file to discover all available pages before exploring further.
# Embedding the Trust Center on an existing webpage
# Integrate the Trust Center
You can embed the Trust Center into your website as a fully integrated component, ideally suited for two main scenarios:
1. **Authenticated customer account page (post-login)**\
In this setup, the Trust Center component receives a JWT token to recognize that the user is already authenticated.
2. **Public page (without login)**\
Here, the Trust Center handles user authentication directly by initiating a one-time passcode login flow.
# Authorizing permitted domains
To ensure the Trust Center successfully loads on the required websites, you must first specify the domains where the portal will be allowed to load. This list of domains must be entered within the **Domain safe list** section on the **Settings** tab of your portal within the OneTrust Platform. This step is required to authorize those domains. Any attempts to load the portal on domains that are not entered within the **Domain safe list** will be blocked automatically.
> π
>
> For more information, see [Configuring Settings for a Trust Center](https://my.onetrust.com/s/article/UUID-fa233ecb-2019-4a7f-c505-e572d6cce104).
[block:image]
{
"images": [
{
"image": [
"https://files.readme.io/35006d979878385cdb507768b1bbaec8cb2200e53007bacced5211c994539574-image.png",
null,
""
],
"align": "center",
"border": true
}
]
}
[/block]
# Testing the embedded Trust Center
Trust Center can be embedded in any web application, including those built with Vanilla JavaScript, Angular, React, Vue, etc.
To embed the Trust Center into an HTML page, you will need two code snippets:
1. A custom `HTML` placeholder tag. This marks the location where the Trust Center component will be rendered and loaded.
2. A script to load the required data. This initializes and configures the component with the necessary information.
## HTML tag
```html
```
**`tenantId`**: Your user ID.
**`portalId`**: The ID of the portal to be loaded.
**`blobUrl`:** Environment-specific Azure storage blob URL, such as `https://privacyportal.onetrust.com`. This URL will vary based on your environment. For more information, see [Privacy Portal URLs](https://developer.onetrust.com/onetrust/reference/url-variables-for-apis-sdks#privacy-portal-urls).
**`workerUrl`:** `https://portal-api.onetrust.com`
## Script
```javascript
```
Place this script at the bottom of your HTML page (just before the closing `` tag). Once these two code snippets are added, the portal will load where the placeholder is located.
# Passing user identifiers to OneTrust
## Prerequisites
* A reliable way to identify a user.
* The ability to create a JSON Web Token (JWT). This will be passed to OneTrust servers to authenticate your request to access a user's consent profile.
> π
>
> For more information, see [Jwt.io](https://jwt.io/).
1. Upload a Public Key for the generated JWT in your OneTrust tenant.
1. Navigate to **Settings**.
2. Under the **Consent** sub-section, click **Public Keys**.
3. Click the **Add Public Key** button and then **Save**.
## Creating JWT Auth Tokens
> π
>
> OneTrust does not create the JWT, this needs to be created by your team.
As a security best practice, we recommend generating the JWTs server-side. In this section, we will use the [JWT.io](https://jwt.io/) as a way to demonstrate the JWT auth token setup.
1. Go to [JWT.io](https://jwt.io/).
2. In the **Decoded > PAYLOAD: DATA** section, add the unique user identifier as the value for `"sub"`.
3. In the **Decoded > VERIFY SIGNATURE** section, add a value for `your-256-bit-secret`.
> π
>
> This value is your **Public Key**, which you need to add to your OneTrust tenant via **Settings > Consent > Public Keys**.
4. In the **Encoded** section, copy the value. This will be your **Auth Token** in the Cookies and Mobile SDK Cross Device Consent configurations.
## Website setup
1. Identify the user. This can be done using your existing authentication methods.
2. Configure the `OneTrust` JavaScript variable:
* `id`: Unique user identifier.
* `isAnonymous`: Set as `false` to create/update user profiles in OneTrust.
* `token`: The JWT that you produce with the unique user identifier.
```javascript