检测服务器端的视网膜（HD）显示屏

php retina-display

2022-08-30 19:58:50

我发现了很多关于Retina Display的问题，但没有一个答案在服务器端。

我想根据屏幕提供不同的图像，例如（PHP）：

if( $is_retina)
    $thumbnail = get_image( $item_photo, 'thumbnail_retina' ) ;
else
    $thumbnail = get_image( $item_photo, 'thumbnail' ) ;

你能看到一种处理这个问题的方法吗？

我只能想象在JavaScript中进行测试，设置一个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();
  }
})();

答案 1

好吧，因为目前似乎没有更好的方法，这是我结合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 $is_retina;或$GLOBALS['is_retina'];

答案 2

由于您没有指定您需要的确切用例，并且我并没有真正看到服务器的用例，知道客户端想要的分辨率（在我看来，客户端应该决定），这是我的建议：

使用 Retina.js或使用 srcset 属性<img src="low-res.jpg" srcset="medium-res.jpg 1.5x, high-res.jpg 2x">

这样，您还可以利用图像的浏览器缓存。如果您有一个用于两种不同图像大小的URL，则无法做到这一点。即使它是自动创建/更新的图像缓存，也可以使用上次修改或标记标头。

检测服务器端的视网膜 （HD） 显示屏

检测服务器端的视网膜（HD）显示屏