#The loader.js Loader

Status: Available.

Purpose: one <script> tag connects the Walker Formulation Academy visit counter, behavior tracking, and chat to a site, and controls them through visitor consent.

#Contents

1. When to use it
2. Access
3. What the loader includes
4. Manual installation
5. Visitor consent
6. Cookie banner integration
7. How to verify the installation
8. Server response and caching
9. Notes
10. Open questions

#When to use it

• The site is bound to Walker Formulation Academy (by a module or a binding code), and you need chat, a counter, and behavior tracking without a server-side part.
• The module for your CMS (Bitrix, WordPress) installs the loader itself; you do not need to add the tag by hand.

If you only need a visit counter without binding the site, use the JS tracker by token.

#Access

#What the loader includes

The loader is built in the cloud from the site's settings and connects only the enabled parts.

All site settings:

Staff change the settings in the dashboard: "Promotion → System → Sites (module)".

#Manual installation

The public key is shown in the bind response (connector protocol); the dashboard does not currently display it (see open questions).

Step 1. Before the main tag, add the consent queue stub. It is needed so that a consent call made before the script loads is not lost.

<script>
  window.sapport = window.sapport || {
    q: [],
    consent: function (v) { this.q.push(['consent', !!v]); }
  };
</script>

Step 2. Add the loader of your site's cell (the example is for RU; for EN use https://wfacademy.org, for ID https://wfacademy.id):

<script async src="https://formula-cream.pro/api/v1/connector/loader.js?k=0123456789abcdef0123456789abcdef"></script>

Request parameters:

Step 3. Place the tag on all pages that should be counted (usually in the shared template, in <head> before </head>).

#Visitor consent

The mode is set by the consent_mode setting.

#Page API

// consent given
window.sapport.consent(true);

// consent revoked: stops behavior tracking
window.sapport.consent(false);

// the same via an event
window.dispatchEvent(new CustomEvent('sapport:consent', { detail: true }));
// the { granted: true } form is also accepted
window.dispatchEvent(new CustomEvent('sapport:consent', { detail: { granted: true } }));

#What exactly depends on consent

#Cookie banner integration

Wire the calls to the buttons of your consent banner:

document.querySelector('#cookie-accept').addEventListener('click', function () {
  window.sapport.consent(true);
});
document.querySelector('#cookie-reject').addEventListener('click', function () {
  window.sapport.consent(false);
});

// the saved choice on the next visit
if (localStorage.getItem('cookie-consent') === 'granted') {
  window.sapport.consent(true);
}

If your banner offers a choice by category, bind consent(true) to the "analytics" (statistics) category, not to "marketing".

#How to verify the installation

1. Open a page of the site with developer tools, "Network" tab. There should be a loader.js?k=… request with status 200.
2. Make sure the response is not a stub: the body must not equal /* Sapport connector: off */.
3. In the console, run typeof window.sapport.consent; the expected result is function.
4. Check the visit request: after the page loads, a POST /api/v1/track/visit goes out, with response 204.
5. In the dashboard under "Promotion → System → Sites (module)", the site should be in the "bound" state, with "Visit counter" and the parts you need enabled.
6. If both a module and a manual tag are on the page, visits will be doubled; keep one.

#Server response and caching

If you disable the site or a part in the dashboard, mind the cache: the loader will go empty on pages within 5 minutes.

#Notes

• Connecting it twice is safe: the loader guards against a double start (the __sapportConnector flag).
• For a Content-Security-Policy, allow scripts and connections to your cell's domain.
• The loader's counter does not support SPA navigation: it counts the page load, not an address change through the History API (behavior tracking does watch history.pushState).

#Open questions

1. For the owner. Where to get the public key without a module. The public_key field is in the binding response, but the dashboard does not show it and does not issue a ready-made tag. Manual installation is therefore supported as a protocol scenario, not as a dashboard button. A decision is needed: show the key and a ready-made tag in the site card.
2. Technical. The same key serves as the tracker token: should we warn that it is public and allows hits to be written from other people's pages (protection: limits and quota; see JS tracker).