web-dev-qa-db-fra.com

vouloir télécharger une photo sur le serveur en utilisant phonegap dans Android

Je fais un projet dans Android phonegap et je veux télécharger une image sur le serveur.

Mais je ne me fais pas une idée, où devrais-je mettre ce code. 

Je ne peux afficher aucun bouton pour télécharger des photos, aidez-moi s'il vous plaît.

Je suis nouveau dans ce domaine. J'ai référé ce code à partir de la documentation de phonegap.

J'essaie pendant des heures, mais je ne peux pas trouver la meilleure solution. 

C'est mon premier projet Phonegap Android.

Code: 

   <head>
   <script type="text/javascript" charset="utf-8" src="cordova-2.4.0.js"></script>
   <script type="text/javascript" charset="utf-8">        
    document.addEventListener("deviceready", onDeviceReady, false);

    function onDeviceReady() {           
        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);
        options.mimeType="image/jpeg";

        var params = {};
        params.value1 = "test";
        params.value2 = "param";

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

    </script>
 </head>
 <body>
    <h1>Example</h1>
    <p>Upload File</p>
 </body>
androidcordova
14
Manu

Vous résolvez votre problème en utilisant le code suivant:

<script type="text/javascript">  
function uploadFromGallery() {

    // 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);
}
</script>
</head>
<body>
   <a data-role="button" onClick="uploadFromGallery();">Upload from Gallery</a> 
</body>

Plus d’informations sur ce message: https://stackoverflow.com/a/13862151/1853864

10
A. Magalhães

Essayez le code suivant.

// A button will call this function
// To capture photo
function capturePhoto() {
    // Take picture using device camera and retrieve image as base64-encoded string
    navigator.camera.getPicture(uploadPhoto, onFail, { 
        quality: 50, destinationType: Camera.DestinationType.FILE_URI 
    });
}

// A button will call this function
// To select image from gallery
function getPhoto(source) {
    // Retrieve image file location from specified source
    navigator.camera.getPicture(uploadPhoto, onFail, { quality: 50,
        destinationType: navigator.camera.DestinationType.FILE_URI,
        sourceType: navigator.camera.PictureSourceType.PHOTOLIBRARY
    });
}

function uploadPhoto(imageURI) {
    //If you wish to display image on your page in app
    // Get image handle
    var largeImage = document.getElementById('largeImage');

    // Unhide image elements
    largeImage.style.display = 'block';

    // Show the captured photo
    // The inline CSS rules are used to resize the image
    largeImage.src = imageURI;

    var options = new FileUploadOptions();
    options.fileKey = "file";
    var userid = '123456';
    var imagefilename = userid + Number(new Date()) + ".jpg";
    options.fileName = imagefilename;
    options.mimeType = "image/jpg";

    var params = new Object();
    params.imageURI = imageURI;
    params.userid = sessionStorage.loginuserid;
    options.params = params;
    options.chunkedMode = false;
    var ft = new FileTransfer();
    var url = "Your_Web_Service_URL";
    ft.upload(imageURI, url, win, fail, options, true);
}
//Success callback
function win(r) {
    alert("Image uploaded successfully!!");
}
//Failure callback
function fail(error) {
    alert("There was an error uploading image");
}
// Called if something bad happens.
// 
function onFail(message) {
    alert('Failed because: ' + message);
}

Créez un bouton dans votre page HTML, à l'appel onclick événement suivant les fonctions selon vos besoins. 

  • Appelez la fonction capturePhoto() pour capturer et télécharger une photo.
  • Appelez la fonction getPhoto() pour obtenir une image de la galerie.

HTML devrait contenir des boutons comme:

<input name="button" type="button" onclick="capturePhoto()" value="Take Photo"/>

<input name="button" type="button" onclick="getPhoto();" value="Browse" />

J'espère que cela pourra aider.

5
Amol Chakane

Ceci est un exemple d'application que j'ai fait pour télécharger une image sur un serveur

function getphoto() 
{
   navigator.camera.getPicture(uploadPhoto, function(message)
   { 
     alert('get picture failed');
   },

   {
     quality: 10,destinationType:navigator.camera.DestinationType.FILE_URI,sourceType:navigator.camera.PictureSourceType.PHOTOLIBRARY }); 
   }

function uploadPhoto(imageURI) 
{   
    alert("imageURI: " + imageURI);
    document.getElementById("myimg").src = imageURI;
    alert("imageURI :  " + imageURI);
    var options = new FileUploadOptions(); 
    options.chunkedMode = false;
    options.fileKey = "recFile"; 
    var imagefilename = imageURI; 
    options.fileName = imagefilename; 
    options.mimeType = "image/jpeg"; 
    var ft = new FileTransfer(); 
    ft.upload(imageURI, "http://192.168.5.109:86/YourService.svc/SaveImage", win, fail, options); 
} 

function win(r) 
{ 
    alert("Sent = " + r.bytesSent); 
} 

function fail(error) 
{ 
    switch (error.code) 
    {  
     case FileTransferError.FILE_NOT_FOUND_ERR: 
      alert("Photo file not found"); 
      break; 
     case FileTransferError.INVALID_URL_ERR: 
      alert("Bad Photo URL"); 
      break; 
     case FileTransferError.CONNECTION_ERR: 
      alert("Connection error"); 
      break; 
    } 

    alert("An error has occurred: Code = " + error.code); 
}

J'espère que cela t'aides

Merci AB

0
Arun Bertil

Eh bien, c'est un travail pour moi.

trustAllHosts: paramètre facultatif, la valeur par défaut est false. Si défini sur true, il accepte tous les certificats de sécurité. Ceci est utile depuis Android rejette les certificats de sécurité auto-signés. Non recommandé pour utilisation de la production. Pris en charge sur Android et iOS. (booléen)

Le dernier paramètre ajoute true comment booléen.

Avant 

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

Après 

var ft = new FileTransfer();
ft.upload(fileURL, encodeURI("http://some.server.com/upload.php"), win, fail, options, true);
0
John

entrez la description du lien ici

Ceci est un lien pour une méthode de travail à 100% pour le téléchargement de plusieurs images sur le serveur via la fonction cordova ou phonegap à l'aide du script Java html

Plusieurs images téléchargées sur un serveur à Cordoue

0
Eshan Chattaraj