Installing the Osano.js in Next.js Applications
In Osano, the "Get Code" button will become active after creating and publishing your configuration. This button will provide you with the osano.js.
In your Next.js application, navigate to _document.js. copy and paste your Osano script tag into the <head>. This allows the Osano Consent Manager to be loaded on every page of your application. For compliance purposes, ensure that the osano.js is the first script that loads on your site.
Note: Consider using the berforeInteractive attribute. Scripts with beforeInteractive will always be injected inside the head of the HTML document regardless of where it's placed in _document.js. Read more about Next.js and loading priority here.
User_id / Customer_id
Once added and saved, run the application, inspect and check. You will see the script added inside the head tag.
Important: The Osano.js should be placed without any async or defer attributes. Compliance cannot be guaranteed when using the attributes above.
Once the osano.js is in your site's <head>, it will begin identifying scripts and cookies that exist on your site. This process can take a few minutes to a few hours, depending on the level of site traffic.
Important: Remember, the osano.js defaults to "Listener" mode. In Listener mode, the consent manager will NOT block any trackers and will NOT display dialogs to your visitors. You can use Osano in "Listener" mode and another CMP simultaneously if you migrate away from another provider. This way, there are no gaps in compliance.
Once you have collected enough reports from osano.js, you can work with your other business units to identify and classify all cookies/scripts/and local storage items. This exercise ensures that no "strictly necessary" scripts, cookies, or local storage get blocked.
We recommend that users remain in "Listener" mode until you have discovered and classified all relevant scripts and cookies.
After you have appropriately categorized each script and cookie, you can enable Permissive or Strict Mode and publish these changes.
You will now see the consent dialog on your website!