How to use Secure Storage?

Ionic Native
1

arent Storage and Secure Storage two seperate things?

and i’m running into the same problems as the others…

2

Then you are running an ancient version of ionic-native. Upgrade it.

3

well no…

i’m running version 2.9.0

4

That qualifies as “ancient”, and it is having a negative effect on your app size and startup performance.

5

sorry wrong folder >.<

`-- @ionic-native/app-version@4.1.0

6

Then you do not have the same problem as OP, because the proper syntax has changed. You do not explicitly instantiate native things, you inject them via DI.

7

oh i dont get it…

 public storage: SecureStorageObject;
  

  constructor(public secureStorage: SecureStorage) {

  }

  setKey() {
   
    console.log('set called');
    console.log(this.secureStorage);

    this.storage.set('mytoken', this.setValue)
      .then(
        data => console.log(data),
        error => console.log(error)
      );

}
  getKey() {
    console.log('get called');

    this.storage.get('mytoken')
      .then(
        data => {
          this.getValue = data;
        },
        error => {
          console.log(error)
        }
       );
  }

so what do i wrong?
i simply dont get it

8

Well, you don’t show us how this.storage is ever set, you don’t explain the context of the code you posted, you don’t type the return values of your methods, you have multiple seemingly similar properties with undescriptive names who are sharing responsibilities in unclear ways.

9

I’m really new to this whole thing…

i used some tutorial to get to this point.

okay… then i go step by step

in my app.component.ts is create a SecureStorage at platform.ready()

constructor(platform: Platform, statusBar: StatusBar, splashScreen: SplashScreen, secureStorage: SecureStorage) {
    platform.ready().then(() => {
     
      statusBar.styleDefault();
      splashScreen.hide();

      secureStorage.create('bucket').then((storage: SecureStorageObject)=>{
        console.log("Secure is ready");
      },
        (error) => {
        console.log(error);
        }
        );
    });
  }

then in my home.ts there are the setKey() and getKey()

i use them in home.html as (click) for ion-buttons.

<ion-content padding>
  <ion-list>
    <ion-list-header>
      Set Key Value
    </ion-list-header>
    <ion-item>
      <ion-label floating>Set Key</ion-label>
      <ion-input type="text" [(ngModel)]="setValue"></ion-input>
    </ion-item>
    <ion-item>
      <button ion-button (click)="setKey()">Set</button>
    </ion-item>
    <ion-list-header>
      Get Key Value
    </ion-list-header>
    <ion-item>
      <button ion-button (click)="getKey()">Get</button>
    </ion-item>
    <ion-item>
      <p>Get Key value: {{getValue}}</p>
    </ion-item>
  </ion-list>
</ion-content>

I wanted to set the storage up at the start

and then set a key with a press of the button for ‘set’

und just load the stored value with a press on the ‘get’

so maybe i did something right now…

10

I see a property called storage. I see buttons that call methods on it. I never see it being set to anything, so it would stand to reason that if it is null or undefined at the time those methods are called, then those method calls would fail and throw errors. Is that what is happening?

11

you mean the ‘getValue’ and setValue’?

public getValue: string;
public setValue: string;
12

Not really. I don’t like getValue or setValue at all, but my main concern (as apparently is reality’s) is storage. You seem to be calling set() on it, but not initializing it beforehand.

13

but i do

public storage: SecureStorageObject;

feel so dump right now

14

That only declares the property. It does not give it a value.

15

then how do i do?

at the moment it feels like i dont know anything

16

Has anyone get SecureStorage to actually work? Only works first time (on install)… why only create on the provider? Such a bad plugin to use

17

Have you tried using it in conjunction with https://www.npmjs.com/package/@ionic-native/secure-storage

18 
  retrievingItems() {
    this.secureStorage
      .create("nameSpace")
      .then((storage: SecureStorageObject) => {
        // Retreive object
        storage.get("key").then((response: string) => {
         console.log(response)
        });
      });
  }

storeItem() {
this.secureStorage
              .create("nameSpace")
              .then((storage: SecureStorageObject) => {
                storage.set("Key", item).then(
                  data => {
                   console.log(data
                    };
                  );
              })
}