Intento loadImage() un archivo de un sitio web aleatorio a mi boceto, pero por alguna razón no funciona en muchos casos:
function preload() { img = loadImage("https://i.tpg.ua/news/news_20190724_103144_1563953504.jpg"); // <- this URL works fine // uncomment any of these lines to see the problem: //img = loadImage("https://breeze.ru/files/images/port_exmouth_3.jpg"); //img = loadImage("https://www.ticketswhales.com/wp-content/uploads/2021/01/Whales-Watching9-1100x1100.jpg"); //img = loadImage("https://i-foto-oboy.ru/pixes/ware/big/f03d7c2c05d2bbe348abd63e847a99c5.jpg"); //img = loadImage("https://glazamidrona.ru/wa-data/public/shop/img/snimok-ekrana-2020-04-29-v-19.06.19.png"); //img = loadImage("https://i.ytimg.com/vi/r-utuoM77zI/maxresdefault.jpg"); } function setup() { createCanvas(300, 300); image(img, 0, 0, width, height); } <script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/1.4.1/p5.min.js"></script>Todas las imágenes de los enlaces anteriores se pueden ver en el navegador o descargar, no entiendo cuál es la diferencia entre ellas y por qué la mayoría de ellas no se pueden cargar en el boceto.
p5.js says: It looks like there was a problem loading your image. Try checking if the file path (https://www.ticketswhales.com/wp-content/uploads/2021/01/Whales-Watching9-1100x1100.jpg) is correct, hosting the file online, or running a local server.No puede omitir CORS sin un proxy como https://cors-anywhere.herokuapp.com/corsdemo O propio servidor con la política de origen correcta O cambiar la configuración del navegador en el problema CORS.
control de acceso-permitir-origen:
https://i.tpg.ua/noticias/noticias_20190724_103144_1563953504.jpg
Sec-Fetch-Mode: no-cors
Sec-Fetch-Site: mismo origen:
https://breeze.ru/files/images/port_exmouth_3.jpg
https://developer.mozilla.org/en-US/docs/Web/HTTP/CORS
https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Referrer-Policy
https://developer.chrome.com/blog/referrer-policy-new-chrome-default/
