Not able to store to storage after http request

Ionic Framework ionic-v3
1

I already read the docs regarding Ionic Storage and have already imported what is needed. But still can’t seem to get it to work. When I check the localStorage of chrome (I use ‘ionic cordova run browser’), it’s empty.

Here’s my code:

cordova.plugin.http.sendRequest('http://127.0.0.1:5000/api/login/', options, function(response) {
       
        try {   //onSuccess
            response.data = JSON.parse(response.data);
            
            this.store.set('token', JSON.stringify(response.data.token));
            
            this.navCtrl.setRoot(HomePage);

          } catch(e) {
            console.error('JSON parsing error');
          }
        },  function(response) {    //onFail
            console.log('403');
            alert.present();

        }
    );

My constructor looks like this:

constructor(public navCtrl: NavController,
            private alerts: AlertController, 
            private http: HTTP, 
            private store: Storage, 
            ) {}

When I run it, it throws an error and shows ‘JSON parsing error’ instead of setting a value to the ‘token’ key and rerouting to HomePage. What am I doing wrong here? Please help

2

My guess would be that it’s the same issue you’re having in the other thread I responded to.

3

I resolved the other problem by implementing this outside my http call so it can reach my constructor:

let alert = this.alerts.create({ //creates alert 
        title: 'Error',
        subTitle: 'Username/password is invalid!',
        cssClass: 'alertCustomCss',
        buttons: ['Dismiss']
    })

I do know that I have to do SOMETHING similar with storage, but I have no idea what EXACTLY it is that I have to do

4

Have you replaced instances of function() {} with fat arrows () => {}?

5

yep I did. changed it from:

function(response) {}

to:

response => {}
6

Oki dokey. Just making sure.

What does your console output if you put

console.log(response.data);

before

response.data = JSON.parse(response.data);
7

this:

console.log(response.data);

returns a JSON object

{message: "login successful!", public_id: "b8346897-8e20-46ed-a03e-968927a1997c", role_id: "2", status: "200", token: "eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJwdWJsaWNfa…2ODR9.x2ujMh5quv9HlWw83QBNUx3yLyG2FBecoIpP-3A_t4s"}

For some reason I got it working, maybe it was a routing issue because when i rerouted it to TabsPage instead of Homepage, it rerouted to the desired page. But it still won’t store to storage. Now there’s a new error:

OPEN database: _ionicstorage
cordova.js:1003 Error: exec proxy not found for :: SQLitePlugin :: close
cordova.js:1003 Error: exec proxy not found for :: SQLitePlugin :: open
SQLitePlugin.js:196 OPEN database: _ionicstorage FAILED, aborting any pending transactions
SQLitePlugin.js:82 Could not open database

basically it reroutes now, but still can’t store to storage.

edit: when I press f12 and go to Application tab, under IndexedDB there is now a db that’s named ‘_ionicstorage’

8

ok so it already stores to indexeddb, but when i try to do

this.store.get('token').then((val) => {
    console.log('Your token is ', String(val));

it returns ‘Your token is null’

the code sequence is as follows:

this.store.set('token', response.data.token);
this.store.set('public_id', response.data.public_id);
this.store.set('role_id', response.data.role_id);

this.store.get('token').then((val) => {
    console.log('Your token is ', String(val));
});
9

set and get will be asynchronous, and if you legitimately only need ‘token’ then I’d say do

this.store.set('token', response.data.token)
.then(_ => this.storage.get('token'))
.then(val => {
  console.log('Your token is ', String(val));
});
10

Oh now it works. Thanks a lot for the help! :+1::+1: