Capacitor async/await Android not working

Ionic Framework
1

Hi, on Android devices, using async await is not working for me. Am I the only one?
For example, getting a value from Capacitor’s Storage plugin is resolved with async await in the browser but not on Android

Usage example:

I have a storage.service.ts with the following:

export async function getStorage(key: string): Promise<any> {
  const item = await Storage.get({ key: key });
  if (!item.value || item.value !== 'undefined') {
    return Promise.resolve(JSON.parse(item.value));
  } else {
    Promise.resolve({});
  }
}

And then on my page, for example:

  async ngOnInit() {
    const token = await getStorage('token');
    console.log('token', token);
  }

and in the “run console” on android studio I get

I/Capacitor/Console: File: http://192.168.1.4:8100/pages-login-login-module.js - Line 134 - Msg: token [object Object]

behavior on iOS:
[log] - token {“token”:“abcd”,“fetchedAt”:“2020-04-12T20:01:35.721Z”}

behaviour on ionic serve
token {token: “abcd”, fetchedAt: “2020-04-12T19:03:29.765Z”}

wrong behavior on Android
Msg: token [object Object]if I do a {{webToken | json }} on the view, I get the _isScalar, blabla object

my capacitor version
:pill: Capacitor Doctor :pill:
Latest Dependencies:
@capacitor/cli: 2.0.1
@capacitor/core: 2.0.1
@capacitor/android: 2.0.1
@capacitor/ios: 2.0.1

2

You’re Idea should show you an Error. getStorage must return a Promise, like you correctly declared but you are not returning one. The simpelst Solution is replace
JSON.parse( item . value )
with
Promise.resolve(JSON.parse( item . value ));.

But make sure you return something anyway, as your current return is in an if, otherwise the other code will hang on the await for ever.

3

The problem still persists in Android devices. But yes, you are correct, updated my question

4

Okay next: Try debug your Android Device via Chrome Device Inspector, as you can see the [object Object] correctly there.

The Fact that it logs out token: blabla shows that the error may appear somewhere else.

5

How are you accessing the Storage plugin? See here - make sure it’s:

import { Plugins } from '@capacitor/core';

const { Storage } = Plugins;
const item = await Storage.get()....

If you import the plugin directly, you’ll get the web implementation only.

6

Hi @netkow, yes, I’m already doing it as mentioned in the docs

import { Plugins } from '@capacitor/core';

const { Storage } = Plugins;

export async function setStorage(key: string, value: any): Promise<void> {
  await Storage.set({
    key: key,
    value: JSON.stringify(value),
  });
}

export async function getStorage(key: string): Promise<any> {
  const item = await Storage.get({ key: key });
  if (!item.value || item.value !== 'undefined') {
    return Promise.resolve(JSON.parse(item.value));
  } else {
    Promise.resolve({});
  }
}

export async function removeStorage(key: string): Promise<void> {
  await Storage.remove({
    key: key,
  });
}

I’ve tried to refactor just to be sure but same behaviour. Promise is resolved on iOS and Web but not Android

  async ngOnInit() {
    const { Storage } = Plugins;
    const token = await Storage.get({ key: 'token' });
    console.log('_token', JSON.parse(token.value).token);
    this.webToken = JSON.parse(token.value).token;
  }
7

Hi, sorry, I was indeed returning an observable where I was testing this. Strange that it worked anyway in the other platforms. My bad. Thanks for the support