The Ticket Center is an embeddable support portal designed for authenticated users inside your application. It lets users create support conversations, view their conversation history, and reply to messages without leaving your app.
Ticket Center vs Contact Form: The Ticket Center requires HMAC authentication and is designed for logged in users inside your app. The Contact Form is for anonymous visitors on public pages.
Authentication uses HMAC SHA256 signatures. Your server generates a signature for each user using their email and your HMAC secret. This lets Helpdesky verify the user's identity without requiring a separate login flow.
How It Works
User logs in to your app. Your server knows who the user is via your own authentication system.
Your server generates an HMAC signature by hashing the user's email with your HMAC secret (provided in the Helpdesky dashboard).
You pass the email and signature to the embed script via data-email and data-signature attributes on the script tag.
The Ticket Center verifies the signature with Helpdesky's server. If valid, the user can view and manage their support conversations.
Security note: The HMAC secret must stay on your server. Never expose it in client side code, environment variables accessible to the browser, or public repositories.
Quick Start
Generate your HMAC secret. In your Helpdesky dashboard, go to Ticket Center and click Generate HMAC Secret. Copy the secret and store it securely in your server's environment variables.
Generate the HMAC on your server. On every page load where the Ticket Center is embedded, compute an HMAC SHA256 hash of the user's email using your secret. See the HMAC Examples section below for code in multiple languages.
Embed the Ticket Center. Add the embed code to your support page. Replace USER_EMAIL with the authenticated user's email and HMAC_SIGNATURE with the signature your server computed:
<div id="hdh-ticket-center"></div>
<script src="https://helpdesky.io/ticket-center.js"
data-helpdesk-id="YOUR_HELPDESK_ID"
data-email="USER_EMAIL"
data-signature="HMAC_SIGNATURE"></script>
Verify with the test tool. Back in the dashboard, use the Verification Tool on the Ticket Center page to generate a known good HMAC for a test email. Compare it with your server's output to confirm your implementation is correct.
HMAC Examples
Server side HMAC SHA256 generation in common languages and frameworks. Replace YOUR_HMAC_SECRET with the secret from your Ticket Center dashboard page. In production, always load this from an environment variable.
Node.js
const crypto = require('crypto');
function generateHmac(userEmail) {
return crypto
.createHmac('sha256', process.env.HDH_HMAC_SECRET)
.update(userEmail)
.digest('hex');
}
Python (Django / Flask)
import hmac
import hashlib
import os
def generate_hmac(user_email: str) -> str:
secret = os.environ['HDH_HMAC_SECRET'].encode()
return hmac.new(secret, user_email.encode(), hashlib.sha256).hexdigest()
PHP (Laravel / plain PHP)
function generateHmac(string $userEmail): string {
return hash_hmac('sha256', $userEmail, env('HDH_HMAC_SECRET'));
}
Ruby (Rails)
require 'openssl'
def generate_hmac(user_email)
OpenSSL::HMAC.hexdigest(
'sha256',
ENV['HDH_HMAC_SECRET'],
user_email
)
end
Email Notifications
When you reply to a ticket center conversation, the user receives an email notification at the address used for authentication. Notifications are delayed by 60 seconds and can be skipped if the user reads the reply in the ticket center before the email is sent. You can also send emails immediately using the Send Instantly toggle. See Email Notification Timing for full details.
Embed Code and Data Attributes
| Attribute | Required | Description |
|---|---|---|
data-helpdesk-id |
Yes | Your helpdesk's unique identifier. |
data-email |
Yes | The authenticated user's email address. |
data-signature |
Yes | The HMAC SHA256 signature of the user's email, computed using your HMAC secret. |
data-align |
No | Alignment: left, center (default), or right. |
API Endpoints
These are the endpoints the Ticket Center script uses under the hood. You do not need to call them directly. They are documented here for transparency and for building custom integrations.
POST /api/messaging/ticket-center/verify
Verifies the HMAC signature and returns or creates a contact record.
{
"helpdeskId": "...",
"email": "user@example.com",
"signature": "hmac_hex_string"
}
POST /api/messaging/ticket-center/message
Creates a new conversation or sends a reply to an existing one. Requires helpdeskId, email, signature, and message. Include an optional conversationId to reply to an existing conversation instead of creating a new one.
POST /api/messaging/ticket-center/conversations/:id/messages
Retrieves all messages in a conversation (excluding private notes). Requires helpdeskId, email, and signature in the request body for authentication.
POST /api/messaging/ticket-center/conversations/:id/close
Closes (resolves) a conversation. Requires helpdeskId, email, and signature in the request body. The visitor can only close conversations they own.
Restrict Where the Ticket Center Loads
You can control which websites are allowed to embed your ticket center. Open Settings > Messages in the dashboard and add your domains to the Allowed Embed Domains setting. Subdomains are included automatically, and an empty list allows every domain. For details, see Restrict Embeds to Specific Domains.
Troubleshooting
"Verification failed" error. This means the HMAC signature does not match. Common causes: the email passed to data-email does not exactly match the email used to compute the HMAC (check for whitespace or case differences), the HMAC secret on your server is wrong or outdated (copy it again from the dashboard), or you are using a different hashing algorithm (it must be HMAC SHA256). Use the Verification Tool on the Ticket Center dashboard page to generate a known good HMAC and compare it with your server's output.
Ticket Center not rendering. Make sure the <div id="hdh-ticket-center"> exists before the script loads. If you are using a SPA framework (React, Vue, etc.), the div may not exist in the DOM when the script runs. Use the framework specific approach shown in the Framework Integration section above.
HMAC mismatch with special characters in email. Ensure the email string passed to your HMAC function is in the exact same encoding (UTF 8) and has no leading or trailing whitespace. Call .trim().toLowerCase() on the email before computing the HMAC and before passing it to data-email.
Conversations not showing up. Conversations are tied to the email address. If the user's email changes, they will not see their previous conversations. Each unique email has its own set of conversations.