Error Tracking

Capture JavaScript errors from your website in real time with stack traces, browser context, and email alerts.

Quick Start

1. Create a project

Go to Errors (opens in a new tab) in your dashboard and click Create your first project.

Give it a name (usually your website name) and you'll get a DSN key.

2. Add the script to your site

Paste this single line into your website's HTML <head>:

<script
  src="https://securecheap.com/cdn/track.js"
  data-key="sc_proj_YOUR_KEY_HERE"
  async></script>

Replace sc_proj_YOUR_KEY_HERE with the DSN from step 1.

That's it. Every JavaScript error your visitors encounter will appear in your dashboard within seconds.

Manual error reporting

The SDK also exposes a global SecureCheap object you can use anywhere in your code:

// Capture an exception
try {
  doSomethingDangerous()
} catch (err) {
  SecureCheap.captureException(err, { context: 'checkout-flow' })
}
 
// Capture a message
SecureCheap.captureMessage('Payment took longer than expected', 'warning')
 
// Identify the current user (useful for filtering errors by user)
SecureCheap.setUser('user_12345')
 
// Tag the current release version
SecureCheap.setRelease('v1.4.2')

Framework integration

React

// Add to your root component or _app.js
useEffect(() => {
  if (user?.id) SecureCheap.setUser(user.id)
}, [user])
 
// Error Boundary
class ErrorBoundary extends React.Component {
  componentDidCatch(error, info) {
    SecureCheap.captureException(error, { react: info })
  }
  render() { return this.props.children }
}

Vue 3

import { createApp } from 'vue'
const app = createApp(App)
 
app.config.errorHandler = (err, instance, info) => {
  window.SecureCheap?.captureException(err, { vue: info })
}

Plain HTML

Just add the script tag — all uncaught errors are captured automatically.

What gets captured

Every error includes:

Error type (TypeError, ReferenceError, etc.)
Error message
Full stack trace (with line/column numbers)
Page URL where the error occurred
Browser & OS of the user
Timestamp
Custom context (if provided)

Grouping

Identical errors are automatically grouped into a single Issue. For example, if the same TypeError: Cannot read property 'price' of undefined happens 1,000 times, you'll see ONE issue with eventCount: 1000 — not 1,000 separate entries.

The grouping fingerprint is based on the error type + top stack frame.

Plan limits

Plan	Events/month	Projects	Data retention
Free	1,000	1	7 days
Starter	50,000	3	30 days
Pro	250,000	10	90 days
Enterprise	Unlimited	Unlimited	365 days

When you exceed your quota, ingestion returns HTTP 429 and events are dropped. Upgrade in Billing (opens in a new tab).

Email notifications

You'll automatically receive:

New issue alerts — emailed the moment a new error fingerprint appears
Weekly digest — every Monday morning summarizing the past 7 days of activity per project

Both emails include a direct link to view the issue in your dashboard.

API reference

`SecureCheap.captureException(error, context?)`

Manually capture an exception. context is optional metadata attached to the event.

`SecureCheap.captureMessage(message, level?)`

Send a string-based event. level can be 'info', 'warning', or 'error' (default 'info').

`SecureCheap.setUser(userId)`

Associate subsequent events with a user ID. Pass null to clear.

`SecureCheap.setRelease(version)`

Tag subsequent events with a release version string.

Configuration options

<script
  src="https://securecheap.com/cdn/track.js"
  data-key="sc_proj_xxx"
  data-release="v1.0.0"
  data-debug="true"
  async></script>

Attribute	Purpose
`data-key`	Your project DSN (required)
`data-release`	Initial release tag
`data-debug`	Set to `"true"` to log SDK activity in browser console
`data-endpoint`	Override ingestion URL (advanced)

Privacy

No PII is automatically collected. Only error data + browser metadata.
IP addresses are SHA-256 hashed before storage.
You control what user data is sent via setUser().

Need help?

Overview AI Features