#javascript #php #image #http #http-accept-header
Вопрос:
Я использую $_SERVER['HTTP_ACCEPT'] и после того, как я смогу проверить, поддерживает ли браузер webp изображения. Но когда я отправляю запрос ajax и пытаюсь получить $_SERVER['HTTP_ACCEPT'] его, он возвращается application/json, text/javascript, */*; q=0.01 .
Как я могу проверить, принимает ли клиентский браузер изображения webp?
Комментарии:
1. @brc-dd Это решает половину моего вопроса. Когда пользователь отправляет ajax-запрос из своего браузера, мне нужно проверить, принимает ли клиентский браузер формат webp. В данном случае
$_SERVER['HTTP_ACCEPT']не работает.2. Что именно запрашивает запрос ajax? Если он запрашивает какие-либо данные HTML или JSON для отображения на странице, то это то, что он запросит в заголовке «Принимает». Если запрос предназначен специально для изображения (например, в запросе, сгенерированном путем размещения
<imgтега на странице, то, скорее всего, именно этот запрос будет содержать список допустимых типов файлов изображений.3. @ADyson Я получаю данные из базы данных и возвращаюсь в формате json. Могу ли я запросить json и получить, принимает ли браузер формат webp?
4. Нет, конечно, нет, зачем браузеру сообщать серверу, что он принимает webp, когда он на самом деле пытается получить от него JSON? В этом нет никакого смысла. Теоретически это оставило бы открытой возможность того, что сервер мог бы законно вернуть файл изображения вместо текста JSON. Бесполезно. Браузер сообщает только то, что он готов принять в качестве ответа на текущий запрос . Так или иначе, почему в то время, когда вы возвращаете JSON, вам нужно это знать? Это также не совсем имеет смысл. Вы возвращаете какие-то ссылки на изображения в JSON или что-то в этом роде?
5. Ну, вы не узнаете об этом, пока браузер на самом деле не попытается запросить изображение, как я объяснял ранее. Таким образом, веб-сервер должен прочитать этот запрос и ответить изображением соответствующего типа файла. В качестве альтернативы вы можете создать HTML, который предоставит браузеру множество возможностей в зависимости от доступной поддержки — см. web.dev/serve-images-webp для этой техники. См. также developer.mozilla.org/en-US/docs/Web/HTML/Element/picture
Ответ №1:
Браузер сообщает серверу только то, что он готов принять в качестве ответа на текущий запрос, который он делает.
Поэтому, если он делает запрос AJAX, чтобы получить некоторые данные HTML или JSON для отображения на странице, то это то, что он запросит в заголовке «Принимает». Если запрос предназначен специально для изображения (например, запрос, сгенерированный путем размещения <img тега на странице), то именно этот запрос будет содержать список допустимых типов файлов изображений.
Если вы пытаетесь решить, указать ли URL-адрес изображения webp или png в вашем JSON, это на самом деле не сработает.
Вашими альтернативами являются:
а) предоставьте ссылку на один URL — адрес, который считывает заголовок «принимает», а затем решает, возвращать ли содержимое webp или содержимое png, извлекает правильное содержимое и задает правильные заголовки для возврата его в браузер (как если бы он напрямую запрашивал файл изображения) — это может быть реализовано, например, с помощью PHP-скрипта.
б) предоставлять URL-адреса для обоих форматах PNG и WebP параметры в JSON, а затем, когда вы показываете изображение, использовать HTML — <picture> тег, чтобы обеспечить браузера оба варианта (плюс запасной вариант для браузеров, которые не поддерживают тег изображения либо), и пусть браузер выбрать, что использовать, основываясь на том, что он знает, он поддерживает.
напр.
<picture>
<source type="image/webp" srcset="flower.webp">
<source type="image/jpeg" srcset="flower.jpg">
<img src="flower.jpg" alt="">
</picture>
Видишь https://web.dev/serve-images-webp/ и https://developer.mozilla.org/en-US/docs/Web/HTML/Element/picture для получения дополнительной информации о варианте (b).