在phonegap中，File Reader不使用FILE_URI获取的路径来读取文件 [英] In phonegap File Reader is not reading the file by using the path getting by FILE_URI

问题描述

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

I am new to to the developing phonegap application. I need to choose the picture from the photolibrary after that need to store the path of the selected picture in localStorage, still this i did using destinationType as FILE_URI then i need to call another function which helps to converting the selected picture into base64 string by using File Reader's property readAsDataURL and upload that string to the server. The first part is working fine but that second part is not working please help me to solve this problem.

我的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是，

My Script.js is,

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));   
}

谢谢&此致，
Murali Selvaraj

Thanks & Regards, Murali Selvaraj

推荐答案

通过以下代码我得到了我的问题的答案..
非常感谢到这位作者 ..

By Following code i got answer for my question.. big thanks to 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获取的路径来读取文件的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！