上传文件
上传文件，是很普通的事情。那么上传文件并且读取文件的内部内容。这个时候要怎么解决？
解析文件内容
解析文件内部内容，也是很简单，不过会出现乱码的可能。
<input type="file" id="file">
var ofile = document.getElementById('file')
ofile.onchange = function(e){
const reader = new FileReader();
reader.readAsText(file);
reader.onloadend = e => {
console.log(e.target.result)
};
}
乱码处理
原因
为什么会出现乱码，原因就是不同的软件，不同的系统， 默认的
编码设置不同。
而readAsText(file)，在读取文件时，虽然我们没有设置编码，但是默认是utf8编码来读取
参考链接：https://developer.mozilla.org/zh-CN/docs/Web/API/FileReader/readAsText
解决
也就是说只要知道文件的编码格式，并用这个编码格式去读取这个文件就可以了
获取编码格式
1.npm上有一个库jschardet是利用js来获取文件的编码，虽然有一些偏差，但是能够满足需求。
jschardet.detect(buffer)这个方法可以解决问题。注意它的参数是buffer。
2.如何保证读出来的内容不是乱码，那么readAsText是不可以取的方法。
3.综上两种方式，我们可以采用readAsArrayBuffer(blob)来读取文件。只有一个参数，不会默认指定编码。所以可以
4.将ArrayBuffer转换成buffer。再交给jschardet.detect()即可。
<input type="file" id="file">
var ofile = document.getElementById('file')
ofile.onchange = function(e){
const reader = new FileReader();
reader.readAsArrayBuffer(file);
reader.onloadend = e => {
const buffer = Buffer.from(e.target.result);
const type = jschardet.detect(buffer) // { encoding: "UTF-8", confidence: 0.9690625 }
};
}
正确读取文件内容
iconv-lite可以指定编码格式来正确读取文件内容。
<input type="file" id="file">
var ofile = document.getElementById('file')
ofile.onchange = function(e){
const reader = new FileReader();
reader.readAsArrayBuffer(file);
reader.onloadend = e => {
const buffer = Buffer.from(e.target.result);
const type = jschardet.detect(buffer) // { encoding: "UTF-8", confidence: 0.9690625 }
const res iconv.decode(buffer,type,encoding)//文件的内容，字符串形式。
};
}
总结
1.读取文件不难，难在解码时有乱码。
2.切记慎用readAsText()方法
3.利用ArrayBuffer和Buffer的转换，以及jscharded来进行读取编码
4.再利用iconv-lite进行，固定的编码读取文件，至此即可。
