Зачем вообще обслуживать данные 1x1 pixel GIF (веб-ошибки)?

во-первых, я не согласен с двумя предыдущими ответами-ни один из них не затрагивает вопрос.

изображение в один пиксель решает внутреннюю проблему для веб-приложений аналитики (например, Google Analytics) при работе в протоколе HTTP--как передать (веб-метрики) данные с клиента на сервер.

самый простой из методов, описанных протоколом, самый простой (по крайней мере, самый простой метод, который включает в себя тело запроса) является сделать запрос. Согласно этому методу протокола, клиенты инициируют запросы к серверам для ресурсов; серверы обрабатывают эти запросы и возвращают соответствующие ответы.

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

Итак, каково решение проблемы получение данных от клиента к серверу? в контексте HTTP существуют другие методы протокола, отличные от GET (например, POST), но это ограниченный вариант по многим причинам (о чем свидетельствует его нечастое и специализированное использование, такое как отправка данных формы).

Если вы посмотрите на запрос GET из браузера, вы увидите, что он состоит из URL-адреса запроса и Заголовки Запроса (например, заголовки Referer и User-Agent), последний содержит информация о клиенте, например, тип и версия браузера, язык браузера, операционной системы и т. д.

опять же, это часть запроса, что клиент отправляет на сервер. Так что идея, которая мотивирует однопиксельный gif, заключается в том, чтобы клиент отправлял данные веб-метрик на сервер, завернутые в заголовок запроса.

а то как заставить клиента запросить ресурс, чтобы его можно было "обмануть" в отправке метрик данные? и как заставить клиента отправить актуальные данные на сервер?

Google Analytics является хорошим примером:Джорджия.js файл (большой файл, загрузка которого на клиент запускается небольшим скриптом на веб-странице) включает в себя несколько строк кода, которые указывает клиенту запросить определенный ресурс с определенного сервера (сервера GA) и отправить определенные данные, завернутые в заголовок запроса.

но так как цель из этого запроса на самом деле не получить ресурс, а отправить данные на сервер, этот ресурс должен быть как можно меньше, и он не должен быть виден при визуализации на веб-странице-следовательно, 1 х 1 пиксель прозрачный gif. Размер-это самый маленький размер, а формат (gif) - самый маленький среди форматов изображений.

точнее, все данные GA--каждый отдельный элемент--собираются и упаковываются в строка запроса URL запроса (все после '?'). Но для того, чтобы эти данные шли от клиента (где он создается) к серверу GA (где он регистрируется и агрегируется), должен быть HTTP-запрос, поэтому ga.js (скрипт google analytics, который загружается, если он не кэшируется, клиентом, в результате функции, вызываемой при загрузке страницы) направляет клиенту собрать все данные аналитики-например, куки, панель местоположения, заголовки запросов и т. д.--объединить это в одну строку и добавить его в строку запроса URL (*http://www.google-analytics.com/__utm.gif*?) и это становится запрос URL.

это легко доказать с помощью любого веб-браузера, который позволяет просматривать HTTP-запрос для веб-страницы, отображаемой в вашем браузере (например, Safari Веб-Инспектор, Firefox / Chrome Firebug и т. д.).

например, я ввел действительный url-адрес корпоративной домашней страницы в строку местоположения моего браузера, которая вернула этот дом страница и отображается в моем браузере (я мог бы выбрать любой веб-сайт/страницу, которая использует одно из основных аналитических приложений, GA, Omniture, Coremetrics и т. д.)

браузер, который я использовал, был Safari, поэтому я нажал разработки в строке меню, а затем Показать Веб-Инспектор. В верхней строке веб-инспектора, нажать ресурсы, найдите и щелкните utm.gif ресурс из списка ресурсов, показанного в левой колонке, затем нажмите кнопку заголовки табуляция. Это покажет вам что-то вроде этого:

Request URL:http://www.google-analytics.com/__utm.gif?
           utmwv=1&utmn=1520570865&
           utmcs=UTF-8&
           utmsr=1280x800&
           utmsc=24-bit&
           utmul=enus&
           utmje=1&
           utmfl=10.3%20r181&

Request Method:GET
Status Code:200 OK

Request Headers
    User-Agent:Mozilla/5.0 (Macintosh; U; Intel Mac OS X 10_6_8; en-us) AppleWebKit/533.21.1 
                 (KHTML, like Gecko) Version/5.0.5 Safari/533.21.1

Response Headers
    Cache-Control:private, no-cache, no-cache=Set-Cookie, proxy-revalidate
    Content-Length:35
    Content-Type:image/gif
    Date:Wed, 06 Jul 2011 21:31:28 GMT

ключевые моменты, чтобы заметить:

1. запрос был фактически запросом для УРМ.gif, о чем свидетельствует первая строка выше: * запрос URL:http://www.google-analytics.com/__utm.gif*.

2. параметры Google Analytics четко видны в строке запроса к запросу прилагается URL, например: , utmsr - это имя переменной GA для ссылки экран клиента разрешение, для меня, показывает значение 1280x800;utmfl - это переменная имя для версии flash, которая имеет значение 10.3 и т. д.

3. на Заголовок Ответа называется Content-Type (отправлено сервером обратно клиенту) также подтверждает что запрашиваемый ресурс и возвращен был 1x1 пиксель gif: Content-Type: image / gif

эта общая схема для передача данных между клиентом и сервером была вокруг навсегда; там вполне может быть лучший способ сделать это, но это единственный способ я знаю (что соответствует ограничениям, обусловленным сервиса аналитики).

некоторые браузеры могут отображать значок ошибки, если ресурс не удалось загрузить. Это делает отладку / мониторинг службы также немного сложнее, вы должны убедиться, что ваши инструменты мониторинга обрабатывают ошибку как хороший результат.

OTOH вы ничего не получаете. Сообщение об ошибке, возвращаемое сервером / платформой, обычно больше, чем изображение 1x1. Это означает, что вы увеличиваете свой сетевой трафик в основном ни за что.

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

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

кроме того, изображения на странице являются одним из очень немногих типов данных, разрешенных по умолчанию во всех broswers. Все остальное может потребоваться явное действие пользователя для загрузки.

это ответ на вопрос OP - " зачем обслуживать данные изображения GIF..."

некоторые пользователи поставят простой img тег для вызова службы регистрации событий -

<img src="http://www.example.com/logger?event_id=1234">

в этом случае, если вы не обслуживаете изображение, браузер покажет значок заполнителя, который будет выглядеть некрасиво и создавать впечатление, что ваш сервис сломан!

что я делаю, так это ищу принимать поля заголовка. Когда ваш скрипт вызывается через img тег, как это, вы увидите что-то вроде следующего в заголовке запроса -

Accept: image/gif, image/*
Accept-Encoding:gzip,deflate
...

когда есть "изображения/"* строка принимать поле заголовка, я поставляю изображение, в противном случае я просто отвечаю с 204.

Ну основная причина заключается в том, чтобы прикрепить куки к нему, так что если пользователи переходят с одной стороны на другую, у нас все еще есть тот же элемент, чтобы прикрепить куки.

вы не должны обслуживать изображение, если вы используете API Маяка (https://w3c.github.io/beacon/) метод реализации.

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