On your dev server, comments are written on your machine. For a client or a teammate, deploy a preview and let them comment there. The preview build is opted in with the project’s build secret; a build without it carries nothing of ours. Each project’s Setup tab has these steps with its own values filled in.
Turn on shared mode
Pass
sharedto the plugin, on wherever the build secretFEEDBACK_SECRETis set. The rest of the config stays as the Quickstart left it. Your framework’s config is below.Set the secret for preview builds
In your host’s environment variables, add
FEEDBACK_SECRETfor preview builds only. Its value is in the project’s Setup tab, and in Settings → Build secret.FEEDBACK_SECRET=sk_prj_…Allow the preview's address
In the project’s Settings → Allowed sites, add the exact origin the preview is served from. Comments from any other address are refused.
Invite reviewers
In the project’s People tab, create a review link: whoever opens it can comment under the name you give, without an account. To give someone the dashboard too, invite them by email instead.
Shared mode in your config
The same config as in the Quickstart, with shared mode on wherever FEEDBACK_SECRET is set.
In vite.config.ts, feedback() stays first, before the React plugin:
import { feedback } from '@ontrackd/feedback/vite';
export default defineConfig({
plugins: [
feedback({ shared: Boolean(process.env.FEEDBACK_SECRET) }), // first
react(),
],
});In next.config.mjs, the options go after your config:
import { withFeedback } from '@ontrackd/feedback/next';
export default withFeedback(
{ /* your config */ },
{ shared: Boolean(process.env.FEEDBACK_SECRET) },
);<Feedback /> stays once in app/layout.tsx, as in the Quickstart:
import { Feedback } from '@ontrackd/feedback/next/overlay';
<body>
{children}
<Feedback /> {/* renders nothing in production */}
</body>In astro.config.mjs, on the integration:
import feedback from '@ontrackd/feedback/astro';
export default defineConfig({
integrations: [feedback({ shared: Boolean(process.env.FEEDBACK_SECRET) })],
});In nuxt.config.ts, through Nuxt’s Vite config:
import { feedback } from '@ontrackd/feedback/vite';
export default defineNuxtConfig({
vite: { plugins: [feedback({ shared: Boolean(process.env.FEEDBACK_SECRET) })] },
});In vite.config.ts, feedback() stays before sveltekit():
import { feedback } from '@ontrackd/feedback/vite';
export default defineConfig({
plugins: [
feedback({ shared: Boolean(process.env.FEEDBACK_SECRET) }), // first
sveltekit(),
],
});With the script tag there is no build and no shared mode: the live site is what reviewers comment on. The Quickstart covers it.
What a shared preview gives you
Anyone you let in can comment on the preview, and each comment still knows the file and line behind the element it points at. Without the project’s secret, nobody can read those locations from the preview.
Why production stays clean
Shared mode is on only where FEEDBACK_SECRET is set, and you set it for preview builds only. A production build, built without it, carries nothing of ours. A preview build needs the secret and no other variable.
Which address to allow
Allow one that stays the same between deploys, like your preview branch’s URL. A per-deployment URL changes on every push, and comments from the new one are refused until it is allowed.
