JavaScript バイナリデータを読み込む
バイナリファイルを読み込むにはFileReaderオブジェクトの「readAsBinaryString()」メソッドを使う。readAsBinaryString()のパラメータに、選択されたファイルオブジェクトを指定します。バイナリファイルの読込が完了すると「load」イベントが発生するので、FileReaderオブジェクトのonloadにイベントハンドラを設定し、読み込み完了時の処理を行います。イベントハンドラにはイベントオブジェクトが渡され、targetオブジェクトのresultプロパティに読み込まれたバイナリファイルが入ります。バイナリデータは、1バイトが1文字として格納されているため、charAt()メソッドやcharCodeAt()メソッド、substring()メソッドやsubstr()メソッド、正規表現などを使って処理することができます。
f <body>
<script>
window.addEventListener("load" , function(){
var ele = document.getElementsByTagName("output")[0];
//ボタンにイベントを設定
document.getElementById("readBtn").addEventListener("click", function(){
var fileList = document.getElementById("selFile").files;
//FileReaderオブジェクトを作成
var reader = new FileReader();
//バイナリファイルが読み込まれた場合の処理を設定
reader.onload = function(evt){
var bin = evt.target.result;
//最初の8バイトを表示
for(var i=0; i<8; i++){
ele.innerHTML += bin.charCodeAt(i).toString(16)+", ";
}
}
reader.readAsBinaryString(fileList[0]);//バイナリファイルの読込開始
},false);
}, false);
</script>
<h1>テキストファイルの読込</h1>
<form>
<p><input type="file" id="selFile" multiple></p>
<input type="button" value="読み込み" id="readBtn">
</form>
<output></output>
</body>
ファイル選択ボタンをクリックして、バイナリファイルを選択します。
読み込みボタンをクリックすると、選択されたバイナリファイルが読み込まれ、先頭の8バイトが16進数で表示されます。