iosのlocalforageブロブで画像を読み込む際にエラーが発生しました

ios端末でCordovaカメラAPIを使用してカメラ画像を取得してからlocalforageに保存しています。しかし、タグSafari Web Inspectorの下のブロブをクリックするとAn error occured while trying to load resourcesエラーを表示し、画像の代わりに20x20白い背景として表示されているので、リソースがロードされていないようです。ここに私のHTMLラッパーがCordova Camera API周りです：私たちは、画像を保存するためにダウンsavePhotoを使用iosのlocalforageブロブで画像を読み込む際にエラーが発生しました

<head> 
    <title>Capture Photo</title> 

    <script type="text/javascript" charset="utf-8" src="cordova.js"></script> 
    <script type="text/javascript" charset="utf-8" src="js/camera.js"></script> 
    <script type="text/javascript" charset="utf-u" src="js/localforage.js"></script> 

    <script type="text/javascript"> 
    function savePhoto(contents){ 
     localforage.setItem('photo', contents, function(img) { 
      // This will be a valid blob URI for an <img> tag. 
      var blob = new Blob([img], { type: "image/jpeg" }); 
      var imageURI = window.URL.createObjectURL(blob); 
      console.log(imageURI); 
      var newImg = document.createElement("img"); 
       newImg.src=imageURI; 
       // add the newly created element and its content into the DOM 
       var currentDiv = document.getElementById("div1"); 
       document.body.insertBefore(newImg, currentDiv); 
     }); 
     console.log(contents.byteLength); 
     } 

    function grabPhoto(){ 
     capturePhotoEdit(savePhoto,function(e){console.log(e);}); 
    } 

    </script> 

    </head> 
    <body> 
    <button onclick="grabPhoto();">Capture Photo</button> <br> 
    <div id="div1">&nbsp;</div> 
    </body> 
</html>

は（js/camera.jsに）カメラからつかみました。 blobのコンソールログでは、blob:null/916d1852-c8c5-4b3b-ac8c-86b6c71d0e86のようなものが出力されます。

ここで私が画像レンダリングで間違っていることを指摘してくれることを非常に感謝しています。

出典

2016-08-26 Sal

「プロミス」スタイルのAPIに切り替えることで修正されました。何とか、非同期コールバックAPIバージョンでは機能しません。以下のJSコードを修正しました：

function savePhoto(contents){ 

     localforage.setItem('photo', contents).then(function(image) { 
      // This will be a valid blob URI for an <img> tag. 
      var blob = new Blob([image],{ type:"image/jpeg" }); 
      console.log('size=' + blob.size); 
      console.log('type=' + blob.type); 
      var imageURI = window.URL.createObjectURL(blob); 
      var newImg = document.createElement("img"); 
      newImg.src=imageURI; 
      newImg.onload = function() { 
       URL.revokeObjectURL(imageUrI); 
      }; 
      var currentDiv = document.getElementById("div1"); 
      document.body.insertBefore(newImg, currentDiv); 

     }).catch(function(err) { 
      // This code runs if there were any errors 
      console.log(err); 
     }); 
} 

function grabPhoto(){ 
    capturePhotoEdit(savePhoto,function(e){console.log(e);}); 
}

出典

2016-08-28 01:47:27 Sal

iosのlocalforageブロブで画像を読み込む際にエラーが発生しました

答えて

関連する問題