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

Javascript-форум (https://javascript.ru/forum/)

- Общие вопросы Javascript (https://javascript.ru/forum/misc/)

- - Как заполучить изображение с фотохостинга через fetch() ? (https://javascript.ru/forum/misc/78139-kak-zapoluchit-izobrazhenie-s-fotokhostinga-cherez-fetch.html)

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

Вот ссылка на картинку:
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() нет?

Цитата:

Сообщение от Teamur

Почему же при указании в 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).

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

Цитата:

Сообщение от Aetae

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

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

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

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

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

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

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

Цитата:

Сообщение от Teamur

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

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

Цитата:

Сообщение от Teamur

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

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

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

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