栏目分类:
子分类:
返回
名师互学网用户登录
快速导航关闭
当前搜索
当前分类
子分类
实用工具
热门搜索
名师互学网 > IT > 面试经验 > 面试问答

HTML5 File API以文本和二进制形式读取

面试问答 更新时间: 发布时间: IT归档 最新发布 模块sitemap 名妆网 法律咨询 聚返吧 英语巴士网 伯小乐 网商动力

HTML5 File API以文本和二进制形式读取

请注意2018年

readAsBinaryString
已过时。对于以前曾使用过的用例,最近这些天将使用
readAsArrayBuffer
(或在某些情况下为
readAsDataURL
)。


readAsBinaryString
表示必须将数据表示为 二进制字符串 ,其中:

…每个字节都由[0..255]范围内的整数表示。

Javascript最初没有“二进制”类型(直到ECMAscript 5对Typed
Array
* 的WebGL支持*
(以下详细信息) -它已被ECMAscript 2015的ArrayBuffer取代),因此它们使用了String,以确保不存储任何字符字符串中的“
0”超出范围0..255。(它们本来可以使用Numbers数组,但事实并非如此;因为Numbers是浮点数,所以大型Strings可能比大型Numbers数组更节省内存。)

如果你正在读这主要是在西部的脚本文本(主要是英语,例如)的文件,那么该字符串看起来会 很多
像文本。如果您读取的文件中包含Unipre字符,则应注意其中的区别,因为Javascript字符串为UTF-16
** (以下详细信息) ,因此某些字符的值将大于255,而根据文件,“二进制字符串”
API规范不会有大于255的任何值(对于Unipre代码点的两个字节,您将有两个单独的“字符”)。

如果您正在读取的文件根本不是文本(也许是图像),则在

readAsText
和之间可能仍会得到非常相似的结果
readAsBinaryString
,但是
readAsBinaryString

知道
将不会尝试解释多字节序列。作为字符。您不知道是否使用
readAsText
,因为
readAsText
它将使用编码确定来尝试找出文件的编码,然后将其映射到Javascript的UTF-16字符串。

如果创建文件并将其存储在ASCII或UTF-8以外的其他格式中,则可以看到效果。(在Windows中,您可以通过记事本执行此操作;将“另存为”作为编码下拉列表,上面带有“
Unipre”,通过它查看它们似乎意味着UTF-16的数据;我确定Mac OS和* nix编辑器具有类似的功能。)这是一个转储两种方式读取文件结果的页面:

<!DOCTYPE HTML><html><head><meta http-equiv="Content-type" content="text/html;charset=UTF-8"><title>Show File Data</title><style type='text/css'>body {    font-family: sans-serif;}</style><script type='text/javascript'>    function loadFile() {        var input, file, fr;        if (typeof window.FileReader !== 'function') { bodyAppend("p", "The file API isn't supported on this browser yet."); return;        }        input = document.getElementById('fileinput');        if (!input) { bodyAppend("p", "Um, couldn't find the fileinput element.");        }        else if (!input.files) { bodyAppend("p", "This browser doesn't seem to support the `files` property of file inputs.");        }        else if (!input.files[0]) { bodyAppend("p", "Please select a file before clicking 'Load'");        }        else { file = input.files[0]; fr = new FileReader(); fr.onload = receivedText; fr.readAsText(file);        }        function receivedText() { showResult(fr, "Text"); fr = new FileReader(); fr.onload = receivedBinary; fr.readAsBinaryString(file);        }        function receivedBinary() { showResult(fr, "Binary");        }    }    function showResult(fr, label) {        var markup, result, n, aByte, byteStr;        markup = [];        result = fr.result;        for (n = 0; n < result.length; ++n) { aByte = result.charCodeAt(n); byteStr = aByte.toString(16); if (byteStr.length < 2) {     byteStr = "0" + byteStr; } markup.push(byteStr);        }        bodyAppend("p", label + " (" + result.length + "):");        bodyAppend("pre", markup.join(" "));    }    function bodyAppend(tagName, innerHTML) {        var elm;        elm = document.createElement(tagName);        elm.innerHTML = innerHTML;        document.body.appendChild(elm);    }</script></head><body><form action='#' onsubmit="return false;"><input type='file' id='fileinput'><input type='button' id='btnLoad' value='Load' onclick='loadFile();'></form></body></html>

如果我将其与存储在UTF-16中的“测试1 2 3”文件一起使用,则得到的结果如下:

文字(13):54 65 73 74 69 6e 67 20 31 20 32 20 33二进制(28):ff fe 54 00 65 00 73 00 74 00 69 00 6e 00 67 00 20 00 31 00 20 00 32 00 20 00 33 00

如您所见,

readAsText
对字符进行了解释,所以我得到了13(“ Testing 1 2
3”的长度),而
readAsBinaryString
没有,所以我得到了28(两个字节的BOM表,每个字符两个字节)。


  • HTML 5支持XMLHttpRequest.response与
    responseType = "arraybuffer"

** “ Javascript字符串为UTF-16”
可能看起来很奇怪;他们不只是Unipre吗?不,Javascript字符串是一系列UTF-16代码单元;您实际上将代理对视为两个单独的Javascript“字符”,尽管实际上,代理对整体上只是一个字符。有关详细信息,请参见链接。



转载请注明:文章转载自 www.mshxw.com
本文地址:https://www.mshxw.com/it/464917.html
我们一直用心在做
关于我们 文章归档 网站地图 联系我们

版权所有 (c)2021-2022 MSHXW.COM

ICP备案号:晋ICP备2021003244-6号