auth0 / ionic3本机应用程序运行时错误:无法解析所有存储参数

时间:2018-10-19 17:56:50

标签: ionic3 auth0

enter image description here

我在auth0ionic 3本机应用程序的教程中遇到问题。

这是我的 app.module.ts 文件

import { BrowserModule } from '@angular/platform-browser';
import { ErrorHandler, NgModule } from '@angular/core';
import { IonicApp, IonicErrorHandler, IonicModule } from 'ionic-angular';

import { MyApp } from './app.component';
import { HomePage } from '../pages/home/home';
import { ListPage } from '../pages/list/list';

import { StatusBar } from '@ionic-native/status-bar';
import { SplashScreen } from '@ionic-native/splash-screen';
import { Geolocation } from '@ionic-native/geolocation';

import { LoginPage } from '../pages/login/login';
import { RegisterPage } from '../pages/register/register';
import { MapPage } from '../pages/map/map';
import { BattlePhasePage } from '../pages/battle-phase/battle-phase';
import { ArmyPage } from '../pages/army/army';
import { TeamPage } from '../pages/team/team';
import { ProfilePage } from '../pages/profile/profile';

import { AuthService } from '../services/auth.service';

import { Storage } from '@ionic/storage';
import {IonicStorageModule} from '@ionic/Storage';
import { HttpClientModule } from '@angular/common/http';
import { HttpModule } from '@angular/http';


@NgModule({
    declarations: [
        MyApp,
        HomePage,
        ListPage,
        LoginPage,
        RegisterPage,
        MapPage,
        BattlePhasePage,
        ArmyPage,
        TeamPage,
        ProfilePage,
        BattlePhaseContPage
        //IonicStorageModule
    ],
    imports: [
        BrowserModule,
        IonicModule.forRoot(MyApp),
        IonicStorageModule.forRoot()
    ],
    bootstrap: [IonicApp],
    entryComponents: [
        MyApp,
        HomePage,
        ListPage,
        MapPage,
        LoginPage,
        RegisterPage,
        ArmyPage,
        TeamPage,
        BattlePhasePage,
        ProfilePage,
        BattlePhaseContPage
    ],
    providers: [
        StatusBar,
        SplashScreen,
        //IonicStorageModule,
        //HttpClientModule,
        //HttpModule,
        Storage,
        AuthService,
        Geolocation,
        {provide: ErrorHandler, useClass: IonicErrorHandler}
    ]
})
export class AppModule {}

这是 auth.service.ts 服务文件:

import { Injectable, NgZone } from '@angular/core';
import { Storage } from '@ionic/storage';

// Import AUTH_CONFIG, Auth0Cordova, and auth0.js
import { AUTH_CONFIG } from './auth.config';
import Auth0Cordova from '@auth0/cordova';
import * as auth0 from 'auth0-js';

@Injectable()
export class AuthService {
    Auth0 = new auth0.WebAuth(AUTH_CONFIG);
    Client = new Auth0Cordova(AUTH_CONFIG);
    accessToken: string;
    user: any;
    loggedIn: boolean;
    loading = true;

    constructor(public zone: NgZone, private storage: Storage) {
        this.storage.get('profile').then(user => this.user = user);
        this.storage.get('access_token').then(token => this.accessToken = token);
        this.storage.get('expires_at').then(exp => {
        this.loggedIn = Date.now() < JSON.parse(exp);
         this.loading = false;
        });
    }

    login() {
        this.loading = true;
        const options = {
            scope: 'openid profile offline_access'
        };
        // Authorize login request with Auth0: open login page and get auth results
        this.Client.authorize(options, (err, authResult) => {
            if (err) {
                throw err;
            }
            // Set Access Token
            this.storage.set('access_token', authResult.accessToken);
            this.accessToken = authResult.accessToken;
            // Set Access Token expiration
            const expiresAt = JSON.stringify((authResult.expiresIn * 1000) + new Date().getTime());
            this.storage.set('expires_at', expiresAt);
            // Set logged in
            this.loading = false;
            this.loggedIn = true;
            // Fetch user's profile info
            this.Auth0.client.userInfo(this.accessToken, (err, profile) => {
                if (err) {
                    throw err;
                }
                this.storage.set('profile', profile).then(val =>
                   this.zone.run(() => this.user = profile)
                );
            });
        });
    }

    logout() {
        this.storage.remove('profile');
        this.storage.remove('access_token');
        this.storage.remove('expires_at');
        this.accessToken = null;
        this.user = null;
        this.loggedIn = false;
    }
}

在我的另一个项目中,我没有这个错误。我找不到原因。请帮忙。

1 个答案:

答案 0 :(得分:0)

这是2.0.0版离子存储的问题。
对于具有@ ionic / storage版本-2.0.0的离子应用程序,您需要执行以下步骤:

1] Run npm install @ionic/storage@2.0.0 --save --save-exact
2] Remove Storage from your providers in app.module.ts
3] import { IonicStorageModule } from '@ionic/storage' instead of import { IonicStorage } from '@ionic/storage' in app.module.ts
4] Add IonicStorageModule.forRoot() to the imports array in app.module.ts

他们提供了发行说明中应遵循的详细更新步骤。请找到发行说明here