Как увидеть картинку в виде изображения по ссылке с сервера

Да ты посмотри, какая простая, казалось бы, хуйня — картинку по ссылке вставить. Ну, типа, взял и сунул в HTML этот самый тег <img>, и всё, пиздец. Как в детском саду, блядь.

Вот, смотри, элементарно:

<img src="https://example.com/image.jpg" alt="Описание изображения">

Всё, ёпта! src — это откуда тащить, alt — это что кричать, если картинка сдохла или пользователь слепой, как крот подземный. Но нет же, жизнь-то, сука, всегда найдёт, куда тебе палку в колёса вставить!

Нюансы, блядь, вылезают, как грибы после дождя, только не съедобные, а поганки ебаные.

Раз, авторизация. Представь, картинка-то не на помойке лежит, а в сейфе. Без ключа — нихуя. Тут уже не тегом отделаешься, придётся через fetch с токеном лезть, как вор в законе, или прокси-сервер свой городить. Напряжно, блядь.

Два, CORS. Это вообще отдельная песня, ёперный театр! Сервер, на котором картинка лежит, может быть таким засранцем, что скажет: «А я тебе, левому сайту, свою картинку не дам, пошёл на хуй!». И будет прав, технически. Надо, чтобы он специально разрешил.

Три, динамическая загрузка. Ну, если ты не просто в HTML пишешь, а через JS всё крутишь, типа «ой, а вдруг картинка не загрузится, я тогда в консоль похачу». Вот так:

const img = new Image();
img.src = 'https://example.com/image.jpg';
img.onload = () => document.body.appendChild(img);
img.onerror = () => console.error('Ошибка загрузки изображения');

Вот смотришь на это всё и думаешь: «Ну и зачем такая жизнь, где просто картинку вставить — это уже квест на выживание?». А потом вспоминаешь, что в вебе вообще нихуя простого нет, одна сплошная боль и страдание. Но зато интересно, блядь!