JavaScript - ファイル選択して読込み

 

JavaScript クイック辞典


ファイル選択して読込み


■HTML - 読込むファイルを選択させるリンク

 <input type="file" id="files" name="files[]" multiple />

 

 

■JavaScript - ファイルを読込むハンドラーの指定

function init0(){
    document.getElementById('files').addEventListener(

    'change', handleFileRead, false);
}
window.addEventListener("DOMContentLoaded", init0);


■JavaScript - ファイルを読込むハンドラー

function handleFileRead(evt) {

    var files = evt.target.files;

    if(files[0]){

        var reader = new FileReader();

        reader.onload = function(e) {

            let dat = e.target.result; // ArrayBuffer

            myparse(dat); //データの取り出し

        }

        reader.readAsArrayBuffer(files[0]);

    }

}



■JavaScript - 読込んだデータの取り出し

function myparse(dat){

    let aba, ba;, val

 

     // 符号無8bit 整数を取り出す

    aba = dat.slice(n, n+m); // mバイト切り出す

    ba=new Uint8Array(aba);

    // 配列でアクセス ba[ i ]

 

   // 32bit 整数を取り出す

    aba = dat.slice(n, n+4); // 32bit分切り出す

    ba=new Uint32Array(aba);

    val = ba[0]

 

    // 32bit floatを取り出す

    aba = dat.slice(n, n+4); // 32bit分切り出す

    ba=new Float32Array(aba);

    val = ba[0]

 

}



■ null-terminate-sjis の取り出し

※ js ライブラリが必要 --> Github

 

HTML

<script src="encoding.min.js"></script>


JavaScript

aba = dat.slice(n, n+m); // 文字フィールドmバイトを切り出す

let str = make_str_nt(aba);

 

 

function make_str_nt(aba){
    let ret = "";
    let mxl = aba.byteLength;
    let len = mxl;
    let ba=new Uint8Array(aba);
    for(let ix=0 ; ix < mxl ; ix++){
        if(0 == ba[ix]){
            len = ix;
            break;
        }
    }
    if(0 == len){
    }
    else if(len < mxl){
        ret = mk_str(aba.slice(0, len))
    }
    else{
        ret = mk_str(aba)
    }
    return ret;
}
 

function mk_str(aba){
    let ba=new Uint8Array(aba);
    let ret = Encoding.convert(
        ba,

        {
          to: 'UNICODE',
          from: 'SJIS',
          type: 'string'
        }
    );
    return ret;
}