FileReader對象有5種方法，其中四種用於讀取文件，另一種用來讀取過程中斷，需要注意的是：無論讀取成功與失敗，方法並不會返回讀取結果，而是將結果保存在result屬性中。此對象也是異步的。
FileReader對象的方法如下：
readAsBinaryString(file):
這個方法將blob對象或文件中的數據讀取爲二進制字符串，通常我們將它傳送到服務器端，服務器端可以通過這段字符串存儲文件。
readAsText(file,encoding):
以純文本形式讀取文件，將讀取到的文本保存在result屬性中，第二個參數用於指定編碼類型，可選的。
readAsDataURL(file):
讀取文件並將文件以數據URL的形式保存在result屬性中。
readAsArrayBuffer(file):
讀取文件並將一個包含文件內容的ArrayBuffer保存在result屬性中。
FileReader對象的事件如下： onabort: 數據讀取中斷時觸發、 onerror: 數據讀取出錯時觸發、onloadstart: 數據讀取開始時觸發、 onprogress: 數據讀取中、onload： 數據讀取成功完成時觸發、onloadend: 數據讀取完成時觸發，無論成功或失敗。
使用例子:
h5部分：
<input id="imagefile" type="file" name="filename" onchange="html5Reader()" />
<img id="preview" alt="image" style="height: 200px;" name="pic" />
js部分：
function html5Reader(file) {
if(typeof FileReader == 'undefined') {
alert("抱歉，你的瀏覽器不支持FileReader,無法圖片上傳");
}
var file = file.files[0];
var reader = new FileReader();
reader.readAsDataURL(file);
//dataurl的格式爲data:image/******;adshgflkasnga,意思是文件頭+二進制串，可用；分割
reader.onload = function(e) {
$.post("./php/UpLoadImage.php",
{ img: e.target.result },
//post成功後的回調函數
function(ret) {
if(ret.img != '') {
var pic = document.getElementById("preview");
pic.src = "./img/" + ret.img;
} else {
alert('upload fail');
}
},
'json');
}
}
PHP部分：
<?php
$img = isset($_POST['img'])? $_POST['img'] : '';
// 獲取圖片，使用“；”分割dataurl格式，然後把文件頭和二進制串分開賦值到數組 //data:image/jpeg;base64,/9j/4AAQSk
list($type, $data) = explode(',', $img);
// 判斷類型
if(strstr($type,'image/jpeg')!==''){
$ext = '.jpg';
}elseif(strstr($type,'image/gif')!==''){
$ext = '.gif';
}elseif(strstr($type,'image/png')!==''){
$ext = '.png';
}
// 生成的文件名
$photo = time().$ext;
//生成文件路徑
$photo_path = "../img/{$photo}";
// 生成文件
file_put_contents($photo_path, base64_decode($data), true);
// 數據返回
header('content-type:application/json;charset=utf-8');
$ret = array('img'=>$photo_path);
echo json_encode($ret);
?>