オリジナルjsを使ってbase 64でローカル画像ファイルを読み込みます.

起因
プロジェクトをする時に問題が発生しました.ユーザーが一枚の画像をアップロードして画布で操作する必要があります.一般的なロジックは先に画像をサーバーに送ってからサーバーからこの画像を読み取ります.この過程で読みすぎるかもしれません.サーバーも操作前の画像を保存する必要がないので、ローカルに画像を読み込む必要があります.ここは忘れないようにメモしておきます.
コード

File.prototype.convertToBase64 = function(callback){
    var FR= new FileReader();
    FR.onload = function(e) {
         callback(e.target.result)
    };       
    FR.readAsDataURL(this);
  }

使い方 

document.querySelector('[type="file"]').files[0].convertToBase64(function(base64){
    console.log(base64);
});