javascript - plugin - phonegap descargar

Phonegap: guarda la imagen de la url en la galería de fotos del dispositivo

Question

Estoy desarrollando una aplicación de Phonegap y necesito guardar Image from url en Device Photo Gallery.

No puedo encontrar en Phonegap Api una forma de hacerlo y tampoco encontré el complemento de Phonegap para eso.

Lo necesito para trabajar con Iphone y Android

¡Muchas gracias!

Answer 1

Actualmente estoy trabajando en cordova-plugin-photo-library .

Puede guardar la imagen dada por url (archivo: // o datos :). Funciona en ios y android, jpeg / png / gif:

cordova.plugins.photoLibrary.saveImage(url, ''My album'', function () {}, function (err) {});

Answer 2

Este es el código de descarga de archivos que puede ser utilizado por cualquier persona. Solo tienes tres parámetros para usar esto como-

1) URL

2) Nombre de la carpeta que quieres crear en tu Sdcard

3) Nombre de archivo (Puede dar cualquier nombre al archivo)

Todos los tipos de archivos se pueden descargar usando este código. puedes usar esto como .js Y esto también funciona en IOS .

//First step check parameters mismatch and checking network connection if available call    download function
function DownloadFile(URL, Folder_Name, File_Name) {
//Parameters mismatch check
if (URL == null && Folder_Name == null && File_Name == null) {
    return;
}
else {
    //checking Internet connection availablity
    var networkState = navigator.connection.type;
    if (networkState == Connection.NONE) {
        return;
    } else {
        download(URL, Folder_Name, File_Name); //If available download function call
    }
  }
}

// Segundo paso para obtener permiso de escritura y creación de carpeta

function download(URL, Folder_Name, File_Name) {
//step to request a file system 
    window.requestFileSystem(LocalFileSystem.PERSISTENT, 0, fileSystemSuccess, fileSystemFail);

function fileSystemSuccess(fileSystem) {
    var download_link = encodeURI(URL);
    ext = download_link.substr(download_link.lastIndexOf(''.'') + 1); //Get extension of URL

    var directoryEntry = fileSystem.root; // to get root path of directory
    directoryEntry.getDirectory(Folder_Name, { create: true, exclusive: false }, onDirectorySuccess, onDirectoryFail); // creating folder in sdcard
    var rootdir = fileSystem.root;
    var fp = rootdir.fullPath; // Returns Fulpath of local directory

    fp = fp + "/" + Folder_Name + "/" + File_Name + "." + ext; // fullpath and name of the file which we want to give
    // download function call
    filetransfer(download_link, fp);
}

function onDirectorySuccess(parent) {
    // Directory created successfuly
}

function onDirectoryFail(error) {
    //Error while creating directory
    alert("Unable to create new directory: " + error.code);
}

  function fileSystemFail(evt) {
    //Unable to access file system
    alert(evt.target.error.code);
 }
}

// Tercer paso para descargar un archivo en la carpeta creada

function filetransfer(download_link, fp) {
var fileTransfer = new FileTransfer();
// File download function with URL and local path
fileTransfer.download(download_link, fp,
                    function (entry) {
                        alert("download complete: " + entry.fullPath);
                    },
                 function (error) {
                     //Download abort errors or download failed errors
                     alert("download error source " + error.source);
                     //alert("download error target " + error.target);
                     //alert("upload error code" + error.code);
                 }
            );
}

Enlace útil

Answer 3

Esto se puede hacer usando el complemento de archivo de brecha telefónica:

 var url = ''http://image_url'';
    var filePath = ''local/path/to/your/file'';
    var fileTransfer = new FileTransfer();
    var uri = encodeURI(url);

    fileTransfer.download(
        uri,
        filePath,
        function(entry) {
            console.log("download complete: " + entry.fullPath);
        },
        function(error) {
            console.log("download error source " + error.source);
            console.log("download error target " + error.target);
            console.log("upload error code" + error.code);
        },
        false,
        {
            headers: {
                "Authorization": "Basic dGVzdHVzZXJuYW1lOnRlc3RwYXNzd29yZA=="
            }
        }
    );

