Browser SDK
Capture frontend errors and events directly from the browser — including unhandled exceptions and promise rejections.
Installation
bash
npm install @getlogflow/browserScript tag (no bundler)
html
<script src="https://unpkg.com/@getlogflow/browser/dist/browser.iife.js"></script>
<script>
LogFlowBrowser.init({
apiKey: 'lf_YOUR_API_KEY',
environment: 'production',
release: 'v1.2.3',
})
</script>ES module
typescript
import { init, log } from '@getlogflow/browser'
init({
apiKey: 'lf_YOUR_API_KEY',
environment: 'production',
release: 'v1.2.3',
})
// Manual logging
log.info('User clicked checkout')
log.error('Payment form validation failed', { field: 'cardNumber' })Auto-captured events
window.onerror— uncaught JavaScript errorsunhandledrejection— unhandled Promise rejections- Page URL, user agent, and environment added to every log
Configuration
typescript
init({
apiKey: 'lf_YOUR_API_KEY',
environment: 'production', // e.g. production, staging
release: 'v1.2.3', // app version / git SHA
ignorePatterns: [ // skip logs matching these strings
'ResizeObserver loop',
'Script error',
],
maxErrorsPerMinute: 20, // rate limit (default: 20)
})ℹ️
The Browser SDK uses
keepalive: true on pagehide and visibilitychange events to flush pending logs before the page unloads — so errors during navigation are not lost.Next.js
typescript
// app/layout.tsx
import { init } from '@getlogflow/browser'
if (typeof window !== 'undefined') {
init({
apiKey: process.env.NEXT_PUBLIC_LOGFLOW_API_KEY!,
environment: process.env.NODE_ENV,
release: process.env.NEXT_PUBLIC_APP_VERSION,
})
}