转换-FileReader

title: 转换-FileReader id: 1b0ccdb508ccad1d30071c8564f65ff4 tags: [] date: 2000/01/01 00:00:00 updated: 2023/05/29 17:18:33 isPublic: true --#|[分隔]|#--

转换-FileReader

这是个浏览器端Api，主要用于把 File 和 Blob 格式的对象转为其他数据类型，常规用法见下：

// 初始化工具
const fileReader = new FileReader()

// 使用工具读取Blob对象(包括File)，有四个方法，可以读取成4种不同的格式
fileReader.readAsText(blob: Blob, encoding?: string)
// fileReader.readAsDataURL(blob: Blob)
// fileReader.readAsArrayBuffer(blob: Blob)
// fileReader.readAsBinaryString(blob: Blob)

// 设置读取完成的回调方法
fileReader.onload = () => {
  console.log('结果：', fileReader.result)
}
// 设置读取出错的回调方法
fileReader.onerror = (error) => {
  console.log('出错：', error)
}

它有四个读取Blob的方法：

• readAsText：可选设定文本编码，读取文本文件的内容，如果是非文本，读出来的内容基本是乱码。

• readAsDataURL：把Blob读取为 base64 链接，即便是一段html代码也可以，且访问这个base64链接时，浏览器还能原样展示。

• readAsArrayBuffer：把Blob读取为ArrayBuffer。

• readAsBinaryString：把Blob读取为二进制字符串，这个Api不推荐使用，使用readAsArrayBuffer代替。