फोनगैप और JqueryMobile के साथ फ़ाइल कैसे अपलोड करें?

Question

मैं जेक्यूएम और फोनगैप के साथ एंड्रॉइड के लिए एक मोबाइल ऐप बना रहा हूं। मुझे दूरस्थ सर्वर (गैलरी से या कैमरे के साथ एक तस्वीर लेने के लिए) फ़ाइल (छवि) अपलोड करने की आवश्यकता है। असल में यह फोनगैप फ़ाइल एपीआई का उपयोग करके किया जा सकता है, समस्या यह है कि सर्वर को सरल पोस्ट सबमिशन का समर्थन करने के लिए लिखा गया था।

मुझे अपने ऐप अनुरोध सटीक में "अनुकरण" करने की आवश्यकता है क्योंकि यह निम्न HTML फ़ॉर्म से भेजा जाएगा। इसके अतिरिक्त मुझे सर्वर प्रतिक्रिया प्राप्त करने की आवश्यकता है।

<form name="myWebForm" ENCTYPE="multipart/form-data" action="http://www.myurl.com/api/uploadImage "method="post"> 
    <input type="file" name="image" /> 
    <input type="submit" value="Submit"/>  
</form> 

मैं phonegap फ़ाइल एपीआई का उपयोग करने की कोशिश की लेकिन सर्वर साइड पर लिया गया डेटा की संरचना अलग की तुलना में यह होना चाहिए।

मैं अपने अनुप्रयोग में उस रूप को लागू करने की कोशिश की, लेकिन "फ़ाइल चुनें" बटन को अक्षम था ...

कैसे यह सर्वर साइड पर कोई बदलाव किए बिना प्राप्त किया जा सकता?

Answer 1

आप फोनगैप पर इनपुट फ़ाइल का उपयोग नहीं कर सकते हैं। यह समर्थित नहीं है। आपको ऐसा कुछ करने की ज़रूरत है:

function onDeviceReady() { 

     // Retrieve image file location from specified source 
     navigator.camera.getPicture(uploadPhoto, 
            function(message) { alert('get picture failed'); }, 
            { quality: 50, 
            destinationType: navigator.camera.DestinationType.FILE_URI, 
            sourceType: navigator.camera.PictureSourceType.PHOTOLIBRARY } 
            ); 

    } 

    function uploadPhoto(imageURI) { 
     var options = new FileUploadOptions(); 
     options.fileKey="file"; 
     options.fileName=imageURI.substr(imageURI.lastIndexOf('/')+1)+'.png'; 
     options.mimeType="text/plain"; 

     var params = new Object(); 

     options.params = params; 

     var ft = new FileTransfer(); 
     ft.upload(imageURI, encodeURI("http://some.server.com/upload.php"), win, fail, options); 
    } 

    function win(r) { 
     console.log("Code = " + r.responseCode); 
     console.log("Response = " + r.response); 
     console.log("Sent = " + r.bytesSent); 
    } 

    function fail(error) { 
     alert("An error has occurred: Code = " + error.code); 
     console.log("upload error source " + error.source); 
     console.log("upload error target " + error.target); 
    } 

प्राप्त करने पर चित्र विधि आप अपना फ़ाइल स्रोत चुनेंगे। अधिक जानकारी देखें: http://docs.phonegap.com/en/2.1.0/cordova_file_file.md.html#FileTransfer

संपादित करें:

फ़ाइल नाम एक्सटेंशन के रूप में MIMETYPE 'पाठ/सादे' प्रारूप पर अनुरोध किया जाता है पाठ स्वरूप पर छवि भेजने के लिए भी निर्दिष्ट की जरूरत थी। पैराम्स के लिए, यदि आपको उनकी आवश्यकता नहीं है तो उनका उपयोग क्यों करें?

Answer 2

आप फोनगैप पर इनपुट फ़ाइल का उपयोग नहीं कर सकते हैं। यह समर्थित नहीं है। आपको ऐसा कुछ करने की ज़रूरत है:

 <div ng-click="selectPicture()">selectPicture</div> // Put own HTML format but call the fuction 

     // Angular fuction 
      $scope.selectPicture = function() { 
       var srcType = Camera.PictureSourceType.SAVEDPHOTOALBUM; 
       var options = { 
        // Some common settings are 20, 50, and 100 
        quality: 50, 
        destinationType: Camera.DestinationType.FILE_URI, 
        // In this app, dynamically set the picture source, Camera or photo gallery 
        sourceType: srcType, 
        encodingType: Camera.EncodingType.JPEG, 
        mediaType: Camera.MediaType.PICTURE, 
        allowEdit: true, 
        correctOrientation: true //Corrects Android orientation quirks 
       } 
       navigator.camera.getPicture(function cameraSuccess(imageUri) { 
        MobileUploadFile(imageUri); 

       }, function cameraError(error) { 
        console.debug("Unable to obtain picture: " + error, "app"); 
       }, options); 
      } 

      function MobileUploadFile(imageURI) { 
       //console.log(imageURI); 
       var options = new FileUploadOptions(); 
       options.fileKey = "file"; 
       options.fileName = imageURI.substr(imageURI.lastIndexOf('/') + 1); 
       options.mimeType="image/jpeg"; 
       options.chunkedMode = false; 

       var ft = new FileTransfer(); 
       ft.upload(imageURI, encodeURI("http://www.example.com/upload.php"), function(result){ 
        //console.log(JSON.stringify(result)); 
       }, function(error){ 
        //console.log(JSON.stringify(error)); 
       }, options); 
      }; 

    // php file 
    <?php 
     // Directory where uploaded images are saved 
     $dirname = "uploads/"; 
     // If uploading file 
     if ($_FILES) { 
      print_r($_FILES); 
      mkdir ($dirname, 0777, true); 
      move_uploaded_file($_FILES["file"]{"tmp_name"],$dirname."/".$_FILES["file"]["name"]); 
     } 
     ?>