Verification hash generation.

You can provide a user identifier and metadata to the widget to identify and personalize the user experience. Providing an identifier lets us to know a user is logged in and ties user sessions together. Metadata will be shown to logged in human agents and available as context for AI agents.

Verification hashes allow us to know that the identifier and metadata you provide for a user are valid and have not been tampered with. This is important for ensuring the security of your widget implementation. Without adding verification hashes to your widget, logged in users will not be able to be securely identified, and metadata will not be able to be trusted.

You will need to generate two verification hashes: one for the user identifier and one for the metadata. The hashes are generated using sha256 hash and a verification secret key that is unique to your project. Example code is shown below.

// Helper function to generate verification hash
function generateVerificationHash($data, $secret) {
    return hash_hmac('sha256', $data, $secret);
}

// Prepare the data
$secret = '{YOUR_VERIFICATION_SECRET}';
$userId = 'user-example-123';
$metadata = [
    'signed_up_at' => '2025-01-22 01:12:43',
    'plan' => 'premium'
];

// Generate the hashes
$userHash = generateVerificationHash($userId, $secret);
$metadataHash = generateVerificationHash(json_encode($metadata), $secret);
import hmac
import hashlib
import json

# Helper functions to generate verification hashes
def generate_user_hash(user_id: str, secret: str) -> str:
    return hmac.new(
        secret.encode('utf-8'),
        user_id.encode('utf-8'),
        hashlib.sha256
    ).hexdigest()

def generate_metadata_hash(metadata: dict, secret: str) -> str:
    metadata_str = json.dumps(metadata, sort_keys=True)
    return hmac.new(
        secret.encode('utf-8'),
        metadata_str.encode('utf-8'),
        hashlib.sha256
    ).hexdigest()

# Prepare the data
secret = '{YOUR_VERIFICATION_SECRET}'
user_id = 'user-example-123'
metadata = {
    'signed_up_at': '2025-01-22 01:12:43',
    'plan': 'premium'
}

# Generate the hashes
user_hash = generate_user_hash(user_id, secret)
metadata_hash = generate_metadata_hash(metadata, secret)
const crypto = require('crypto');

// Helper function to generate verification hash
function generateVerificationHash(data, secret) {
    return crypto
        .createHmac('sha256', secret)
        .update(data)
        .digest('hex');
}

// Prepare the data
const secret = '{YOUR_VERIFICATION_SECRET}';
const userId = 'user-example-123';
const metadata = {
    signed_up_at: '2025-01-22 01:12:43',
    plan: 'premium'
};

// Generate the hashes
const userHash = generateVerificationHash(userId, secret);
const metadataHash = generateVerificationHash(JSON.stringify(metadata), secret);
require 'openssl'
require 'json'

# Helper functions to generate verification hashes
def generate_user_hash(user_id, secret)
  OpenSSL::HMAC.hexdigest('sha256', secret, user_id.to_s)
end

def generate_metadata_hash(metadata, secret)
  metadata_string = JSON.generate(metadata)
  OpenSSL::HMAC.hexdigest('sha256', secret, metadata_string)
end

# Prepare the data
secret = '{YOUR_VERIFICATION_SECRET}'
user_id = 'user-example-123'
metadata = {
  signed_up_at: '2025-01-22 01:12:43',
  plan: 'premium'
}

# Generate the hashes
user_hash = generate_user_hash(user_id, secret)
metadata_hash = generate_metadata_hash(metadata, secret)

Replace {YOUR_VERIFICATION_SECRET} with your project verification secret found at Settings > Widget.

Advanced widget code.

Once you have generated your verification hashes, you can use them in the widget installation code snippet;

<script>
    window.h2hQueue = window.h2hQueue || [];
    function h2h() { h2hQueue.push(arguments); }
    h2h('init', {
        project_id: '{YOUR_PROJECT_ID}',
        contact: {
            name: 'John Doe',
            email: '[email protected]',
            identifier: 'user-example-123',
            hash: '{USER_HASH}',
            metadata: {
                hash: '{METADATA_HASH}',
                signed_up_at: '2025-01-22 01:12:43',
                plan: 'premium',
            }
        }
    });
</script>
<div id="happytohelp"></div>
<script src="https://js.happytohelp.com/widget.js" async></script>

Replace {YOUR_PROJECT_ID} with your project ID found at Settings > Widget, and replace {USER_HASH} and {METADATA_HASH} with the hashes generated above.