PlausibleProvider not passing nonce to preload link and init script

[eliezerbasubi]

Hey there,

After adding CSP to a Nextjs app, the plausible preload link is being blocked. This is because the link in the header doesn't have the nonce populated to it.

Refused to load the script 'https://plausible.customdomain.com/js/script.js' because it violates the following Content Security Policy directive: "script-src 'self' https: 'nonce-MThjMmQ0NDItNTAzYi00ODQ4LTlhMzktMWJlZjQwODkyYWVh' 'strict-dynamic'". Note that 'strict-dynamic' is present, so host-based allowlisting is disabled. Note that 'script-src-elem' was not explicitly set, so 'script-src' is used as a fallback.

Although the nonce is being passed to the scriptProps prop, the script loaded with the ID of next-plausible-init is not capturing the nonce.

[4lejandrito]

This may be related: #90.

[eliezerbasubi]

While they appear to be related, there is a distinction: the preloaded link in the header is being blocked by CSP.
As for the inline script, my suggestion would be to spread the scriptProps to the inline script to prevent it from being blocked by CSP if configured.

[4lejandrito]

Published as next-plausible@3.12.0. The nonce parameter will be inherited from scriptProps automatically.

[eliezerbasubi]

Published as next-plausible@3.12.0. The nonce parameter will be inherited from scriptProps automatically.

Great!

Although this update resolves the issue with the inline script, the preloaded script link in the head is still being blocked by CSP because the nonce is not being passed.

Either Next.js or this package appears to be injecting a preloaded script link into the head that doesn't contain the nonce.

[4lejandrito]

I will look into it.