thheller
CORS problem with code splitting
I'm storing all application modules which shadow-cljs bult on CDN (in my case it's AWS CloudFront).
When application is trying to lazy load chunk I have a cors problem
Access to XMLHttpRequest at 'https://mycdn.test.com/v1.264.1/js/sign-in.77297BAA.js' from origin 'https://helloworld.com' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.
And some times it works. Which is very strange. Cloudfront was configured to send correct CORS header
CORS is controlled server-side, so there is no setting in shadow-cljs regarding this.
Need more information about the setup in case there are other maybe-related things going wrong.
Hmm, what type of details I can provide? Main app script and all chunks on CDN Cloudfront. Cloudfront return correct CORS headers. Sometimes when app trying lazy load some chunk (main script on website domain and chunk on CDN) I can see problem which I mentioned in first message. When I check headers of this request I can't see any response headers related to CORS. The strange thing that for some chunks it works fine for another doesn't work. Randomly.
I cannot help you debug your server-side issues, so random things you'll have to sort out yourself. As I said the server is solely responsible for CORS headers, the client does absolutely nothing beyong requesting the files.
The only thing I can comment on is your build config and the code loading the actual chunks. The default loader code has some weird retry logic if a chunk failed to load, but it doesn't introduce any randomness. IMHO nowadays :target :esm should be used with dynamic imports instead just so we can rely a bit more on the build-in browser logic for handling these things.
See https://clojureverse.org/t/generating-es-modules-browser-deno/6116