检测服务器端的视网膜(HD)显示

时间:2013-03-05 21:30:53

标签: php retina-display

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

我想根据屏幕提供不同的图像,ex(在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();
  }
})();

3 个答案:

答案 0 :(得分:18)

好吧,因为目前似乎没有更好的方法,这是我的解决方案,结合了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 } ?>

在function.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'];

答案 1 :(得分:9)

由于您没有指定您需要的确切用例,并且我没有真正看到服务器的用例,知道客户想要什么分辨率的图像(我认为客户应该决定)是我的建议:

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

这样您还可以利用图像的浏览器缓存。如果您有两个不同图像尺寸的网址,则无法执行此操作。即使其自动创建/更新的图像缓存使用最后修改或etag标头。

答案 2 :(得分:1)

我不确定究竟是怎么回事,但纯粹的PHP解决方法是使用 get_browser 来返回浏览器版本和SOME功能。这可能会告诉您一些 MAY 导致其在视网膜上运行的信息。

http://php.net/manual/en/function.get-browser.php

此外,您还可以查看 $_SERVER['HTTP_USER_AGENT'] ,它会告诉您有关该设备的信息。那么你需要一个具有视网膜的设备列表并进行比较以获得答案。

在JS中进行视网膜检测可能更容易和万无一失。