Set Up User Feedback

User Feedback API

The user feedback API allows you to collect user feedback while utilizing your own UI. You can use the same programming language you have in your app to send user feedback. In this case, the SDK creates the HTTP request so you don't have to deal with posting data via HTTP.

Sentry pairs the feedback with the original event, giving you additional insight into issues. Sentry needs the eventId to be able to associate the user feedback to the corresponding event. For example, to get the eventId, you can use beforeSend or the return value of the method capturing an event.

import * as Sentry from "@sentry/browser";

const eventId = Sentry.captureMessage("User Feedback");
// OR: const eventId = Sentry.lastEventId();

const userFeedback = {
  event_id: eventId,
  name: "John Doe",
  email: "john@doe.com",
  comments: "I really like your App, thanks!",
};
Sentry.captureUserFeedback(userFeedback);

Sentry.init({
  dsn: 'https://examplePublicKey@o0.ingest.sentry.io/0',
  beforeSend: event => {
    const userFeedback = collectYourUserFeedback();
    const feedback = {
      ...userFeedback,
      event_id: event.event_id.
    }
    Sentry.captureUserFeedback(feedback);
    return event;
  }
})

Alternatively, you can use the User Feedback API endpoint directly.

Crash-Report Modal

Our embeddable, JavaScript-based, Crash-Report modal is useful when you would typically render a plain error page (the classic 500.html) on your website.

To collect feedback, the Crash-Report modal requests and collects the user's name, email address, and a description of what occurred. When feedback is provided, Sentry pairs the feedback with the original event, giving you additional insights into issues.

The screenshot below provides an example of the Crash-Report modal, though yours may differ depending on your customization:

Integration

The modal authenticates with your public

<script>
  Sentry.init({
    dsn: "https://examplePublicKey@o0.ingest.sentry.io/0",
    beforeSend(event, hint) {
      // Check if it is an exception, and if so, show the report dialog
      if (event.exception) {
        Sentry.showReportDialog({ eventId: event.event_id });
      }
      return event;
    },
  });
</script>