# Create User Consents
source: https://developer.mastercard.com/consent-management/documentation/tutorials-and-guides/auth-consent-ui/create-user-consents/index.md

## Using the Demo {#using-the-demo}

1. Select **Consent Management UI** from the home page.

2. The hosted consent UI loads in an iframe on the page.

   ![Hosted consent UI welcome screen requesting access to card data](https://static.developer.mastercard.com/content/consent-management/img/ref-app-card-ui.png)
3. Select the **Get started** button.

4. Enable access and select **Next Step**.

5. Enter your card details and select **Next Step** .
   ![Connect your card form with fields for cardholder name, card number, expiration, and security code](https://static.developer.mastercard.com/content/consent-management/img/ref-app-card-ui-details.png)

6. After successful enrollment, the parent window log displays the callback messages, including the `cardReference` for the enrolled card.
   ![3-D Secure authentication challenge with callback messages displayed in the parent window](https://static.developer.mastercard.com/content/consent-management/img/ref-app-card-ui-success.png)

## API Response {#api-response}

Throughout the consent flow, the hosted UI sends messages to the callback function you provided when creating the `ConsentUI` object. The UI sends messages for:

* API responses from the Consent Management \& Enrollment APIs
* Errors not handled by the UI
* Close or cancel actions

Each message has two fields:

|   Name   |   Type   |                           Description                           |
|----------|----------|-----------------------------------------------------------------|
| **type** | `String` | The message type: `ApiResponse`, `Close`, `Error`, or `Cancel`. |
| **data** | `Object` | The message content.                                            |

### Sample Event Messages {#sample-event-messages}

API response received during enrollment (authentication in progress):
* JSON

```JSON
{
    "type": "ApiResponse",
    "data": {
        "cardReference": "c851a2e6-1h6d-47f7-46d5-2489a8c29c86",
        "auth": {
            "status": "AUTH_IN_PROGRESS",
            "type": "THREEDS"
        }
    }
}
```

Successful enrollment:
* JSON

```JSON
{
    "type": "Close",
    "data": {
        "status": "success",
        "cardReference": "c851a2e6-1h6d-47f7-46d5-2489a8c29c86",
        "expiryDate": null
    }
}
```

Failed enrollment:
* JSON

```JSON
{
    "type": "Error",
    "data": {
        "status": "error",
        "errorCode": "auth.failed",
        "errorMessage": "Authentication failed: Stolen card"
    }
}
```

Cardholder cancels the flow:
* JSON

```JSON
{
    "type": "Cancel",
    "data": {
        "status": "cancelled"
    }
}
```

On a successful `Close` message, the `cardReference` in the response identifies the enrolled card. Use this value to retrieve or revoke consents with the `GET /consents/{cardReference}` and `DELETE /consents/{cardReference}` endpoints.
