CSP Real-Time Monitoring

Real-time monitoring that protects against active threats like digital skimming, formjacking, and malicious script injection.

Requirements

• CSP implementation in your application

• JWT token configuration

• A Firstoken External Application

• A Firstoken Page configurated

Step-by-Step Setup

1

Create External Application

Why do you need to create an External Application?

The External Application serves as your authentication mechanism for secure communication between your website and Firstoken Monitor. When CSP violations occur on your payment pages, your server needs to authenticate these reports using a signed JWT token before sending them to our monitoring endpoints. This ensures that:

• Only legitimate reports from your domain are processed

• Malicious actors cannot flood your monitoring with fake violations

• Each report is cryptographically signed and verifiable

• Your monitoring data remains secure and tamper-proof

The Signing key type generates the secret key you'll use to create JWT tokens that authenticate each CSP violation report.

1. Access your Firstoken console and navigate to External Applications

2. Click "+ New External Application"

3. Fill in the basic information:

   • Name: Monitor my checkout page (or your preferred name)

   • Description: Application for payment page monitoring

   • Key Type: Select "Signing"

4. In Permissions, make sure to select:

   • Monitor a Page

5. Configure IP Whitelist:

   • You must use 0.0.0.0/0

6. Save the configuration

Important: Securely save your Secret Key - you'll need it to generate JWT tokens.

2

Create Page Monitor

1. Go to Monitor > Pages in the console

2. Click "+ New Page Monitor"

3. Configure the page information:

   • Name: Monitor my Checkout Page

   • Description: Description of your payment page

   • Base URL: https://your-site.com/checkout (your payment page)

4. Enable CSP monitoring toggle

   1. URL patterns: URL patterns define which routes to monitor in real-time. This configuration is required for CSP monitoring. (If you need more information for this, please review the pattern type reference)

   2. Connect your External Application:

      • In the "External Application" section

      • Select the application you created in Step 1

5. Configure notifications:

   • Add email addresses that will receive alerts

   • The account owner's email is automatically included

6. Save the configuration

After creating the monitor, you'll receive a unique URL like:

https://monitor.firstoken.co/v1/pages/8BD7A644AC

3

Implement CSP on your server

Now you need to configure your Content Security Policy (CSP) to send reports to Firstoken Monitor when security violations are detected.

Basic example with Express.js:

const express = require('express');
const jwt = require('jsonwebtoken');

const app = express();
const SECRET_KEY = 'your-firstoken-secret-key'; // From Step 1
const MONITOR_URL = 'https://monitor.firstoken.co/v1/pages/8BD7A644AC'; // From Step 2

// Function to generate JWT token
function generateToken() {
    return jwt.sign(
        { jwtPayload: {} }, 
        SECRET_KEY, 
        { expiresIn: '15m' }
    );
}

// CSP middleware for payment pages
app.use('/checkout', (req, res, next) => {
    const token = generateToken();
    
    res.setHeader('Content-Security-Policy', 
        `default-src 'self'; ` +
        `script-src 'self' https://captures.firstoken.co https://api.firstoken.co; ` +
        `style-src 'self' https://fonts.googleapis.com; ` +
        `img-src 'self' data: https://fonts.googleapis.com; ` +
        `connect-src 'self' https://api.firstoken.co; ` +
        `font-src 'self' https://fonts.googleapis.com https://fonts.gstatic.com; ` +
        `object-src 'none'; ` +
        `base-uri 'self'; ` +
        `form-action 'self'; ` +
        `frame-ancestors 'self'; ` +
        `frame-src https://captures.firstoken.co; ` +
        `child-src 'self'; ` +
        `worker-src 'none'; ` +
        `report-uri ${MONITOR_URL}?t=${token}`
    );
    
    next();
});

app.listen(3000, () => {
    console.log('Server running on port 3000');
});

Even simpler example (no dependencies):

const jwt = require('jsonwebtoken');

const SECRET_KEY = 'your-firstoken-secret-key';
const MONITOR_URL = 'https://monitor.firstoken.co/v1/pages/8BD7A644AC';

function generateToken() {
    return jwt.sign({ jwtPayload: {} }, SECRET_KEY, { expiresIn: '5d' });
}

function addCSPHeader(req, res, next) {
    const token = generateToken();
    
    res.setHeader('Content-Security-Policy', 
        `default-src 'self'; script-src 'self'; style-src 'self'; ` +
        `img-src 'self'; font-src 'self'; connect-src 'self'; ` +
        `frame-ancestors 'self'; frame-src 'self'; child-src 'self'; ` +
        `worker-src 'none'; report-uri ${MONITOR_URL}?t=${token}`
    );
    
    next();
}

// Use on your payment routes
app.use('/checkout', addCSPHeader);
app.use('/payment', addCSPHeader);

---

CSP Configuration for different scenarios

For sites with external JavaScript:

