Как браузер поймет что получил картинку

Браузер определяет тип контента по HTTP-заголовку Content-Type. Для изображений он выглядит так: Content-Type: image/jpeg, image/png, image/gif и т.д. Если заголовок отсутствует или неверный, браузер может попытаться определить тип по сигнатуре файла (первые байты данных).

Пример проверки в JavaScript:

fetch('image.jpg')
  .then(response => {
    const contentType = response.headers.get('Content-Type');
    console.log(contentType); // "image/jpeg"
  });

Если тип указан неверно (например, text/html), браузер может не отобразить изображение корректно, даже если данные верны.