Subresource Integrity: The resource X has an integrity attribute...

[bugok]

Hello,

I've just migrated my site (https://www.noamlerner.com) to congo - and I'm seeing an error in the Chrome console when initially loading the site:

Subresource Integrity: The resource 'https://www.noamlerner.com/js/appearance.min.022d0ebc3b46a335eb1c7ef79b7f2de143d7cd5156d433638592ef1ce5f8554e.js' has an integrity attribute, but the resource requires the request to be CORS enabled to check the integrity, and it is not. The resource has been blocked because the integrity cannot be enforced.
noamlerner.com/:17 Subresource Integrity: The resource 'https://www.noamlerner.com/css/main.bundle.min.5ea5a2723a6600ec162c3206366e9a4fbb0c82f79711e724dea2dfe92a2a864f.css' has an integrity attribute, but the resource requires the request to be CORS enabled to check the integrity, and it is not. The resource has been blocked because the integrity cannot be enforced.
noamlerner.com/:1 Subresource Integrity: The resource 'https://www.noamlerner.com/js/main.bundle.min.d4b727caf411cb5c3b421d0d427ed1e3daeafe0d04840327efad4978430edb8c.js' has an integrity attribute, but the resource requires the request to be CORS enabled to check the integrity, and it is not. The resource has been blocked because the integrity cannot be enforced.

This manifests in not loading the js/css files properly. See screenshot:

After clicking the 'Noam Lerner's Blog' link - the site loads fine.
I'm publishing my site using Cloudflare pages.
As per the documentation, I've made sure that Rocket Loader is disabled.

What can I do to fix this?

Thanks.

What could be the cause of this.

[bugok]

This was my own fault.

It was a misconfiguration of my Cloudflare Pages configuration. I published the site to both www.noamlerner.com as well as to noamlerner.com. When loading noamlerner.com, I got the error because the js files were referenced in www.noamlerner.com.

The solution was to add a CNAME entry for noamlerner.com to the same Cloudflare pages URL the www.noamlerner.com DNS entry points to.

Also, I needed to add relativeURLs = true to my config.toml to make sure the CSS/JS resources will be accessible from the right place.

[bugok]

Reopening, because I think I haven't found a bullet-proof solution yet. I'm not sure if this is because of hugo itself, the congo theme or the way I deploy the site using cloudflare pages and its DNS.

My blog's code is located here: https://github.com/bugok/blog
I use cloudflare pages to deploy my site. It's being deployed to blog-9g1.pages.dev/ . I also defined two CNAME entries: one for noamlerner.com and one for www.noamlerner.com - both to blog-9g1.pages.dev/ .
When I don't use relativeURLs, I get the error I mention in this discussion.

As I mentioned in this issue which I originally opened in congo's repo, when using relativeURLs, there's an issue with loading static files on 404 pages when using relativeURLs.

This is not a major issue, but out of curiosity - I'm wondering what's the best solution here.

Thanks!