バイト配列をjavascriptの画像に変換するには

Question

バイト配列をJavascriptを使用して画像に変換してフロントエンドに表示したいと考えています。 blobを使用してイメージをmysqlデータベースに挿入しています。イメージは保存する前にバイト配列に変換されています。

そして、json配列を使用してすべてのテーブル値を取得しています。また、javascriptを使用して表示しています。 json配列では、このイメージをbytearrayとしても追加しています。

他の値は取得できますが、このバイト配列をイメージとして表示することはできません。

このバイト配列をjavascriptの画像に変換すると、htmlを使用して表示できます。

上記のコード：

$scope.uploadFile = function (input) { 

     if (input.files && input.files[0]) { 
      var reader = new FileReader(); 
      reader.onload = function (e) { 

       //Sets the Old Image to new New Image 
       $('#itemImage').attr('src', e.target.result); 

       //Create a canvas and draw image on Client Side to get the byte[] equivalent 
       var canvas = document.createElement("canvas"); 
       var imageElement = document.createElement("img"); 

       imageElement.setAttribute('src', e.target.result); 
       canvas.width = imageElement.width; 
       canvas.height = imageElement.height; 
       var context = canvas.getContext("2d"); 
       context.drawImage(imageElement, 0, 0); 
       var base64Image = canvas.toDataURL("image/jpeg"); 

       //Removes the Data Type Prefix 
       //And set the view model to the new value 
       $scope.itemImage = base64Image.replace(/data:image\/jpeg;base64,/g, ''); 
      } 

      //Renders Image on Page 
      reader.readAsDataURL(input.files[0]); 
     } 
    }; 

Answer 1

画像が小さい場合は、ベース64でそれをコード化し、imgタグのsrcとそれを置くことができます。