I'm building an app with PhoneGap Build, only targeting Android. One of the features is to download a file from a web server to the device.
This code works perfectly on Android 4.x, but doesn't work on Android 5.x and above:
var URL = 'https://example.com/path/to/file.pdf?auth_token=123xxxx';
var Folder_Name = 'Download';
var File_Name = URL.split('/');
File_Name = File_Name[File_Name.length - 1].split('?');
File_Name = File_Name[0];
window.requestFileSystem(LocalFileSystem.PERSISTENT, 0, fileSystemSuccess, fileSystemFail);
function fileSystemSuccess(fileSystem) {
var download_link = encodeURI(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.toURL(); // Returns Fullpath of local directory
fp = fp + "/" + Folder_Name + "/" + File_Name; // fullpath and name of the file which we want to give
console.log("Path to local file: " + fp);
// download function call
filetransfer(download_link, fp);
}
function onDirectorySuccess(parent) {
console.log('directory created successfully');
// Directory created successfuly
}
function onDirectoryFail(error) {
//Error while creating directory
console.log("Unable to create new directory: " + error.code);
}
function fileSystemFail(evt) {
//Unable to access file system
console.log(evt.target.error.code);
}
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('The file was successfully downloaded, you can access it in /' + Folder_Name + '/' + File_Name + '.');
console.log("download complete: " + entry.fullPath);
},
function(error) {
//Download abort errors or download failed errors
console.log("download error source " + error.source);
console.log("download error target " + error.target);
console.log("download error code" + error.code);
}
);
}
Don't get anything in the console, no error and none of the log lines, meaning that none of the callbacks gets triggered.
Did anybody else have this mysterious issue?
Thanks
try to install these versions.
phonegap plugin remove cordova-plugin-file
phonegap plugin remove cordova-plugin-file-transfer
phonegap plugin add cordova-plugin-file#4.3.3
phonegap plugin add cordova-plugin-file-transfer#1.5.1
I am use these versions and i havent problems in Anrdoid 5, 6, 7. Try it.
Related
I have more than 2 weeks that i tried to download file PDF in phonegap application using the File Transfer Plugin but it didn't work!! i make everything for that:
-installing the last version of phonegap
-installing the last version of File Transfer plugin
And this is the code to integrate in Javascript interface:
var fileTransfer = new FileTransfer();
fileTransfer.download(
"http://developer.android.com/assets/images/home/ics-android.png",
"file://sdcard/ics-android.png",
function(entry) {
alert("download complete: " + entry.fullPath);
},
function(error) {
alert("download error source " + error.source);
alert("download error target " + error.target);
alert("upload error code" + error.code);
});
But it seems wrong!!! I have like a result last three alerts in an android device:
-Download error source
-Download error target
-Upload error code
What i should doing?!!
Request you to check out my github page that contains a sample Cordova app which downloads PDF file from external URL and downloads it to the device.
This sample app is tested both in iOS and android devices. Hope it helps.
According to file transfer plugin documentation, first of all you need to create a file where you will store your remote data. Your code should look like this:
{
//call this after onDeviceReady event
...
var savePath = cordova.file.externalRootDirectory;
var fileName = "ics-android.png";
var url = encodeURI("http://developer.android.com/assets/images/home/ics-android.png");
downloadFile(savePath, fileName, url);
...
}
function downloadFile(savePath, fileName, remoteURL) {
window.resolveLocalFileSystemURL(savePath, function (dirEntry) {
console.log('file system open: ' + dirEntry.name);
createFile(dirEntry, fileName, function (fileEntry) {
download(remoteURL, fileEntry);
});
}, function (err) { alert(err) });
}
function createFile(dirEntry, fileName, callback) {
// Creates a new file or returns the file if it already exists.
dirEntry.getFile(fileName, { create: true, exclusive: false }, function (fileEntry) {
callback(fileEntry);
}, function (err) { alert(err) });
}
function download(remoteURL, fileEntry) {
var fileURL = fileEntry.toURL();
var fileTransfer = new FileTransfer();
fileTransfer.download(
remoteURL,
fileURL,
function (entry) {
alert("download complete: " + entry.fullPath);
},
function (error) {
alert("download error source " + error.source);
alert("download error target " + error.target);
alert("upload error code" + error.code);
});
}
Note that for path I use cordova.file.externalRootDirectory, so you get root sdcard path for file.
I am working on Cordova 2015 Apache cordova app . I want to recieve files from remote server such as https://www.w3.org/2011/web-apps-ws/papers/Nitobi.pdf and save it into my device.
$("#SaveFile").click(function () {
var _fileTransfer = new FileTransfer();
var filePath = cordova.file.dataDirectory + "Download/tost.pdf";
var uri = encodeURI("https://www.w3.org/2011/web-apps-ws/papers/Nitobi.pdf");
_fileTransfer .download(
uri,
filePath,
function (entry) {
alert("download complete: " + entry.fullPath);
},
function (error) {
alert("download error source " + error.source);
alert("download error target " + error.target);
alert("upload error code" + error.code);
},
false,
{
headers: {
"Authorization": "Basic dGVzdHVzZXJuYW1lOnRlc3RwYXNzd29yZA=="
}
}
);
});
When I 'v debugged it always go to error function
1st error describe the source:
2nd error describe the target:
. and i didn't get any thing in download folder .
here is a list of mobile paths from the w3c standard: http://wiki.phonegap.com/w/page/35605874/Planning%3A%20File%20API
and here is how you use it with phonegap: http://docs.phonegap.com/en/1.4.1/phonegap_file_file.md.html#LocalFileSystem
so you have to request the file system onSuccess you can use the path
here a full example: Writing and reading file in phonegap
I have been using phonegap and am trying to download wallpaper jpgs to the device camera roll. I have been testing this on the mobile phonegap app connecting to phonegap server. The code I am using goes as follows:
function DownloadFile(URL, Folder_Name, File_Name) {
if (URL == null && Folder_Name == null && File_Name == null) {
return;
}
else {
download(URL, Folder_Name, File_Name); //If available download function
}
}
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.toURL(); // Returns Fulpath of local directory
fp = fp + Folder_Name +"/"+ File_Name + ".jpg"; // fullpath and name of the file which we want to give
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);
}
}
function filetransfer(download_link, fp) {
var fileTransfer = new FileTransfer();
// File download function with URL and local path
fileTransfer.download(download_link, fp,
function (entry) {
console.log("cdvfile://localhost/persistent/" + fp);
alert("download complete: " + entry.fullPath.slice(1));
},
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);
}
);
}
What is interesting is that when I click my button that fires these methods I receive an alert saying download complete: file_name. However, there never appears an image in my camera roll. Is this an iOS issue? I've tried looking at this natively as opposed to simulating it with phonegap serve and it makes no difference.
I've also tried a file_path like so "cdvfile://localhost/persistent/"+Folder_name+"/"+ File_name+"."+ext;
with no different results.
In a difference post http://community.phonegap.com/nitobi/topics/file_download_not_working_properly_on_ios the answer for iOS was to use
<access origin="*" />
I made sure to use that in my config.xml file.
Does anyone have an idea as to what I am missing? This code has worked for others and oddly it states it completes correctly.
having a bit of trouble with my download function for Cordova. I have a function here:
document.addEventListener("deviceready", function () {
var fileUrl = e.target.getAttribute('data-soundurl');
console.log(fileUrl);
//returns as "../www/card-sounds/sound2.m4a"
var fileOutputPath = e.target.getAttribute('data-quote') + ".m4a";
console.log(fileOutputPath);
//returns as "Sound Title.m4a"
var fileTransfer = new FileTransfer();
var output = "file:///android_asset/www/res/db/"+fileOutputPath;
fileTransfer.download(
fileUrl,
output,
function(entry) {console.log("download complete: " + entry.toURL());},
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=="}}
);
console.log(output);
//returns as "file:///android_asset_www_res/db/Sound Title.m4a"
}, true);
And my log output just shows:
download error source null
download error target null
upload error codenull
I can't seem to get any sort of .root part of the FileSystem to actually give me a defined string so I'm just trying to get it to download to Android for now. Am I doing something fundamentally wrong? I am so confused here.
Try this :
var output = "/res/db/"+fileOutputPath;
For your output use
var output = cordova.file.externalRootDirectory + fileOutputPath;
cordova.file.externalRootDirectory should give you something like "file:///storage/emulated/0/"
I've already managed to save a web page (x/html) successfully, but I'd also like to save the images and mp4 videos that are contained in it, for further visualization in offline mode.
I've got access to the iOS filesystem, so I save the html by obtaining the code through an AJAX request, and later saving it to a file.
I don't really know how to do the same with video and images. I have a server to which I can send queries from my app, so it shows exclusively the content I need to download, with the optimal headers in case its necessary. I just don't know how to "download" it from the client side (Javascript).
Thanks in advance for any help.
You can use a FileTransfer object to download a remote image to a local file.
This is the latest official sample snippet:
// !! Assumes filePath is a valid path on the device
var fileTransfer = new FileTransfer();
var uri = encodeURI("http://some.server.com/download.php");
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=="
}
}
);
You can only do it natively I'm afraid.
I'm doing it through a FileDownload PhoneGap Plugin that I wrote, using NSURLConnection. I pass in the url to download to the plugin through Javascript, and a target location (and it even gives me download progress).
Have not tested it yet, but the documentation at PhoneGap looks quite promising http://docs.phonegap.com/en/1.0.0/phonegap_file_file.md.html
I have used this snippet on my ios app project:
window.requestFileSystem = window.requestFileSystem || window.webkitRequestFileSystem;
window.requestFileSystem(LocalFileSystem.PERSISTENT, 0, success, fail);
var target_directory="";
function fail() {
//alert("failed to get filesystem");
}
function downloadImage(url, filename){
alert("download just started.");
try{
var ft = new FileTransfer();
ft.download(
url,
target_directory + filename,
function(entry) {
//alert("download complete!:" + entry.nativeURL ); //path of the downloaded file
},
function(error) {
//alert("download error" + error.code);
//alert("download error" + JSON.stringify(error));
}
);
}
catch (e){
//alert(JSON.stringify(e));
}
}
function success(fileSystem) {
target_directory = fileSystem.root.nativeURL; //root path
downloadImage(encodeURI("http://upload.wikimedia.org/wikipedia/commons/2/22/Turkish_Van_Cat.jpg"), "cat.jpg"); // I just used a sample url and filename
}