NextJS with CookieBot - Connection Closed

[SamC-Apadmi]

Summary

I'm having issues in my NextJS application using CookieBot.

In certain cases (which I've so far been unable to nail down), CookieBot seems to prevent NextJS from loading it's internal scripts. This doesn't happen when the user has chosen to accept all cookies.

It feels like there's something fundamentally incompatible here but given CookieBot and NextJS are both very widely used I'm hoping I'm missing something.

Additional information

The error thrown is: Connection Closed

Full console error:

VM1900 1684-f2cbba0eb2f60b9f.js:1 Uncaught Error: Unexpected server data: missing bootstrap script.
    at Array.j [as push] (VM1900 1684-f2cbba0eb2f60b9f.js:1:101975)
    at <anonymous>:1:15
    at dequeueNonAsyncScripts (uc.js:2:30055)
    at Object.dequeueNonAsyncScripts (uc.js:2:108263)
    at stopMutationObserver (uc.js:2:23800)
    at Object.stopMutationObserver (uc.js:2:108563)
    at uc.js:2:61231
j @ VM1900 1684-f2cbba0eb2f60b9f.js:1
(anonymous) @ VM1976:1
dequeueNonAsyncScripts @ uc.js:2
(anonymous) @ uc.js:2
stopMutationObserver @ uc.js:2
(anonymous) @ uc.js:2
(anonymous) @ uc.js:2Understand this error
VM1900 1684-f2cbba0eb2f60b9f.js:1 Error: Connection closed.
    at t (VM1900 1684-f2cbba0eb2f60b9f.js:1:165511)
i @ VM1900 1684-f2cbba0eb2f60b9f.js:1
oc @ 4bd1b696-ccc96e49a9fb4268.js:1
e.callback @ 4bd1b696-ccc96e49a9fb4268.js:1
lN @ 4bd1b696-ccc96e49a9fb4268.js:1
lL @ 4bd1b696-ccc96e49a9fb4268.js:1
oY @ 4bd1b696-ccc96e49a9fb4268.js:1
ue @ 4bd1b696-ccc96e49a9fb4268.js:1
uf @ 4bd1b696-ccc96e49a9fb4268.js:1
ue @ 4bd1b696-ccc96e49a9fb4268.js:1
uf @ 4bd1b696-ccc96e49a9fb4268.js:1
ue @ 4bd1b696-ccc96e49a9fb4268.js:1
uf @ 4bd1b696-ccc96e49a9fb4268.js:1
ue @ 4bd1b696-ccc96e49a9fb4268.js:1
uf @ 4bd1b696-ccc96e49a9fb4268.js:1
ue @ 4bd1b696-ccc96e49a9fb4268.js:1
uf @ 4bd1b696-ccc96e49a9fb4268.js:1
ue @ 4bd1b696-ccc96e49a9fb4268.js:1
uf @ 4bd1b696-ccc96e49a9fb4268.js:1
ue @ 4bd1b696-ccc96e49a9fb4268.js:1
uf @ 4bd1b696-ccc96e49a9fb4268.js:1
ue @ 4bd1b696-ccc96e49a9fb4268.js:1
uf @ 4bd1b696-ccc96e49a9fb4268.js:1
ue @ 4bd1b696-ccc96e49a9fb4268.js:1
uf @ 4bd1b696-ccc96e49a9fb4268.js:1
ue @ 4bd1b696-ccc96e49a9fb4268.js:1
uf @ 4bd1b696-ccc96e49a9fb4268.js:1
ue @ 4bd1b696-ccc96e49a9fb4268.js:1
uf @ 4bd1b696-ccc96e49a9fb4268.js:1
ue @ 4bd1b696-ccc96e49a9fb4268.js:1
uf @ 4bd1b696-ccc96e49a9fb4268.js:1
ue @ 4bd1b696-ccc96e49a9fb4268.js:1
uf @ 4bd1b696-ccc96e49a9fb4268.js:1
ue @ 4bd1b696-ccc96e49a9fb4268.js:1
uf @ 4bd1b696-ccc96e49a9fb4268.js:1
ue @ 4bd1b696-ccc96e49a9fb4268.js:1
uf @ 4bd1b696-ccc96e49a9fb4268.js:1
ue @ 4bd1b696-ccc96e49a9fb4268.js:1
uf @ 4bd1b696-ccc96e49a9fb4268.js:1
ue @ 4bd1b696-ccc96e49a9fb4268.js:1
uf @ 4bd1b696-ccc96e49a9fb4268.js:1
ue @ 4bd1b696-ccc96e49a9fb4268.js:1
uf @ 4bd1b696-ccc96e49a9fb4268.js:1
ue @ 4bd1b696-ccc96e49a9fb4268.js:1
uf @ 4bd1b696-ccc96e49a9fb4268.js:1
ue @ 4bd1b696-ccc96e49a9fb4268.js:1
uf @ 4bd1b696-ccc96e49a9fb4268.js:1
ue @ 4bd1b696-ccc96e49a9fb4268.js:1
uf @ 4bd1b696-ccc96e49a9fb4268.js:1
ue @ 4bd1b696-ccc96e49a9fb4268.js:1
uf @ 4bd1b696-ccc96e49a9fb4268.js:1
ue @ 4bd1b696-ccc96e49a9fb4268.js:1
uf @ 4bd1b696-ccc96e49a9fb4268.js:1
ue @ 4bd1b696-ccc96e49a9fb4268.js:1
uf @ 4bd1b696-ccc96e49a9fb4268.js:1
ue @ 4bd1b696-ccc96e49a9fb4268.js:1
uf @ 4bd1b696-ccc96e49a9fb4268.js:1
ue @ 4bd1b696-ccc96e49a9fb4268.js:1
uf @ 4bd1b696-ccc96e49a9fb4268.js:1
ue @ 4bd1b696-ccc96e49a9fb4268.js:1
uf @ 4bd1b696-ccc96e49a9fb4268.js:1
ue @ 4bd1b696-ccc96e49a9fb4268.js:1
uf @ 4bd1b696-ccc96e49a9fb4268.js:1
ue @ 4bd1b696-ccc96e49a9fb4268.js:1
uf @ 4bd1b696-ccc96e49a9fb4268.js:1
ue @ 4bd1b696-ccc96e49a9fb4268.js:1
uf @ 4bd1b696-ccc96e49a9fb4268.js:1
ue @ 4bd1b696-ccc96e49a9fb4268.js:1
uf @ 4bd1b696-ccc96e49a9fb4268.js:1
ue @ 4bd1b696-ccc96e49a9fb4268.js:1
uf @ 4bd1b696-ccc96e49a9fb4268.js:1
ue @ 4bd1b696-ccc96e49a9fb4268.js:1
uf @ 4bd1b696-ccc96e49a9fb4268.js:1
ue @ 4bd1b696-ccc96e49a9fb4268.js:1
uf @ 4bd1b696-ccc96e49a9fb4268.js:1
ue @ 4bd1b696-ccc96e49a9fb4268.js:1
uf @ 4bd1b696-ccc96e49a9fb4268.js:1
ue @ 4bd1b696-ccc96e49a9fb4268.js:1
uf @ 4bd1b696-ccc96e49a9fb4268.js:1
ue @ 4bd1b696-ccc96e49a9fb4268.js:1
uf @ 4bd1b696-ccc96e49a9fb4268.js:1
ue @ 4bd1b696-ccc96e49a9fb4268.js:1
iv @ 4bd1b696-ccc96e49a9fb4268.js:1
ig @ 4bd1b696-ccc96e49a9fb4268.js:1
u9 @ 4bd1b696-ccc96e49a9fb4268.js:1
u5 @ 4bd1b696-ccc96e49a9fb4268.js:1
iH @ 4bd1b696-ccc96e49a9fb4268.js:1
w @ VM1900 1684-f2cbba0eb2f60b9f.js:1Understand this error
VM1900 1684-f2cbba0eb2f60b9f.js:1 Error: Connection closed.

Example

No response

[icyJoseph]

Uff reading around, it looks like CookieBot might see some scripts as consent-bound (?), unless you add an attribute to skip them, or if you add them to the CookieBot dashboard? Is there any documentation from their side on "allow-list" or "allow-patterns" kind of thing, for scripts?

[SamC-Apadmi]

Unfortunately not, the only way I can see to allow-list scripts is to tag the scripts themselves which doesn't seem to be easily done with NextJS's own scripts.

I think we might be forced to move to Cookiebot's manual blocking mode rather than automatic, but it's a pity it doesn't work out of the box, not a nextjs issue though, I was hoping someone here might have a quick fix!