2015-10-06 3 views
0

Я некоторое время боролся с этим.Phonegap camera.getPicture() отсутствие расширения файла и данных заголовка

Когда я загружаю изображение в приложение phonegap с помощью камеры.getPicture() и ft.upload(), изображение загружается без расширения файла. Я читал, что это было из-за кеша, предоставляя ссылку на фактическую запись файла или что-то в этом роде.

Это меня раздражало, но я переехал с момента, когда изображение было загружено на моем сервере и отображено отлично даже без расширения файла.

Но сегодня мы выяснили, что изображения были повернуты на 90 °.

Я немедленно установил связь между отсутствующей частью данных изображения и этой проблемой, и я думаю (не уверен). Я прав в этом вопросе.

Я прочитал изображение, повернутый на 90 ° может быть вызвано отсутствием заголовка мета-данные, так что я думаю, не только расширение файла не хватало в конце концов ..

Может кто-нибудь объяснить мне, что я упускаю в коде и что делать или в каком направлении смотреть? Это было бы круто.

Вот часть моего кода (я могу дать вам больше, если необходимо)

navigator.camera.getPicture(function(uri) { 
    try { 
    var imageURI = uri; 
    ... 
    var ft = new FileTransfer(); 
    ft.upload(imageURI, "some_script.php", function(r) { 
     ... 

Примечание: изображение хранится в базе данных, кажется, хорошо, проблема возникает, когда изображение отображается в теге.

Здесь приведен пример загрузки файла после его загрузки (я добавил вручную расширение .jpg, чтобы я мог загрузить его на noelshack, иначе не смог). Как вы можете видеть, ссылку на изображение в порядке, но один раз в теге он получает повернута

Т.Л., др

Как загрузить изображение файл полностью с телефонной связью, включая расширение файла & заголовка метаданных, а не только своего рода запись в кеш-файл.

ответ

1

IOS Код

function capturePhoto() { 
    navigator.camera.getPicture(uploadPhoto, onFail, { 
        quality: 50, 
        // allowEdit: true, 
        correctOrientation: true, 
        destinationType: Camera.DestinationType.FILE_URL, 
        // destinationType: Camera.DestinationType.DATA_URL 
        sourceType: Camera.PictureSourceType.CAMERA 
        } 
              ); 
    } 

    // function onPhotoDataSuccess(imageData) { 
    // localStorage.setItem("ImageData",imageData); 
    // localStorage.setItem("captureImgFlag",captureImgFlag); 
    // window.location = 'profileUserImgUploadInGallary.html'; 
    // } 

    function onFail(message) { 
    // alert('Failed because: ' + message); 
    } 

    function uploadPhoto(imageURI){ 
     console.log(imageURI); 
    spinnerplugin.show(); 
    var UserId = localStorage.getItem('UserId'); 
    // imgPostGallary 
    // var img = document.getElementById('imgPostGallary'); 
       // var imageURI = img.src; 
       // var imageURI = imageData; 
       // img.src = imageURI; 
    // var ImageDataUp = localStorage.getItem('ImageDataUp'); 
    // var imageURI = ImageDataUp; 
    var options = new FileUploadOptions(); 
    options.fileKey="file"; 
    options.fileName=imageURI.substr(imageURI.lastIndexOf('/')+1); 
    options.mimeType="image/jpeg"; 

    var ft = new FileTransfer(); 
    ft.upload(imageURI, encodeURI("http://XYZ/uploadimg?user_id="+UserId+""), winGallary, fail, options); 
    console.log(ft.upload); 
    } 

    function winGallary(rGallary) { 
     console.log("Code = " + rGallary.responseCode); 
     console.log("Response = " + rGallary.response); 
     console.log("Sent = " + rGallary.bytesSent); 
     spinnerplugin.hide(); 
     window.location = 'profileUserImgUploadInGallary.html'; 
    } 

    function fail(error) { 
    console.log("upload error source " + error.source); 
    console.log("upload error target " + error.target); 
    } 
+0

Спасибо, этот код отлично работает как на Android, так и на ios. возможно, окна тоже я попробую, но я думаю, это будет – BelgianR

+0

Я этот код работает практически на всех платформах и без каких-либо ошибок. & Thank You BelgianR. –

0

Здравствуйте, вот полный пример: он работает для меня, снимая фотографии и устанавливая в теге изображения и загружая эти фотографии на сервер. и все же у вас возникли проблемы с сообщением о проблемах.

<img id="profileImageId"> 
    <script type="text/javascript"> 
       var profileImage = ''; 
       function profileCapturePhotoEdit() { 
        navigator.camera.getPicture(profileonPhotoDataSuccess, onFail, { 
        quality: 50, 
        // allowEdit: true, 
        correctOrientation: true, // using this your image not roted 90 degree 
        destinationType: Camera.DestinationType.DATA_URL, 
        sourceType: Camera.PictureSourceType.CAMERA } 
              ); 
       } 

       function profileonPhotoDataSuccess(imageData) { 
        localStorage.setItem("imageDataProfile","data:image/jpeg;base64," + imageData); 
        var imageDataProfile = localStorage.getItem("imageDataProfile"); 
        document.getElementById('profileImageId').src = imageDataProfile; 
       } 

       function onFail(message) { 
        // alert('Failed because: ' + message); 
       } 

       </script> 

       <!-- uploadProfileImage --> 
      <button onclick="uploadProfileImage();"> 
       Upload Profile Image 
      </button> 

       <script type="text/javascript"> 
       function uploadProfileImage() { 
       var UserId = localStorage.getItem('UserId'); 
       var img = document.getElementById('profileImageId'); 
       var imageURI = img.src; 
       var options = new FileUploadOptions(); 
       options.fileKey="file"; // your file key in your .php file change here 
       options.fileName=imageURI.substr(imageURI.lastIndexOf('/')+1); 
       options.mimeType="image/jpeg"; // your extension 

       var ft = new FileTransfer(); 
       ft.upload(imageURI, encodeURI("http://XYZ?user_id="+UserId+""), winProfile, failProfile, options); 
       } 

       function winProfile(r) { 
       console.log("Code = " + r.responseCode); 
       console.log("Response = " + r.response); 
       console.log("Sent = " + r.bytesSent); 
       // alert('Send success'); 
       } 

       function failProfile(error) { 
       console.log("upload error source " + error.source); 
       console.log("upload error target " + error.target); 
       } 

      </script> 
+0

Благодаря вашему коду, я понял, как получить правильные метаданные. Весь мой код должен был изменить Camera.DestinationType.FILE_URI на Camera.DestinationType.DATA_URL и добавить «data: image/jpeg; base64» к переменной imageUri в обратном вызове успеха. Но он все равно дает мне файл без расширения, но независимо от того, как изображение теперь правильно отображается – BelgianR

+0

Однако, согласно документу phonegap: качество изображения, сделанное с помощью камеры на новых устройствах, неплохое, а изображения из фотоальбома не будет уменьшаться до более низкого качества, даже если указан параметр качества. Кодирование таких изображений с использованием Base64 вызвало проблемы с памятью на многих новых устройствах. ** Поэтому настоятельно рекомендуется использовать FILE_URI как «Camera.destinationType». ** – BelgianR

+0

Он не работает на IOS. Я продолжаю получать код ошибки 1 файл не найден, даже если изображение отображается в элементе BelgianR

Смежные вопросы