I'm currently working on my first Android app using Ionic and Cordova. I need to fetch an image from a REST API and save it on the device so that it can be accessed offline.
Here are the versions I am using:
Ionic:
Ionic CLI : 6.10.1 (C:\Users\agusd\AppData\Roaming\npm\node_modules@ionic\cli) Ionic Framework : @ionic/angular 5.3.1 @angular-devkit/build-angular : 0.901.12 @angular-devkit/schematics : 9.1.12 @angular/cli : 9.1.12 @ionic/angular-toolkit : 2.3.0
Capacitor:
Capacitor CLI : 2.4.0 @capacitor/core : 2.4.0
Cordova:
Cordova CLI : 9.0.0 ([email protected]) Cordova Platforms : android 8.1.0 Cordova Plugins : cordova-plugin-ionic-keyboard 2.2.0, cordova-plugin-ionic-webview 4.2.1, (and 4 other plugins)
I followed a guide for Ionic 3 but couldn't make it work with my current version of Ionic.
So far, I have been able to retrieve the JSON object containing the image URL, but I'm unsure how to download and store the image in my assets folder.
My code looks like this:
api.service.ts:
apiURL = 'my api url...';
getDiarios() {
const diarioArgs = {
method: 'GET',
mode: 'cors',
headers: {
'Content-Type': 'application/json' }
};
return this.http.get(this.apiURL, diarioArgs);
}
Then, I have this function that calls the service and retrieves the response:
data: any;
lastDiario: any;
lastID = 0;
loadLastDiario() {
try {
this.apiService.getDiarios().subscribe(
(data) => {
this.data = data;
for (const item of this.data.content) {
if (item.id > this.lastID) {
// Get the object with the largest id, which is the latest uploaded
this.lastID = item.id;
this.lastDiario = item;
}
}
console.log(this.lastDiario);
for (const item of this.lastDiario.archivos) {
// Need to save each item in "archivos" to my assets folder or elsewhere
// Each item has a URL property accessible through **this.lastDiario.archivos.url**
}
}
);
} catch (error) {
console.log("Couldn't connect to the service")
}
}
If anyone could offer assistance, as I'm new to Ionic and Angular, I would appreciate any advice!