javascript如何操作文件_FileReader API能读取哪些文件类型

FileReader可读取任意File对象，能否正确解析取决于所选方法：readAsText适用于文本文件，readAsDataURL适合资源预览，readAsArrayBuffer用于二进制处理，readAsBinaryString已废弃；浏览器限制其仅能读取用户主动选择的文件，且操作均为异步。

FileReader API 本身不限制文件类型，它能读取任何通过 <input type="file"> 或拖放等方式获取的 File 对象，包括文本、图片、音频、视频、PDF、压缩包、Office 文档等。真正决定“能否读取成功”和“是否能正确解析内容”的，是后续你用什么方法读取（readAsText、readAsDataURL 等）以及你如何解释读取结果。

支持的读取方式及对应适用场景

FileReader 提供 4 种核心读取方法，每种适用于不同需求：

• readAsText(file, encoding)：把文件当作文本读取，适合 .txt、.json、.csv、.js、.html 等纯文本或可编码为文本的文件。需注意指定正确编码（如 'UTF-8'），否则中文可能乱码。
• readAsDataURL(file)：生成 base64 编码的 Data URL，适合预览图片、音频、视频等二进制资源（例如赋值给 <img src alt="javascript如何操作文件_FileReader API能读取哪些文件类型" > 或 <audio src></audio>）。
• readAsArrayBuffer(file)：读取为底层二进制缓冲区（ArrayBuffer），适合需要精细操作字节的场景，比如解析 PDF 结构、校验文件头、处理图像像素、解压 ZIP 等。
• readAsBinaryString(file)：已废弃，不推荐使用；应改用 readAsArrayBuffer + Uint8Array 处理。

实际能“读”的文件，取决于你怎么选方法

比如一个 .jpg 文件：

• 用 readAsText() 也能调用成功，但结果是乱码（因 JPEG 是二进制格式，不是有效 UTF-8 文本）；
• 用 readAsDataURL() 就能正常得到可直接显示的 base64 字符串；
• 用 readAsArrayBuffer() 可进一步用 new Uint8Array(buffer) 检查文件头（如 FF D8 FF），确认是否真为 JPEG。

同理，一个 .xlsx 文件无法被 readAsText() 正确解析成表格，但可用 readAsArrayBuffer() 配合 xlsx 库（如 SheetJS）来读取单元格数据。

立即学习“Java免费学习笔记（深入）”；

标签： javascript java html js json svg 编码 浏览器 app 字节 office csv pd