2014-07-20 35 views
2

我試圖保存使用Phonegap的相機API捕獲的照片。該函數返回文件uri。當我保存這個,它直接保存字符串uri而不是文件。 我甚至試圖在ajax頭文件中指定內容類型爲圖像。給我一個斷開的鏈接。保存手機捕獲的圖像進行解析

function capturePhoto(){ 
    //alert(address); 
    navigator.camera.getPicture(uploadPhoto,onFail,{sourceType:1,quality:60,destinationType: Camera.DestinationType.FILE_URI}); 
} 

function uploadPhoto(data){ 
    var serverUrl = 'https://api.parse.com/1/files/myphoto.jpg'; 
    $.ajax({ 
     type: "POST", 
     headers: {'X-Parse-Application-Id': PARSE_APP, 
     'X-Parse-REST-API-Key':PARSE_REST 
     // "Content-Type": "image/png" 
    }, 
     url: serverUrl, 
     data: data, 
     processData: false, 
     contentType: false, 
     success:function(e){ 
      console.log(e.url); 
     }, 
     error:function(){ 
      console.loh("ERROR"); 
     } 
    }); 
} 

回答

0

你會想要使用destinationType: Camera.DestinationType.Native_URI。這將返回圖像在設備上的實際位置,通常類似於file://storage/0/sdcard/...。然後,您可以使用此位置來加載/發送/操作圖像。

+1

這正是我所做的。但我無法僅使用其位置發送圖像。我應該將其轉換爲base64還是文件對象,然後上傳。如果是的話,如何在javascript中使用uri創建一個文件對象。現在我一直堅持這個目標。 –

+0

@ user3646217 Oi對不起,我輸入了錯誤的一個。我的意思是Native_URI –

0

您需要FileTransfer API才能獲取文件的內容。在您的uploadPhoto回調插入以下內容:

function uploadPhoto(data){ 
    var ft = new FileTransfer(); 
    var options = new FileUploadOptions(); 

    options.mimeType = "image/jpeg"; 
    options.chunkedMode = false; 
    options.params = { // Any params you need... 
    }; 

    ft.upload(data, 'https://api.parse.com/1/files/myphoto.jpg', 
     function (e) { 
      console.log('Success'); 
     }, 
     function (e) { 
      alert("Upload failed"); 
     }, options); 
} 

您可能需要改變一些選項,並根據您的後端(你沒有指定)參數。克里斯托弗Coenraets有一個很好的video tutorial與代碼如何做到這一點。另一個解決方案是base64結果,在這裏你將你創建的圖像的src設置爲fileUri,然後將該圖像繪製到畫布上並獲取畫布的dataUrl。此方法適用於舊版本的PhoneGap,但比使用FileTransfer API直接上傳要慢很多。

+1

因此,您提出的第一個選項不適用於Parse RESTAPI。閱讀(https://www.parse.com/questions/file-upload-returns-201-but-doesnt-seem-to-be-valid) 而對於第二個選項,我不需要轉換它使用因爲phonegap本身可以讓我做到這一點,只需設置Camera.DestinationType.DATA_URL即可。問題是,即使在獲得base64編碼的字符串後如何將其存儲爲以png文件的形式進行解析? –

+0

@ user3646217上次我需要在Phonegap中存儲dataUrl時,他們沒有DATA_URL選項,所以這是一個很好的新功能。我認爲你的問題更多的是一個我從未使用過的解析問題。如果您控制後端,您可以通過剝離dataUrl包裝器和base64解碼結果輕鬆地將dataUrl轉換爲文件,但是我之前沒有使用過解析,只是一點點搜索並找到了這個:https://www.parse。 com/questions/export-html5-canvas-image-to-parse-through-rest-api-or-javascript-sdk它可以做你需要的東西。 –