JavaScript读取本地文件需通过FileReader异步处理用户选择的文件，无法直接访问任意本地路径；常用readAsText（文本）、readAsDataURL（base64）、readAsArrayBuffer（二进制）等方法，并支持onprogress监听进度。
JavaScript 中读取本地文件主要依靠 FileReader 对象，它允许异步读取用户通过 “ 选择的文件内容。注意：出于安全限制，JS 无法直接读取任意本地路径的文件（比如 C:xxx.txt），只能处理用户主动选择的文件对象。
获取文件对象
通常从 “ 元素中获取：
const input = document.getElementById('fileInput'); input.addEventListener('change', function(e) { const file = e.target.files[0]; // 用户选中的第一个文件 if (file) { readTextFile(file); } });
使用 FileReader 读取文本文件
function readTextFile(file) { const reader = new FileReader();reader.onload = function(e) {console.log('文件内容：', e.target.result); // 字符串形式};
reader.onerror = function() {console.error('读取失败：', reader.error);};
reader.readAsText(file, 'UTF-8'); // 指定编码，避免中文乱码}
读取为其他格式
根据需求选择对应方法：
立即学习“Java免费学习笔记（深入）”；
readAsDataURL(file)：转为 base64 字符串，适合预览图片或上传前处理readAsArrayBuffer(file)：读为二进制缓冲区，适合处理音频、视频、Excel 等需底层操作的文件readAsBinaryString(file)（已废弃，不推荐）：旧 API，兼容性差，应避免使用
监听读取进度（可选）
对大文件可显示加载状态：
reader.onprogress = function(e) { if (e.lengthComputable) { const percent = (e.loaded / e.total * 100).toFixed(1); console.log(`加载中... ${percent}%`); }};
基本上就这些。关键点是：必须由用户触发选择文件，不能绕过交互自动读取；读取是异步的，结果在 onload 回调里获取；编码和格式选对，才能正确解析内容。
以上就是JavaScript中如何读取本地文件_FileReader对象的详细内容，更多请关注创想鸟其它相关文章！
版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。
如发现本站有涉嫌抄袭侵权/违法违规的内容， 请发送邮件至 chuangxiangniao@163.com 举报，一经查实，本站将立刻删除。
发布者：程序猿，转转请注明出处：https://www.chuangxiangniao.com/p/1541171.html
微信扫一扫 
支付宝扫一扫 
