在iOS上通过localforage Blob加载图像时出错

Question

我正在通过Cordova相机API在ios设备上捕获相机图像，然后通过localforage保存它。 但是，似乎没有加载资源，因为单击Safari Web Inspector Resources标签下的blob会显示An error occured while trying to load resources发生错误错误，并且图像呈现为20x20白色背景而不是照片。 这是我关于Cordova Camera API HTML包装器：

<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>

我们使用savePhoto来保存从相机获取的图像（在js/camera.js ）。 blob控制台日志记录会打印出blob:null/916d1852-c8c5-4b3b-ac8c-86b6c71d0e86 。

我非常感谢您指出我在图像渲染方面做错的事情。

Answer 1

现在已通过切换为“ Promise”样式的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);});
}

在iOS上通过localforage Blob加载图像时出错

问题描述

1 个解决方案

解决方案1
0 已采纳 2016-08-28 01:47:27

在iOS上通过localforage Blob加载图像时出错

问题描述

1 个解决方案

解决方案1 0 已采纳 2016-08-28 01:47:27

解决方案1
0 已采纳 2016-08-28 01:47:27