# Auth - Attribute

Identify users by passing identity as `data-*` attributes on the widget loader script tag. No backend required, but the identifier remains visible in the browser.

## How it works

Add user identity fields as `data-*` attributes on the widget loader script tag. The loader reads these attributes and uses them to identify the user with Returning.AI.

```html
<script
  src="https://prod-widgets.returning.ai/widget-loader.js"
  data-widget-id="YOUR_WIDGET_ID"
  data-widget-type="custom"
  data-container="returning-ai-widget-YOUR_WIDGET_ID"
  data-customer-id="CUST-10482"
  data-api-url="https://prod-widgets.returning.ai"
  data-widget-url="https://prod-widgets.returning.ai/custom-widget"
></script>
```

## Common attributes

| Attribute | Description |
| --- | --- |
| data-customer-id | Preferred stable broker-owned customer ID. |
| data-user-id | Fallback internal user ID if that field already exists in your platform. |
| data-email | Use only if email is already your canonical identifier and you do not have a better stable ID. |
| data-firstname / data-lastname | Optional display fields. Do not treat names as your primary identifier. |

## Legacy fallback guidance

If you do not have a backend, prefer a stable broker-owned identifier like `data-customer-id`. In most integrations, one stable identifier is enough. Only add a second identifier if your registration setup explicitly relies on it. This mode still exposes identity in the browser.

```html
<script
  src="https://prod-widgets.returning.ai/widget-loader.js"
  data-widget-id="YOUR_WIDGET_ID"
  data-widget-type="custom"
  data-container="returning-ai-widget-YOUR_WIDGET_ID"
  data-customer-id="CUST-10482"
  data-custom-tier="gold"
  data-theme="dark"
  data-api-url="https://prod-widgets.returning.ai"
  data-widget-url="https://prod-widgets.returning.ai/custom-widget"
></script>
```

## Dynamic attribute building

If your user data is available in JavaScript, build the script tag dynamically:

```javascript
// Build the widget loader script tag dynamically
const script = document.createElement('script');
script.src = 'https://prod-widgets.returning.ai/widget-loader.js';
script.dataset.widgetId = 'YOUR_WIDGET_ID';
script.dataset.widgetType = 'custom';
script.dataset.container = 'returning-ai-widget-YOUR_WIDGET_ID';
script.dataset.customerId = user.customerId;
script.dataset.apiUrl = 'https://prod-widgets.returning.ai';
script.dataset.widgetUrl = 'https://prod-widgets.returning.ai/custom-widget';

document.getElementById('widget-container').appendChild(script);
```

## When to use

- CMS platforms where you can template user data into the script tag.
- Static sites with known users.
- Quick prototyping before implementing Access Key Embed.

> Custom attributes
>
> Any field that exists on both the client side and the Returning.AI platform can be passed as a `data-*` attribute. Custom fields can be created in the admin panel so you can use a broker-owned identifier like `data-customer-id` instead of email.

Need server-verified identity? [Use the Widget SDK with Access Key Embed](https://docs.returning.ai/widget-sdk/auth-access-key.md) for server-verified authentication.