SaltyKeys.js Interactive Demo

1. Configuration

Configure SaltyKeys with custom settings:

// Default configuration
SaltyKeys.config = {
    urlPattern: /codepen\.io\/[^/]+\/(?:pen|debug|fullpage|fullembedgrid)\/([^?#]+)/,
    cacheEnabled: true,
    environment: 'codepen'
};

For this demo, we'll simulate a CodePen environment:

2. Generate Salted Key

Enter your API key to generate a salted version:

3. Retrieve Original API Key

Decode a salted key to get the original API key:

4. Test Source URL Changes

Change the simulated URL to test key validation across contexts:

5. Advanced Features

5.1. Custom URL Pattern

Configure a custom URL pattern for non-CodePen environments:

5.2. Key Metadata

Extract metadata from a salted key:

5.3. Environment Simulation

Change the environment setting to affect key handling:

Example Usage Code

// Example usage of SaltyKeys.js
const apiKey = 'my-secret-api-key-123';
const saltedKey = SaltyKeys.generateSaltedKey(apiKey);
console.log('Salted Key:', saltedKey);

// Later, when you need the original API key:
const originalKey = SaltyKeys.getApiKey(saltedKey);
if (originalKey) {
    // Use the original API key
    console.log('Original Key:', originalKey);
} else {
    console.warn('Failed to retrieve the API key');
}