Question

Droplet "has been blocked by CORS policy: No 'Access-Control-Allow-Origin'" Error

I have deployed my website for some time and it worked well. But today I find it not loading with an “Access to fetch at ‘https://market-assets.fra1.cdn.digitaloceanspaces.com/market-assets/hdris/potsdamer-platz/potsdamer_platz_1k.hdr’ from origin https://lkhovo.me has been blocked by CORS policy: No ‘Access-Control-Allow-Origin’ header is present on the requested resource. If an opaque response serves your needs, set the request’s mode to ‘no-cors’ to fetch the resource with CORS disabled.” Error.

I asked gpt and edited the etc/nginx/site-available/digitalocean file. edited the server section to add the following lines:

location / {
add_header Access-Control-Allow-Origin https://lkhovo.me; 
add_header Access-Control-Allow-Methods "GET, POST, OPTIONS";
add_header Access-Control-Allow-Headers "DNT,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type,Range"; 
add_header Access-Control-Expose-Headers "Content-Length,Content-Range"; 
}

but still not working

What should I do?


Submit an answer


This textbox defaults to using Markdown to format your answer.

You can type !ref in this text area to quickly search our full set of tutorials, documentation & marketplace offerings and insert the link!

Sign In or Sign Up to Answer

These answers are provided by our Community. If you find them useful, show some love by clicking the heart. If you run into issues leave a comment, or add your own answer to help others.

Bobby Iliev
Site Moderator
Site Moderator badge
June 8, 2023
Accepted Answer

Hi there,

As you are using the DigitalOcean Spaces for your static assets, you need to also configure your CORS in your Spaces settings rather than the Nginx configuration that GTP has suggested.

You can do that by following the steps here:

https://docs.digitalocean.com/products/spaces/how-to/configure-cors/

Update:

Solved running a npm update and deploy again

Let me know how it goes!

Best,

Bobby

It has nothing to do with your website or sever or your CORS settings - the guys from Three.js and Fiber and so messed up - the server where the Envirenment Image (city, wood, studio…) was hosted is blocking any request - you should anyways not use that in production but rather use your own image.

I’m seeing the same error with the exact same url. It was working before but recently stopped working. It’s failing when I’m trying to render my ThreeJS scene.

Try DigitalOcean for free

Click below to sign up and get $200 of credit to try our products over 60 days!

Sign up

Become a contributor for community

Get paid to write technical tutorials and select a tech-focused charity to receive a matching donation.

DigitalOcean Documentation

Full documentation for every DigitalOcean product.

Resources for startups and SMBs

The Wave has everything you need to know about building a business, from raising funding to marketing your product.

Get our newsletter

Stay up to date by signing up for DigitalOcean’s Infrastructure as a Newsletter.

New accounts only. By submitting your email you agree to our Privacy Policy

The developer cloud

Scale up as you grow — whether you're running one virtual machine or ten thousand.

Get started for free

Sign up and get $200 in credit for your first 60 days with DigitalOcean.*

*This promotional offer applies to new accounts only.