使用 Zend Framework 或 Javascript 进行浏览器检测答案

【问题标题】：Browser detection using Zend Framework or Javascript使用 Zend Framework 或 Javascript 进行浏览器检测
【发布时间】：2015-01-27 22:11:24
【问题描述】：

我正在创建一个需要能够上传大文件的应用程序。我选择使用FormData 对象，因为使用它我可以向用户报告进度。

毫不奇怪 IE 不支持这个，所以我不得不回退到 Flash。使用 Zend Framework 检测 IE 7/8/9+ 的最佳方法是什么？我正在通过每个控制器中的 indexAction 方法根据需要加载其他资产。例如：

public function indexAction()
{
    $this->view->stepnumber = 1;
    $this->view->stepintro = 'Upload your photo.';
    $this->view->headScript()->appendFile($this->view->baseUrl().'/assets/js/fileuploader.js');
}

现在，在我的一个页面中，我已经完成了某种形式的浏览器检测（对于一些 canvas 工作）：

public function indexAction()
{

    $u_agent = $_SERVER['HTTP_USER_AGENT'];

    $this->view->stepnumber = 5;
    $this->view->stepintro = 'Select your cut out detail.';

    if(preg_match('/MSIE/i', $u_agent)) {
        $this->view->headScript()->appendFile($this->view->baseUrl().'/assets/js/excanvas.js');
    } else {
        $this->view->headScript()->appendFile($this->view->baseUrl().'/assets/js/mootools/mootools-canvas-lib/mcl-min.js');
    }      

    $this->view->headScript()->appendFile($this->view->baseUrl().'/assets/js/frank/pentool.js');

    $image = $this->uploadsDb->getImage();    

    $data = $this->nodedataDb->getNodedata($image->id);

    $this->view->image = $image;
    $this->view->nodeData = $data;


}

虽然我不太喜欢这种方法，但我宁愿使用 Javascript 进行检查，因为这会更面向未来（我认为）。但是我将如何在我的 ZF layout.phtml 中使用 Javasript，所以我只加载我需要的 Javascript？减少对服务器的调用。

非常感谢任何帮助。

解决方案：

我决定使用 YepNope：

yepnope({  
  test : "FormData" in window,
  yep  : 'normal.js',  
  nope : 'flashupload.js'  
});

【问题讨论】：

不检测浏览器，检测功能！ modernizr.com
我认为你应该检查客户端浏览器是否支持所需的功能，而不是浏览器是否是ie。
好的，如果我检查客户端，那么我如何优雅地只下载所需的 JS？有了功能检测，我必须下载所有内容，不是吗？
Modernizr 不检查 FormData
你不能使用 YepNope 和 Modernizr 来执行额外的检查吗？

标签： php javascript zend-framework mootools cross-browser

【解决方案1】：

如果您正在寻找一种简单的方法来为仅限 IE 的浏览器附加 css 样式表/javascript 文件，您可以使用条件 cmets 参数，如下所示：

对于除 css 样式表之外的任何文件：

$this->view->headLink()->appendFile($this->view->baseUrl() . '/media/js/core.js', 'text/javascript', array('conditional' => 'IE');

注意array('conditional' => 'IE') 参数。

对于附加样式表文件，函数参数略有不同：

$this->view->headLink()->appendStylesheet($this->view->baseUrl() . '/media/css/core.css', 'all', 'IE');

http://framework.zend.com/manual/en/zend.view.helpers.html#zend.view.helpers.initial.headstyle

【讨论】：

太好了 :) 从来不知道，但决定采用特征检测路线。

【解决方案2】：

如果该功能不可用，您可以添加一个 javascript（我使用 jquery 的短语法）；

if(typeof featureA == "undefined"){
    $("<script/>").attr({
        "src" : "/assets/featurea.js",
        "type": "text/javascript"
    }).appendTo($("head").eq(0));
}

您可以将其用于其他功能，因此您不必全部下载。

【讨论】：