Answer 4

Inicialmente recibí "Could not create target file" .

Para eso use encodeURI() en la url para descargar:

var DBuri = encodeURI("https://dl.dropbox.com/u/13253550/db02.xml");
fileTransfer.download(
    DBuri,
sPath + "database.xml",

Y el código en este hilo funcionó perfectamente. Solo poniéndolo aquí.

Answer 5

La última versión de Cordova (3.3+), la versión más reciente (1.0.0+) de File usa las URL del sistema de archivos en lugar de la ruta del archivo. Entonces, para hacer que la respuesta aceptada funcione con la versión más nueva en la función FileSystemSuccess, cambie la línea:

var fp = rootdir.fullPath; 

a:

var fp = rootdir.toURL(); 

Answer 6

Limpié y envolví el código sugerido por Suhas arriba: la respuesta aceptada en un servicio angular para que pueda ser utilizado fácilmente en otra aplicación. Puedes encontrar el snipet here .

Para usarlo, incluya la secuencia de comandos en app.js (y su archivo index.html) y luego:

angular.module(''myApp.controllers.whatever'', [])
    .controller(''WhateverController'', function ($scope, SaveToGalleryService) {

    $scope.savePhoto = function(photoUrl, folderName, fileName, callback) {
        var fileName = new Date().getTime();
        SaveToGalleryService.saveToGallery(photoUrl, "Kiddiz.me", fileName, function saveSuccess(res) {
            console.log("Photo ", photoUrl, "photo saved", res);
            if (callback) {
                callback(true, res);
            }
        }, function saveFail () {
            console.log("Photo ", photoUrl, "failed to save photo");
            if (callback) {
                callback(false);
            }
        });
    }
});

Answer 7

Otra forma sencilla es utilizar el complemento Cordova / Phonegap Canvas2ImagePlugin . Instálalo y agrega la siguiente función a tu código que está basado en getImageDataURL() por Raul Sanchez (¡Gracias!).

function saveImageToPhone(url, success, error) {
    var canvas, context, imageDataUrl, imageData;
    var img = new Image();
    img.onload = function() {
        canvas = document.createElement(''canvas'');
        canvas.width = img.width;
        canvas.height = img.height;
        context = canvas.getContext(''2d'');
        context.drawImage(img, 0, 0);
        try {
            imageDataUrl = canvas.toDataURL(''image/jpeg'', 1.0);
            imageData = imageDataUrl.replace(/data:image//jpeg;base64,/, '''');
            cordova.exec(
                success,
                error,
                ''Canvas2ImagePlugin'',
                ''saveImageDataToLibrary'',
                [imageData]
            );
        }
        catch(e) {
            error(e.message);
        }
    };
    try {
        img.src = url;
    }
    catch(e) {
        error(e.message);
    }
}

Úselo así:

var success = function(msg){
    console.info(msg);
};

var error = function(err){
    console.error(err);
};

saveImageToPhone(''myimage.jpg'', success, error);

Answer 8

Tal vez podrías probar el plugin que escribí para IOS

aquí está el enlace de git: https://github.com/Nomia/ImgDownloader

Ejemplo corto:

document.addEventListener("deviceready",onDeviceReady);

//google logo url
url = ''https://www.google.com/images/srpr/logo11w.png'';

onDeviceReady = function(){
    cordova.plugins.imgDownloader.downloadWithUrl(url,function(){
        alert("success");
    },function(){
        alert("error");
    });        
}

//also you can try dataUri like: 1px gif
//url = ''data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7''

también puedes guardar un archivo local en la galería de imágenes usando el método de descarga

Answer 9

Enfoque más simple

Si está de acuerdo con que esté en la carpeta de descargas haga lo siguiente

1. Instalar el complemento del navegador en la aplicación

   cordova plugin add cordova-plugin-inappbrowser

2. Crea un botón de descarga con

   onclick="window.open("Image_URL", ''_system'');

No solo descargará la imagen que ofrecerá para abrir la imagen en la aplicación o el navegador correspondiente.