Как браузер определяет, что файл является изображением?

Браузер определяет тип файла, включая изображения, в основном по информации, предоставляемой сервером в HTTP заголовках ответа, а именно по заголовку Content-Type.

При запросе файла (например, изображения), сервер отправляет его браузеру вместе с HTTP заголовками. Заголовок Content-Type содержит MIME-тип файла, например:

• image/jpeg для JPEG-изображений
• image/png для PNG-изображений
• image/gif для GIF-изображений
• image/svg+xml для SVG-изображений

Браузер считывает этот заголовок до начала обработки тела ответа. На основе значения Content-Type браузер понимает, как интерпретировать полученные данные. Если Content-Type указывает на тип изображения (например, начинается с image/), браузер понимает, что должен обработать данные как изображение и отобразить его соответствующим образом.

В случае отсутствия или некорректного Content-Type заголовка, браузер может попытаться определить тип файла по его расширению (.jpg, .png, .gif) или по магическим числам (первые байты файла, которые характерны для определенного формата). Однако Content-Type является наиболее приоритетным и надежным способом определения типа данных.

Пример HTTP заголовка ответа для изображения:

HTTP/1.1 200 OK
Content-Type: image/jpeg
Content-Length: 12345

...тело ответа (бинарные данные изображения)...

В этом примере браузер видит Content-Type: image/jpeg и понимает, что последующие байты составляют JPEG-изображение.