Как заполучить изображение с фотохостинга через fetch() ?

[Teamur]

Вот ссылка на картинку:
https://cdn1.savepice.ru/uploads/201...7bd08-full.jpg

Если указать её в src <img> всё отлично, но
если через JS:

fetch('https://cdn1.savepice.ru/uploads/2019/7/31/62d20b4eb0c7f38d8355a0858757bd08-full.jpg')
.then(res=>res.blob())
.then(blob=>{
let img=document.createElement('img');
img.src=URL.createObjectURL(blob);
document.body.append(img)
})

то не работает, а в консоли выдаёт:

Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at https://cdn1.savepice.ru/uploads/201...7bd08-full.jpg. (Reason: CORS header ‘Access-Control-Allow-Origin’ missing).

TypeError: NetworkError when attempting to fetch resource.

Почему же при указании в src я могу заполучить ресурс, а при fetch() нет?

[Malleys]

Почему же при указании в src я могу заполучить ресурс, а при fetch() нет?

Так вон же в консоли выдаёт:

Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at https://cdn1.savepice.ru/uploads/201...7bd08-full.jpg. (Reason: CORS header ‘Access-Control-Allow-Origin’ missing).

[Aetae]

Безопасность - незя грузить ничего чужого напрямую. Когда ты используешь img, script, link и пр. ты также не имешь никакого доступа к тому что там загрузилось. Т.о. ты никак не можешь спереть инфу не предназначенную для тебя, пользователь может увидеть - а ты нет.

[Malleys]

ты никак не можешь спереть инфу не предназначенную для тебя, пользователь может увидеть - а ты нет.

А если использовать CORS Proxy?

[рони]

А если использовать CORS Proxy?

ссылки с примерами
https://javascript.ru/forum/misc/764...tml#post501902
https://javascript.ru/forum/misc/714...odom-cors.html
https://javascript.ru/forum/misc/767...tml#post503550
https://javascript.ru/forum/events/7...tml#post508197

[Teamur]

Спасибо )) Я предполагал, что туплю ))

Просто необычно, при <img src='...'> хостинг отвечает, файл отсылается и я вижу картинку.

Потом возникла мысль: Отлично, а запрошу-ка его через fetch, а потом, например, дам возможность пользователю сохранить файл у себя на компе в IndexedDB.

С изображениями, наверное, можно через canvas сделать слепок, но это уже трюки ))

Интересно при <img src='..'> - Что же там браузер прописывает в запросе, чего нет в fetch ?
Ведь это тоже GET-запрос

[Alexandroppolus]

С изображениями, наверное, можно через canvas сделать слепок, но это уже трюки ))

Нет, в данном случае нельзя.

Интересно при <img src='..'> - Что же там браузер прописывает в запросе, чего нет в fetch ?
Ведь это тоже GET-запрос

Тут важнее, что сервер приписывает в ответе )
https://learn.javascript.ru/xhr-crossdomain

Браузер не позволяет получить в скрипте какое-либо содержимое с другого домена, если тот сервер не даст специальное разрешение. Потому ни xhr, ни канва, ни ифрейм никуда не пропустят. Даже в таблицу стилей нельзя программно заглянуть.

[Teamur]

Alexandroppolus,
теперь всё понятно )
Всем спасибо за ответы!