Collect script errors from visitors' browsers

How to do it

Listen for error and unhandledrejection on window. Send the message, the file, the line, the page path and the build with navigator.sendBeacon. Send no query string, form values or user ID. Cap reports at a few per page view, and put the endpoint behind the rate limit. Group reports by message and build, and alert on new ones after a deploy, as in alert on symptoms.

Examples

JavaScript example

const MAX_REPORTS = 5;
let sent = 0;
function report(message, source = '', line = 0) {
  if (sent++ >= MAX_REPORTS) return;
  navigator.sendBeacon('/errors', JSON.stringify({ message: String(message).slice(0, 500), source, line, path: location.pathname, build: document.documentElement.dataset.build }));
}
addEventListener('error', e => report(e.message, e.filename, e.lineno));
addEventListener('unhandledrejection', e => report(e.reason?.message ?? e.reason));

Python example

# Flask: log one line per report, no IP address or cookies
@app.post("/errors")
def browser_errors():
    data = request.get_json(force=True, silent=True) or {}
    app.logger.warning("browser_error build=%s path=%s line=%s message=%r",
        str(data.get("build"))[:40], str(data.get("path"))[:200], data.get("line"), str(data.get("message"))[:500])
    return "", 204

How to check

On a test page, throw an error and reject a promise. Both appear in the server log within a minute, with the build and path and no query string.

Sources

• HTML Standard (Runtime script errors)
• HTML Standard (Unhandled promise rejections)
• W3C Beacon

Related rules

• APS-49 Limit how often anyone can call your APIs in Application security
• OPS-18 Alert on symptoms in Operations and observability
• APP-50 Contain each crash to its panel in Web app interface
• STK-67 Use Sentry only for features GlitchTip lacks in Software choices