前端FileReader 文件预览

最新推荐文章于 2024-04-26 10:22:03 发布

丢掉幻想，准备战斗

最新推荐文章于 2024-04-26 10:22:03 发布

阅读量88

点赞数

文章标签： javascript html 前端开发语言 ecmascript

本文链接：https://blog.csdn.net/weixin_38629440/article/details/130073772

版权

这玩意好像挺强，可以操作用户选择的文件，转为base64或者二进制，blob；

1、实际应用
我的行车记录仪记录事反着放的，所以查看视频都是反过来的，那么我就写了个html，选择对应视频反向播放；

input框选择视频文件后，我们就能拿到当前视频文件，使用

let f = new FileReader()
f.readAsDataURL( $('#file').get(0).files ) ; 
f.onload = function () {
  $video.attr('src', f.result)
}

这波操作直接把文件读到内存里面，100MB，然后拿来本地播放；再加个css旋转180度搞定；

2、除了视频，图片文件也行哦；这样的话可以做很多事哦
1)可以实现文件预览
2)配合canvas绘图可以进行图片压缩

关注