Я нашел много вопросов о Retina Display, но ни один из ответов не был на стороне сервера.
Я хотел бы предоставить другое изображение в соответствии с экраном, например (на PHP):
if( $is_retina) $thumbnail = get_image( $item_photo, 'thumbnail_retina' ) ; else $thumbnail = get_image( $item_photo, 'thumbnail' ) ; Вы видите способ справиться с этим?
Я могу только представить тест в JavaScript, установив Cookie. Однако для этого требуется первоначальный обмен. У кого-то есть лучшее решение?
Код настройки файла cookie:
(function(){ if( document.cookie.indexOf('device_pixel_ratio') == -1 && 'devicePixelRatio' in window && window.devicePixelRatio == 2 ){ document.cookie = 'device_pixel_ratio=' + window.devicePixelRatio + ';'; window.location.reload(); } })();
Хорошо, так как кажется, что на данный момент нет лучшего способа, вот мое решение, объединяющее JS, PHP и Cookies.
Я надеюсь, что в будущем будут лучшие ответы
<?php if( isset($_COOKIE["device_pixel_ratio"]) ){ $is_retina = ( $_COOKIE["device_pixel_ratio"] >= 2 ); if( $is_retina) $thumbnail = get_image( $item_photo, 'thumbnail_retina' ) ; else $thumbnail = get_image( $item_photo, 'thumbnail' ) ; }else{ ?> <script language="javascript"> (function(){ if( document.cookie.indexOf('device_pixel_ratio') == -1 && 'devicePixelRatio' in window && window.devicePixelRatio == 2 ){ var date = new Date(); date.setTime( date.getTime() + 3600000 ); document.cookie = 'device_pixel_ratio=' + window.devicePixelRatio + ';' + ' expires=' + date.toUTCString() +'; path=/'; //if cookies are not blocked, reload the page if(document.cookie.indexOf('device_pixel_ratio') != -1) { window.location.reload(); } } })(); </script> <?php } ?>
в функции.php:
add_action( 'init', 'CJG_retina' ); function CJG_retina(){ global $is_retina; $is_retina = isset( $_COOKIE["device_pixel_ratio"] ) AND $_COOKIE["device_pixel_ratio"] >= 2; }
Затем, после того как я смогу использовать следующий GLOBAL:
global $is_retina; или $GLOBALS['is_retina'];
Поскольку вы не указываете, какой именно прецедент вам нужен, и я действительно не вижу прецедента для сервера, зная, какое разрешение клиент хочет, чтобы его изображения (по моему мнению, клиент должен был решить), вот мое предложение :
Используйте что-то вроде Retina.js или используйте атрибут srcset <img src="low-res.jpg" srcset="medium-res.jpg 1.5x, high-res.jpg 2x">
Таким образом, вы также можете использовать кеширование браузера изображений. которые вы не можете сделать, если у вас есть один URL для двух разных размеров изображения. Даже если его автоматически созданное / обновленное кэширование изображений работает с использованием заголовков с последним изменением или etag.
Я не уверен, как именно, но чистый способ PHP понять это будет использовать get_browser который возвращает версию браузера и некоторые возможности. Это может сообщить вам некоторую информацию, которая МОЖЕТ привести к ее запуску на сетчатке.
http://php.net/manual/en/function.get-browser.php
Кроме того, вы можете посмотреть $_SERVER['HTTP_USER_AGENT'] который расскажет вам об устройстве. то вам нужен список устройств, у которых есть сетчатки, и выполните сравнение, чтобы получить ответ.
Выполнение обнаружения сетчатки в JS, вероятно, намного проще и надежнее.