JavaScript中的本地文件支持检测- Windows Phone 8 Bug

Local File Support Detection in JavaScript - Windows Phone 8 Bug

本文关键字:Windows Phone Bug 检测 支持 文件 JavaScript      更新时间:2023-09-26

我有一个关于<input type=file> HTML元素的问题——特别是,为什么所有的迹象都表明它支持Windows Phone 8 (IE 10 Mobile),但它真的不能工作。

我一直在做一个照片上传器项目,在Javascript开发中,我有检查文件API支持的逻辑,所以我知道我是否可以支持本地文件选择。令人惊讶的是,我的代码在Windows Phone 8上返回true值。这应该不是一个问题,但是<input type=file>元素并不真正支持WP 8(正如Windows博客上一篇关于移动版IE 10的文章所指出的那样)。在WP 8上的结果是,如果<input type=file>元素在页面上,它显示得很好,但是当单击"浏览"按钮时什么也没有发生。

我检查文件API支持的JS代码是:

function checkLocalFileSupport() {
   if (window.File && window.FileReader && window.FileList && window.Blob) {
       return true;
   }
   return false;
}

我希望有人能阐明如何更好地检查和确认本地文件选择是否在特定设备/浏览器上可用。正如我所说,我目前的解决方案在WP 8上返回true。我一直在尝试各种不同的方法,看看是否启用了<input type=file>(下面的片段),但所有其他解决方案仍然返回true的WP 8。

需要注意的是:我真的希望代码与设备无关。因此,我不想嗅探浏览器用户代理。在我看来,用户代理嗅探是一种我宁愿不必实现的后备方案。

以下是我找到并尝试过的一些解决方案,但仍然在WP 8上返回true:

在input元素上引用disabled属性:

function isInputTypeFileImplemented() {
    var elem = document.createElement("input");
    elem.type = "file";
    if (elem.disabled) return false;
    try {
        elem.value = "Test"; // Throws error if type=file is implemented
        return elem.value != "Test";
    } catch(e) {
        return elem.type == "file";
    }
}
使用jquery.support:

var support = (function(undefined) {
    return $("<input type='file'>")    // create test element
                 .get(0)               // get native element
                 .files !== undefined; // check whether files property is not undefined
})();

希望有人可以帮助阐明如何准确地让WP 8返回本地文件支持的false值。

提前感谢!

根据这篇博客文章,一些系统返回假阳性支持,您可以通过使用RegExp检查它们来克服这个问题,例如

if (navigator.userAgent.match(/(Android (1.0|1.1|1.5|1.6|2.0|2.1))|(Windows Phone (OS 7|8.0))|(XBLWP)|(ZuneWP)|(w(eb)?OSBrowser)|(webOS)|(Kindle'/(1.0|2.0|2.5|3.0))/)) {
   return false;
}