Installation
Install the Ours Privacy experiment runtime via the tag manager or a manual script tag. Supports SPA frameworks including React, Vue, and Next.js.
Installation
The Ours Privacy experiment runtime is a small JavaScript file that evaluates experiments, assigns variants, and applies DOM modifications before the page fully renders.
Option 1: Tag Manager (Recommended)
If you are already using the Ours Privacy Tag Manager, add your Experiment Token to the Ours Init tag configuration. The tag manager will load the experiment script automatically on pages that match your experiments' URL targeting rules.
No separate script tag or manual installation is required.
Option 2: Manual Script Tag
Add the experiment script to the <head> of every page where you want experiments to run. Your token is shown on the experiment settings page in the dashboard.
CDN
<!-- Add to <head>, before other scripts -->
<script src="https://cdn.oursprivacy.com/experiment-init?token=YOUR_TOKEN" async></script>Custom Domain
If you have a custom domain configured (recommended), use it instead:
<!-- Add to <head>, before other scripts -->
<script src="https://YOUR_CUSTOM_DOMAIN/experiment-init?token=YOUR_TOKEN" async></script>Replace YOUR_TOKEN with the token shown on your experiment settings page, and YOUR_CUSTOM_DOMAIN with your configured custom domain.
Important: Load the script as early as possible in
<head>. For pages with redirect experiments, use the synchronous form (omitasync) so the redirect fires before the browser renders any content.
Redirect experiments
<!-- Synchronous — use on pages with redirect experiments -->
<script src="https://cdn.oursprivacy.com/experiment-init?token=YOUR_TOKEN"></script>SPA Frameworks (React, Vue, Next.js)
The experiment runtime automatically handles SPA navigation. When the visitor navigates to a new route (via pushState or replaceState), the runtime re-evaluates URL targeting and applies any matching experiments.
No additional configuration is required for SPA support.
Next.js (App Router)
Add the script tag to your root layout:
// app/layout.tsx
export default function RootLayout({ children }: { children: React.ReactNode }) {
return (
<html>
<head>
<script src="https://cdn.oursprivacy.com/experiment-init?token=YOUR_TOKEN" />
</head>
<body>{children}</body>
</html>
);
}Checking that the SDK is ready
The SDK exposes window.ours_experiments after initialization. In framework code, check for its existence before calling SDK methods, or use the on('assigned', cb) event to react when assignments are ready.
Verifying Installation
After adding the script, open your browser's developer console and run:
window.ours_experiments.getAssignments();
// { "exp-id-1": "variant-id-1", ... }If you see an empty object {}, either no active experiments target the current URL, or the visitor was not included in the traffic allocation. Check the experiment's targeting rules and traffic allocation percentage in the dashboard.
Next Steps
- JavaScript SDK: Programmatic API for reading assignments and tracking conversions
- Content A/B Tests: Guide to DOM modification experiments
- Redirect Tests: Guide to redirect experiments
- Personalization: Always-on audience targeting
How is this guide?