I am trying to download pdf file in ionic 5 application, which is stored in firebase storage i tried using filetransfer but file not downloading in my device it gives entry url this
file:///data/user/0/io.ionic.starter/files/test.pdf
Here the Download function
download(downloadUrl: string) {
console.log(downloadUrl);
this.fileTransfer.download(downloadUrl,this.file.dataDirectory +'test.pdf').then((entry) => {
console.log('download complete: ' + entry.toURL());
}, (error) => {
});
}
You need to add
android:requestLegacyExternalStorage="true"
inside AndroidMenifest.xml > application tag like below screenshot. It's required to add in the android 11 version.
Related
file transfer not working non media files in Android 11(how handle scoped storage in ionic 3)
var targetPath = this.file.externalDataDirectory+'ido/'+date.toISOString().split('T')[0]+'/'+name; this.fileTransfer.download(url, targetPath,true).then((entry) => { console.log('download complete: ' + entry.toURL()); });
I am building an app with Ionic 5, Capacitor 2 and Angular 11.
I need to capture video and audio using the media capture cordova plugin.
I installed the following modules:
npm install cordova-plugin-media-capture
npm install #ionic-native/media-capture
And added MediaCapture to the providers of my app module.
Then I call mediaCapture.captureVideo() to retrieve a video ; unfortunately an exception is thrown when testing on a browser: cordova_not_available
The github repo states this plugin is web-compatible, and its sources have a browser implementation. However the window.navigator.device.capture is missing to make this plugin work.
Is it a bad configuration from my side? Or this cordova plugin wouldn't be compatible with capacitor?
I made a repro : https://stackblitz.com/edit/ionic-v5-media-capture-capacitor?file=src/app/app.component.ts
Thank you for your help
I wrote a regular Angular version for the web, if anyone need it:
async browserCapture() {
const stream: MediaStream = await navigator.mediaDevices.getUserMedia(this.constraints);
const recorder = new MediaRecorder(stream, {mimeType: 'ogg'});
const chunks: Blob[] = [];
recorder.ondataavailable = (event: BlobEvent) => {
if (event.data && event.data.size > 0) {
chunks.push(event.data);
this.zone.run(() => {
this.recordChunks = [...chunks];
this.cd.markForCheck();
});
}
};
this.recorder.onstop = () => {
this.zone.run(() => {
stream.getTracks().forEach(t => t.stop());
if (chunks?.length) {
this.upload(new Blob(chunks, {type: 'ogg'})); // use the blob result
}
});
};
recorder.start(500);
}
I'm using this plugin: cordova-plugin-media with ionic capacitor instead of cordova with command ionic cap sync.
My code:
audioFile: MediaObject;
constructor(private media: Media, private plt: Platform, private file: File) {}
ionViewDidEnter() {
this.plt.ready()
.then(() => {
setTimeout(() => {
this.audioFile = this.media.create(this.file.externalRootDirectory + 'audiofile.mp3');
this.audioFile.onStatusUpdate.subscribe(status => console.log('status: ', status));
this.audioFile.onSuccess.subscribe(() => console.log('Action is successful'));
this.audioFile.onError.subscribe(error => console.log('Error: ', error));
}, 1000);
})
.catch(err => console.log('ready error: ', err));
}
record() {
// When record button clicked
this.audioFile.startRecord();
}
stop() {
// When stop button clicked
this.audioFile.stopRecord();
this.audioFile.play();
}
When I clicked Record btn, record() was executed and output was: Error: 1 and when I stopped recording than the output was status: 4 and Action is successful
I expected to either play the recording or get audiofile.mp3 in the file manager of my android device but I didn't observed any of it. Can someone help me with this issue?
What I tried:
I thought that its extension issue so I tried replacing mp3 with 3gp and m4a
I tried removing file:// from file.externalRootDirectory with slice method - file.externalRootDirectory.slice(7)
Instead of externalRootDirectory I also tried applicationDirectory and externalDataDirectory
I also submitted my issue on their github repository but I didn't got any response yet
I tried finding solutions on other communities and stackoverflow itself but problem still exists
Android 10 uses a new file system therefore plugins that have not updated themselves might not read/create files on Android 10.
You need to manually add this line in your manifest file : android:requestLegacyExternalStorage="true"
Open your project in Android Studio and open the AndroidManifest file.
In tag inside your manifest file, add android:requestLegacyExternalStorage="true"
Rebuild your project
i am building a mobile app for both android and iOS i want to check if a directory exist in the users sd card or in-built memory, if the directory doesn't exist, then i will create the directory.
I checked the docs on ionic file transfer docs but i can't find anything useful, i searched online but found some code but its not working, the name of the directory that I want to create is softik, Here is the code
public storageDirectory:any;
download() {
this.chkmkDir().then(async ()=>{
const fileTransfer: FileTransferObject = this.fileTransfer.create();
this.storageDirectory = `${this.file.externalRootDirectory}test.mp4`;
fileTransfer.onProgress((progressEvent)=>this.progress=Math.round((progressEvent.loaded / progressEvent.total) * 100))
fileTransfer.download(this.url,this.storageDirectory + 'test.mp4', true).then((entry) =>
console.log('Berhasil download dan tersimpan di : ' + this.storageDirectory + "test.jpeg"),
error => console.log('gagal : ' + JSON.stringify(error)),
);
}).catch(err=>console.log())
}
chkmkDir(){
return new Promise((resolve, reject)=>{
this.file.checkDir(this.file.externalRootDirectory, 'softik').then(res=>resolve()
).catch(err => {
this.file.createDir(this.file.externalRootDirectory, 'softik',false).then(res =>resolve())
.catch(err=>reject(JSON.stringify(err)));
});
})
}
Pls what am i going wrong
first you should use File plugin
then you can search for file or Directory
see this docs https://ionicframework.com/docs/v3/native/file/#checkFile
can any one please sort it out it gives error FileTransfer is not defined.
Below is my code
controller("ExampleController", function($scope, $cordovaFileTransfer) {
$scope.upload = function() {
var options = {
fileKey: "avatar",
fileName: "yedu.jpg",
chunkedMode: false,
mimeType: "image/jpg"
};
$cordovaFileTransfer.upload("http://192.168.1.109/uploads/upload", "/android_asset/www/img/yedu.jpg", options).then(function(result) {
console.log("SUCCESS: " + JSON.stringify(result.response));
}, function(err) {
console.log("ERROR: " + JSON.stringify(err));
}, function (progress) {
// constant progress updates
});
}
});
I think you getting error in browser . As per the official documentation of plugin this plugin is not supported to browser for more details go to here and here.
If you testing in browser then before installing app in device add the cordovaFileTransfer plugin to your project.
cordova plugin add org.apache.cordova.file-transfer
And for the full implementation of file upload and download with cordova you may go to here.