在前端我们读取本地文件可以利用input控件
<input type="file" id="input">
一 获取文件
- 点击按钮或者通过拖拽到input
监听input的change事件
$("#input").on("change", function(source, b) {
let file = source.target.files[0]; //得到file句柄
});
2 通过复制粘贴图片等
$("body").on("paste", function(e) {
e.clipboardData.items[i].getAsFile();
});
getAsFile() 方法将返回拖拽项数据的 File 对象.
二 通过FileReader 转成base64
var reader = new FileReader()
reader.onload = function(event) {
// event.target.result就是图片的Base64地址啦
}
reader.readAsDataURL(file); //传入刚才的file句柄