Question

我是开发手机应用程序的新手。在需要将所选图片的路径存储在localStorage之后，我需要从photolibrary中选择图片，我仍然使用destinationType作为FILE_URI然后我需要调用另一个函数，这有助于将所选图片转换为base64字符串使用File Reader的属性readAsDataURL并将该字符串上传到服务器。第一部分工作正常但第二部分不工作请帮我解决这个问题。

我的HTML页面是，

<button class="button" onclick="uploadImage();">From Photo Library</button>
<img style="display:none;width:60px;height:60px;" id="largeImage" src="" />
<button class="button" onclick="syncData();">Sync Data</button>

我的Script.js是，

var pictureSource;   // picture source
var destinationType; 
document.addEventListener("deviceready",onDeviceReady,false);
function onDeviceReady() {
   pictureSource=navigator.camera.PictureSourceType;
   destinationType=navigator.camera.DestinationType;
}
var pictureSource = navigator.camera.PictureSourceType;
var destinationType = navigator.camera.DestinationType;
function uploadImage(){ 
   alert('called upload pic');
   //Using library            
   navigator.camera.getPicture(uploadPhoto, onFailcapturePhoto, { quality: 50, 
    destinationType: destinationType.FILE_URI, sourceType: pictureSource.PHOTOLIBRARY});
}
function onFailcapturePhoto(message) {    
   alert("Message = " + message);
}
function uploadPhoto(imageURI) {
  if(!localStorage.imageArray) {
      var imageArray = [];
      imageArray.push(imageURI);
      localStorage.setItem('imageArray',JSON.stringify(imageArray));
      alert(JSON.stringify(imageArray));
  } else {
      var imagefile = JSON.parse(localStorage.imageArray);
      imagefile.push(imageURI);
      localStorage.setItem('imageArray',JSON.stringify(imagefile));
      alert(JSON.stringify(imagefile));
  }
  var largeImage = document.getElementById('largeImage');
  largeImage.style.display = 'block';
  largeImage.src = imageURI; // here i can display the image
}
function syncData() {
var reader = new FileReader();                              
var selectedImageArray = [];
function readFile(index) {
    alert('in read file'); // here i am getting alert
    if( index >= JSON.parse(localStorage.imageArray).length ) return;
    var file = JSON.parse(localStorage.imageArray)[index];
    alert('file=='+file);  // here i am getting path     
    reader.onloadend = function(e) {  
        // get file content
        alert('in loadend');
        selectedImageArray[index] = e.target.result;
        alert('image data==:>'+selectedImageArray[index])       
        readFile(index+1);                          
    }
    if(file) {
        alert('going to read'); // i got alert here, after this line i don't get anything
        reader.readAsDataURL(file);
        alert('reading finished');
    } else {
        alert('Your Browser does not support File Reader..');
    }           
}                           
readFile(0);    
alert('before clear'+JSON.stringify(localStorage.imageArray));
localStorage.clear();
alert('after clear'+JSON.stringify(localStorage.imageArray));   
}

谢谢＆amp;问候， Murali Selvaraj

Answer 1

通过以下代码我得到了我的问题的答案.. 非常感谢this author ..

我的更新代码是：

function uploadPhoto(imageURI) {
if (imageURI.substring(0,21)=="content://com.android") {
    photo_split=imageURI.split("%3A");
    imageURI="content://media/external/images/media/"+photo_split[1];
    alert('new uri'+imageURI);
}

if(!localStorage.imageArray) {
    var imageArray = [];
    imageArray.push(imageURI);
    localStorage.setItem('imageArray',JSON.stringify(imageArray));
    alert(JSON.stringify(imageArray));
} else {
    var imagefile = JSON.parse(localStorage.imageArray);
    imagefile.push(imageURI);
    localStorage.setItem('imageArray',JSON.stringify(imagefile));
    alert(JSON.stringify(imagefile));
}
}

function syncData() {
   var selectedImageArray = new Array();
   function readFile(index) {
    if( index >= JSON.parse(localStorage.imageArray).length ) {
        if(selectedImageArray.length == 0) return;      
        $.ajax({
            url : 'Here place your api', //your server url where u have to upload
            type : 'POST',
            dataType : 'JSON',
            contentType : 'application/json',
            data : JSON.stringify(selectedImageArray)
        })
        .done(function(res) {
            alert('success='+res);
            localStorage.clear();
        })
        .error(function(err) {
            alert('error='+err);
        }); 
    } else {
        var filePath = JSON.parse(localStorage.imageArray)[index];
        window.resolveLocalFileSystemURI(filePath, function(entry) {
            var reader = new FileReader();

            reader.onloadend = function(evt) {
                selectedImageArray.push(evt.target.result);
                readFile(index+1);
            }

            reader.onerror = function(evt) {
                  alert('read error');
                  alert(JSON.stringify(evt));
              }

            entry.file(function(f) {
                reader.readAsDataURL(f)
            }, function(err) {
                alert('error='+err);
            });

        });
    }       
}
readFile(0);
}

在phonegap中，File Reader不使用FILE_URI获取的路径来读取文件

1 个答案: