NoibuJS Script Overview
Before Noibu can collect session data from your eCommerce website, you must deploy the Noibu script to your website's header, verify that Noibu can access content on your content delivery network (CDN), and ensure your Referrer Policy and Referer Header on your website allow Noibu to capture session data correctly.
1. Deploying Noibu Script
There are several deployment options available, depending on whether you use a manual approach, a tag management system, or as part of your eCommerce platform.
Deployment via eCommerce Platform (preferred method)
If your store is built on an eCommerce platform, Noibu offers seamless integration to Shopify and BigCommerce via our apps, or specific deployment steps for Magento. Review the following articles detail the preferred approach for deploying Noibu on these platform providers:
Deployment via Tag Management System
For other platforms or custom implementations, you can deploy the Noibu script through a tag manager software:
Manual Script Deployment
Even without a tag management solution, you can deploy the following script directly into the html <head> tag of every webpage a user visits, including checkout pages.
<script src="https://cdn.noibu.com/collect-core.js"></script>
This enables Noibu to capture all events on your website.
After Script Deployment
After you've deployed the script to your site, Noibu's technical team will finish configuring your domain. During this time, you'll see the following script response: We're almost there! Your domain is being added. For any questions, contact Noibu support.
No further action is needed at this point. Once your domain has been successfully configured on Noibu's end (normally within 24 hours) this response will stop occurring.
2. Whitelisting/Allowlisting Noibu on your CDN
Noibu servers need to access content on your content delivery network (CDN) in order to replay sessions, collect data, accurately track errors, and beautify Stacktraces. Occasionally our servers may be blocked by your CDN's security features, which prevents Noibu from showing sessions and timelines accurately.
You must ensure Noibu's URLs, IP address, and user-agents are whitelisted with your CDN:
| URLs |
|
|---|---|
| IP Addresses |
|
| User Agents |
|
Note: If your company uses a Content Security Policy (CSP), you must whitelist the above URLs, IP Addresses and User Agent in the following source directives, otherwise your CSP will block Noibu’s script from loading:
- script-src
- connect-src
- worker-src
3. Configuring Referrer Policy and Referer Header
Adjusting the Referrer Policy and adding a Referer Header on your website is necessary to ensure that Noibu is capturing all session data correctly.
Adjusting the Referrer Policy
Review your current Referrer Policy to determine if the Referer Header is being sent.
You can check this by looking at the network traffic in your browser’s developer tools or by reviewing your site's configuration files.
If needed, update your Referrer Policy to the following:
strict-origin-when-cross-origin
Adding the Referer Header:
The Referer Header should be set as follows:
<https://www.yourdomain.com>
Replace https://www.yourdomain.com with the appropriate domain for your website.
Verifying the Configuration:
Once the changes are made, verify that the Referer Header is now being sent correctly. It should look like this:
You can use browser developer tools or a network monitoring tool to check the HTTP requests and confirm that the Referer Header is included.
Troubleshooting
It is possible that after a successful deployment, the Noibu script is still not successfully collecting errors. Here are some common issues.
- Deploying the Noibu Script twice can create potential conflicts. Avoid this by deploying once with the chosen method for your website.
- The NoibuJS script is not deployed to the correct place, or the correct page triggers are not utilized. Refer back to the deployment guide for your eCommerce platform or tag manager.