CORS errors when using image/video from dato as textures in three.js

Hello i’m using DatoCMS to upload mp4 videos or images to use as mapped textures with three.js in my vue + nuxt project.

But currently SOMETIMES, im getting a CORS error like so:

For images
Access to image at 'https://www.datocms-assets.com/....examplepath here....png' from origin 'https://myurl.here' has been blocked by CORS policy: The 'Access-Control-Allow-Origin' header has a value 'https://myurl.here' that is not equal to the supplied origin

Or

For videos:
Access to fetch at 'https://stream.mux.com/....pathhere.../medium.mp4' from origin 'https://myurl.here' has been blocked by CORS policy: Request header field range is not allowed by Access-Control-Allow-Headers in preflight response.

Strangely, this problem happens sometimes, usually on first load. And if i have my chrome dev tools open, with ‘disable cache’ checked, this problem goes away. This happens on my localhost and also when i host it on netlify too

I’ve even tried adding crossorigin=“anonymous” attributes to the video element but this didnt solve anything.

Unfortunately this is fairly urgent :frowning: If anyone has any idea how to solve this, i’ll be grateful!

2 Likes

hey @mykim welcome to Community!

We should already support CORS, in fact if that works every now and then it’s very strange.

Can you maybe share your site so that I can have a look?

HI @mat_jack1

thansk for the reply. you cna see the test site here:

Currently im appending a timestamp on the url as a last resort. The time stamps seem to solve the localhost issues but it still working on and off online.
I dont know what to do :frowning:

Here’s just a snippet of how i’m using the video from the datocms query result in a for loop

    let new_video = document.createElement('video');
    new_video.className = "video_"+yy;
    new_video.setAttribute('crossorigin', 'anonymous');
    new_video.src = this.allArtists[yy].video.video.mp4Url+'?' + new Date().getTime()

CORS errors

hey @mykim the link is broken, did you change it?

hi @mat_jack1.

yes i changed the link, as i didnt. want the url to be in the public domain for now.

is it possible to DM you or email you the link perhaps?
But actually right now, i’ve switched the videos over to Vimeo Pro and i have no issues now. So not sure if seeing the site now would be of use.

if that works it’s fine, but if that happens again, yes please send over DM your link!

alright will do! thanks

1 Like