Media upload from URL not working

System Information
  • Strapi Version: 3.6.1
  • Operating System: nixos-20.03 & platform.sh
  • Database: sqlite & postgres
  • Node Version: 12.21.1
  • NPM Version: 6.14.11
  • Yarn Version: 1.22.5

Import images using the “From URL” tab doesn’t work: after pasting the URL and clicking Upload, the preview thumbnail gets a red border and importing the image fails. Tested on many occasions, using Strapi 3.5.2 - 3.6.1

URL I tried: http://4levels.org/4levels-uc.png

Hi @4levels,

Which upload plugin do you use ?

Hi @Stun3R ,

sorry I didn’t mention this, I’m using the default strapi-plugin-upload, can you verify that this doesn’t work for you either?

Hi again @4levels,

I got the same problem and the logs show that it’s due to a none allowed Access -Control -Allow -Origin

Hi @Stun3R,

Somehow this also happened with the other random images I tested, after searching for “public image for testing download” in Google. The other images I tested are all listed here: Home - College of Engineering - University of Wisconsin-Madison

Apparently these images as well are protected over CORS :man_facepalming:

If I use an image from eg. WikiMedia Commons, all works well. eg this one

Hello, I am also facing the same issue. Do we have any solution on this?

Has there been a solve for this? Is there anything one can do on the strapi end to get this functionality working for any domain?

omg no help here! same thing. I added the domain i am trying to fetch from to the middleware.js cors object, but that didnt seem to help. And all we find here is spam ;(

how is this marked as a solution? I know its a cors thing and have added this to middlewares.js :slight_smile: name: “strapi::cors”,
config: {
origin: [
http://localhost:3001”,
http://localhost:3000”,
https://mateaspares.com”,
http://localhost:1337”,
https://mateas-pares-backend.fly.dev”,
https://mateas-staging.netlify.app”,
https://mateasparesstrapi-production.up.railway.app”,
https://media.mateaspares.com
],
methods: [“GET”, “POST”, “PUT”, “PATCH”, “DELETE”, “HEAD”, “OPTIONS”],
headers: [“Content-Type”, “Authorization”, “Origin”, “Accept”],
keepHeaderOnError: true,
},

the last domain is the one i am trying to fetch from