我正在使用HTML5處理瀏覽器內圖像處理,並且在Chrome中使用onload事件處理程序處理File API FileReader類時出現了一個奇怪的問題,該文件只能正確處理第二次在表格中選擇它。FileReader onload只能在瀏覽器中第二次使用
任何想法如何讓Chrome瀏覽器第一次處理此事件? 在我的控制檯網絡中,當我點擊編輯圖像時,不會出現任何東西,當我點擊第二次編輯按鈕時,出現我與圖像blob profilePic。 IDK發生了什麼。
代碼:
function uploadFile(){
var file = $scope.profilePic;
console.log(file);
var blob = new Blob([file], {
"type": "text/html"
});
var reader = new FileReader();
reader.onload = function(e) {
var text = e.target.result.split(',')[1];
console.log(text);
$scope.loadedUser.profilePic = text;
}
reader.readAsDataURL(blob);
};
HTML:
<div layout-gt-sm="row" style="margin-bottom: 20px;">
<input type="file" name="profilePic" fileread="profilePic">
</div>
我很困惑,如果它是一個形象,你爲什麼要創建它的HTML斑點,而實際上,你爲什麼連創建文件的斑點? ??文件是Blob。 – Kaiido
我需要將我的圖像轉換爲blob來發送後端。 –
但「文件是一個Blob」!無論你用Blob做什麼都可以用File來完成。你不需要轉換它,而且不需要轉換它。 – Kaiido