function generateCSPForPaymentProviders() {
    const token = generateToken();
    
    return `default-src 'self'; ` +
           `script-src 'self' https://captures.firstoken.co https://api.firstoken.co https://www.googletagmanager.com; ` +
           `connect-src 'self' https://api.firstoken.co https://www.google-analytics.com; ` +
           `frame-src https://captures.firstoken.co https://api.firstoken.co/proxy; ` +
           `style-src 'self' https://fonts.googleapis.com; ` +
           `font-src 'self' https://fonts.googleapis.com https://fonts.gstatic.com; ` +
           `img-src 'self' data: https://www.google-analytics.com; ` +
           `report-uri https://monitor.firstoken.co/v1/pages/8BD7A644AC?t=${token}`;
}

For sites with CDN:

function generateCSPForCDN() {
    const token = generateToken();
    
    return `default-src 'self'; ` +
           `script-src 'self' https://cdn.firstoken.co https://captures.firstoken.co; ` +
           `style-src 'self' https://cdn.firstoken.co https://fonts.googleapis.com; ` +
           `font-src 'self' https://fonts.googleapis.com https://fonts.gstatic.com; ` +
           `img-src 'self' data: https://cdn.firstoken.co; ` +
           `frame-src https://captures.firstoken.co; ` +
           `frame-ancestors 'self' https://captures.firstoken.co; ` +
           `report-uri https://monitor.firstoken.co/v1/pages/8BD7A644AC?t=${token}`;
}

4

Verification and Testing

1. Verify your CSP is active:

Open your browser's developer tools and go to the Network tab. Look for response headers and confirm that Content-Security-Policy is present.

2. Test report generation:

Try loading an unauthorized script on your page to generate a CSP violation and verify that the report is sent to Firstoken Monitor.

3. Check notifications:

Verify that alerts reach the configured destinations:

• Email notifications: Alerts sent to configured email addresses

• Webhook notifications: If you've configured a webhook in the Firstoken console, violations will also be sent via HTTP POST to your specified URL

4. Monitor the dashboard:

Log into your Firstoken console to view real-time violation reports and detailed incident analysis.

---

Pattern Types Reference

Pattern Type	Symbol	Example	Description
Single segment	*	/checkout/*	Monitors one level deep
Multiple segments	**	/api/**/data	Monitors multiple nested levels
Named parameters	:param	/products/:id	Dynamic route parameters
Exact match	-	/login	Specific route only

Common Pattern Examples

1. Specific Path Patterns (REST OF PATH)

These patterns cover specific path segments or routes matching a base structure. The asterisk * at the end indicates that anything after that point is monitored.

Pattern	Description & Usage
/wps/payments/bienvenidos*	Matches exact path /wps/payments/bienvenidos and all sub-routes
/dashboard/analytics	Matches exact analytics report route
/user/settings*	Matches /user/settings and sub-routes (e.g., /user/settings/security)
/api/v2/data	Matches specific API endpoint
/products/clothing/shoes/nike	Matches detailed product route
/users/john/orders*	Monitors orders section for specific user and sub-routes

2. Single and Multiple Segment Patterns

Pattern	Description & Usage
/*	General Wildcard: Monitors all single-level routes after base URL (e.g., /checkout, /login)
/api/*	Monitors any single segment following /api/ (e.g., /api/v1/status)
/files/**/reports	Double Wildcard **: Monitors routes with multiple variable segments ending in /reports
/company/**/locations/**	Monitors complex nested structures (e.g., /company/tech/locations/berlin)

3. Patterns with Named Parameters

Used for monitoring routes with dynamic values like user IDs, product IDs, or post IDs. The colon : defines the variable.

Pattern	Description & Usage
/products/:id	Monitors any product route where :id is the dynamic product ID (e.g., /products/12345)
/users/:id/posts/:postId	Monitors specific post (:postId) from specific user (:id)
/checkout/:sessionId	Monitors checkout sessions with dynamic session IDs

Quick Reference

URL Patterns Configuration Summary:

• * (Single Asterisk): Matches sub-routes at the end (e.g., /dashboard/*)

• ** (Double Asterisk): Matches multiple variable route segments (e.g., /files/**/docs)

• : (Named Parameters): Used for dynamic routes (e.g., /products/:id)

For comprehensive monitoring including all sub-routes from base URL (like checkout pages), use the broadest pattern: /**

---

Rate Limiting for CSP Performance

CSP Real-Time monitoring implements rate limiting to ensure optimal performance:

• Each IP address can make up to 15 requests per minute.

• If the limit is exceeded, requests are blocked automatically.

• Limits are reset at the beginning of each new minute.

Performance Benefits:

• Optimized resource allocation

• Consistent response times for all users

• Protection against service degradation

• Enhanced application stability

Note: Rate limiting applies only to CSP Real-Time Monitoring.

Comparison with Other Monitor Features

Resources and Script Inventory works alongside other Firstoken Monitor security tools:

Feature	Purpose	Implementation Required	Scanning Frequency
CSP Real-Time Monitoring	Detect runtime security violations	JavaScript code + CSP headers	Real-time continuous
Security Headers Scanner	Validate HTTP security headers	None	Weekly automated
Resources Inventory	Manage JavaScript and CSS inventory	None	Weekly automated

Each feature addresses different security and compliance requirements and can be used independently or together for comprehensive protection.