2017-01-14 16 views
1

私はreact-dropzoneを使用して、自分のウェブサイトでファイルをアップロードしています。ファイルを正常にロードすると、dropzoneは次のコールバックをトリガーします。Reactjs - react-dropzoneのファイルをbase64でエンコードできない

onDrop: function (acceptedFiles, rejectedFiles) { 
    myFile = acceptedFiles[0]; 
    console.log('Accepted files: ', myFile); 
} 

このファイルをbase64でエンコードしたいと思います。実行時:

var base64data = Base64.encode(myFile) 
console.log("base64 data: ", base64data) // => base64 data: W29iamVjdCBGaWxlXQ==W29iamVjdCBGaWxlXQ== 

ファイルのアップロードに関係なく、常に同じ文字列が出力されます。

何か不足していますか?私はこのファイルをbase64でエンコードする必要があります(常にイメージです)。

答えて

2

このJS BinはFileをbase64に変換する実例です:http://jsbin.com/piqiqecuxo/1/edit?js,console,output。主な追加はFileReader.readAsDataURL()は、それが働いた

document.getElementById('button').addEventListener('click', function() { 
    var files = document.getElementById('file').files; 
    if (files.length > 0) { 
    getBase64(files[0]); 
    } 
}); 

function getBase64(file) { 
    var reader = new FileReader(); 
    reader.readAsDataURL(file); 
    reader.onload = function() { 
    console.log(reader.result); 
    }; 
    reader.onerror = function (error) { 
    console.log('Error: ', error); 
    }; 
} 
+0

base64でエンコードされた文字列を返しますFileReaderを使用してファイルを読み込むしているようです。ありがとう –

関連する問題