Welcome to Highlight
Getting Started
Overview
Backend / Server
Client / Frontend
Fullstack Frameworks
Tips
Content-Security-Policy
Local Development
Monkey Patches
Performance Impact
Proxying Highlight
Session Search Deep Linking
Troubleshooting
Upgrading Highlight
Session Replay
Console Messages
HTML iframe Recording
Identifying Users
Live Mode
Network DevTools
Privacy
Rage Clicks
Recording Network Requests and Responses
Session Sharing
Session Shortcut
Tracking Events
Versioning Sessions
Error Monitoring
Grouping Errors
Sourcemaps
Versioning Errors
Product Features
Alerts
Analytics
Canvas
Comments
Environments
Frontend Observability
Keyboard Shortcuts
Performance Data
Segments
Session Search
Team Management
User Feedback
Web Vitals
WebGL
Integrations
Amplitude Integration
Clearbit Integration
Electron Integration
Front Plugin
Intercom Integration
Linear Integration
Mixpanel Integration
React.js Integration
Segment Integration
Sentry Integration
Slack Integration
Vercel Integration
highlight.run Changelog
5.0.0
5.0.1
5.1.0
5.1.1
5.1.2
5.1.3
5.1.4
5.1.5
Menu
Docs / Getting Started / Backend / Server / Overview

Overview

What's this?

Highlight's Full-stack integration allows you to get visibility into errors and issues across your whole stack, not just your frontend. These errors are paired with outgoing requests on your frontend so that you can understand:

  • Exactly what happened when a user reports a bug

  • Where specific errors are initiated and what caused them

See errors and their relevant details in the same session timeline where you can find out exactly what a user was doing that led up to the issue.

What does it look like?

Below is an example of a backend error (thrown in go ) ,mapped to an actual network request on a user's frontend.

How can I start using this?
Frontend Changes

All you need to do is enable a flag in Highlight and confirm the version of Highlight you're using on your client to allow the frontend to instrument any requests to your backend.

Confirm your client version

Required Highlight highlight.run version: >=2.8.1

Turn on tracingOrigins

Set the tracingOrigins option to an array of patterns matching the location of your backend. You may also simply specify true, which will default tracingOrigins to all subdomains/domains of the url for your frontend app.

H.init("<YOUR_PROJECT_ID>", { tracingOrigins: ['localhost', 'example.myapp.com/backend'], ... });
Copy
Turn on networkRecording
H.init("<YOUR_PROJECT_ID>", { networkRecording: { enabled: true, recordHeadersAndBody: true, }, ... });
Copy
Backend Changes

Backend changes are dependent on the underlying language/framework used on the server-side codebase. All you need to add is a middleware and code to capture errors.

Below are solutions for what we support today.

Go Backend Integration

Next.js Backend Integration

Express Backend Integration

Troubleshooting
  1. Ensure tracingOrigins and networkRecording are properly set.

  2. Ensure your backend has CORS configured for your frontend hostname, explicitely allowing header x-highlight-request.

  3. For debugging the backend SDK, enable verbose logging. For example, in go, add highlight.SetDebugMode(myLogger)