konsekutiv XHR-Anrufe im Hintergrund fehlgeschlagen, nicht sicher über den Grund.

Question

finden meine package.json

{ 
 
    "name": "angular-io-example", 
 
    "version": "1.0.0", 
 
    "private": true, 
 
    "description": "Example project from an angular.io guide.", 
 
    "scripts": { 
 
    "start": "webpack-dev-server --inline --progress --port 8080", 
 
    "test": "karma start karma.webpack.conf.js", 
 
    "build": "rimraf dist && webpack --config config/webpack.prod.js --bail", 
 
    "lint": "tslint ./src/**/*.ts -t verbose" 
 
    }, 
 
    "keywords": [], 
 
    "author": "", 
 
    "license": "MIT", 
 
    "dependencies": { 
 
    "@angular/common": "~4.0.0", 
 
    "@angular/compiler": "~4.0.0", 
 
    "@angular/compiler-cli": "~4.0.0", 
 
    "@angular/core": "~4.0.0", 
 
    "@angular/forms": "~4.0.0", 
 
    "@angular/http": "~4.0.0", 
 
    "@angular/platform-browser": "~4.0.0", 
 
    "@angular/platform-browser-dynamic": "~4.0.0", 
 
    "@angular/platform-server": "~4.0.0", 
 
    "@angular/router": "~4.0.0", 
 
    "@angular/tsc-wrapped": "~4.0.0", 
 
    "@angular/upgrade": "~4.0.0", 
 
    "@okta/okta-signin-widget": "1.7.0", 
 
    "angular-in-memory-web-api": "~0.3.1", 
 
    "aws-sdk": "^2.6.1", 
 
    "core-js": "^2.4.1", 
 
    "rxjs": "5.0.1", 
 
    "zone.js": "0.8.9" 
 
    }, 
 
    "devDependencies": { 
 
    "@types/jasmine": "2.5.36", 
 
    "@types/node": "^6.0.45", 
 
    "angular2-template-loader": "^0.6.0", 
 
    "awesome-typescript-loader": "^3.0.4", 
 
    "copy-webpack-plugin": "^4.0.1", 
 
    "css-loader": "^0.26.1", 
 
    "extract-text-webpack-plugin": "2.0.0-beta.5", 
 
    "file-loader": "^0.9.0", 
 
    "html-loader": "^0.4.3", 
 
    "html-webpack-plugin": "^2.16.1", 
 
    "image-webpack-loader": "^3.3.0", 
 
    "jasmine": "~2.4.1", 
 
    "jasmine-core": "~2.4.1", 
 
    "karma": "^1.3.0", 
 
    "karma-chrome-launcher": "^2.0.0", 
 
    "karma-cli": "^1.0.1", 
 
    "karma-jasmine": "^1.0.2", 
 
    "karma-jasmine-html-reporter": "^0.2.2", 
 
    "karma-phantomjs-launcher": "^1.0.2", 
 
    "karma-sourcemap-loader": "^0.3.7", 
 
    "karma-webpack": "^2.0.1", 
 
    "lodash": "^4.16.2", 
 
    "null-loader": "^0.1.1", 
 
    "phantomjs-prebuilt": "^2.1.7", 
 
    "protractor": "~4.0.14", 
 
    "raw-loader": "^0.5.1", 
 
    "rimraf": "^2.5.4", 
 
    "style-loader": "^0.13.1", 
 
    "tslint": "^3.15.1", 
 
    "typescript": "~2.2.0", 
 
    "url-loader": "^0.5.8", 
 
    "webpack": "2.2.1", 
 
    "webpack-dev-server": "2.4.1", 
 
    "webpack-merge": "^3.0.0" 
 
    }, 
 
    "repository": {} 
 
}

i okta Login verwenden und auch hinzugefügt canActivate bei

imports: [ BrowserModule, FormsModule, ReactiveFormsModule, RouterModule.forRoot([ {//route configs path: '', redirectTo: '/cfbsetup', pathMatch: 'full' }, { path: 'login', component: OktaComponent }, { path: 'cfbsetup', component: CFBSetupComponent, canActivate:[AuthGuard] },

weiter canActivate Funktion in AuthGuard Dienst

canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot):Promise<boolean> { 
    let componentThis:AuthGuard = this; 
    let mypromise = new Promise(function(resolve, reject){ 
     componentThis.oktaService.isAuthenticated().then((e:any) => { 
      if (e) { 
       resolve (true); 
      } else { 
       componentThis.router.navigate(['/login']); 
       resolve(false); 
      } 
     }); 
    }); 

Now login redirects page to Okta login page which checks for active session `isAuthenticated():any { 
    let componentThis:any=this; 
    var mypromise = new Promise(function(resolve, reject){ 
     componentThis.oktaSignIn.session.get((response:any) => { 
     if (response.status !== 'INACTIVE') { 
     resolve(true); 
     } else { 
     resolve(false); 
     } 
     }) 
    }); 
    return mypromise 
    }; 

`

nach, dass meine Standard-Route korrekt erhalten, wenn authentifiziert aber ich rufe meine Daten von AWS Lambda

getResponse(fnName:string, payload: any) :any { 

    let response:any; 

    AWS.config.update({region: this.config.IdentityPoolRegion}); 
    AWS.config.credentials = new AWS.CognitoIdentityCredentials({IdentityPoolId: this.config.IdentityPoolId}); 

    let lambda: any= new AWS.Lambda({region: this.config.LambdaRegion, apiVersion: this.config.apiVersion}); 
    let lambdaSettings: any = { 
      FunctionName : this.config.FunctionName, 
      InvocationType : "RequestResponse", 
      LogType : "None", 
      Payload : JSON.stringify(payload) 
    }; 
    var mypromise = new Promise(function(resolve, reject){ 
     lambda.invoke(lambdaSettings, function(error:any, data:any) { 

      if (error) { 
       reject(response = error); 
      } else { 
       resolve(response = JSON.parse(data.Payload)); 
       console.log("response in service",response); 
      } 
     }); 
    }); 
    return mypromise; 
}; 

wenn ich Login durch canActivate:[AuthGuard] von der Route entfernt deaktivieren geladen erhalten i Daten korrekt aus Lambda-Funktion, aber mit Okta Login Anruf mein Anruf an Lambda schlägt stilllos kein Fehler und nichts

ich überprüft Netzwerk Registerkarte in Chrome Ich vermute Zone.js ist Initiator für beide XHR-Anrufe, nach Okta-Sitzung Anruf aws Lambda-Aufruf schlägt fehl. nicht sicher, aber ist es etwas mit Websocket? als ich einen Anruf http://localhost:8080/sockjs-node/info?t vor okta Anruf bemerkt

i überprüft alle Versprechungen arbeiten gut, mit wenigen verschiedenen Versionen von zone.js geprüft, nicht nichts finden ..

Vielen Dank für jede Hilfe ..

Answer 1

I denke, dass dein AuthGuard-Dienst etwas Arbeit braucht. Die Methodensignatur für canActive sollte einen Boolean-Wert zurückgeben, keinen Boolean-Wert, der in einem Promise enthalten ist. Zum Beispiel:

import { Injectable } from '@angular/core'; 
import { ActivatedRouteSnapshot, CanActivate, Router, RouterStateSnapshot } from '@angular/router'; 
import { OAuthService } from 'angular-oauth2-oidc'; 

@Injectable() 
export class AuthGuard implements CanActivate { 

    constructor(private oauthService: OAuthService, private router: Router) {} 

    canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): boolean { 
    if (this.oauthService.hasValidIdToken()) { 
     return true; 
    } 

    this.router.navigate(['/home']); 
    return false; 
    } 
} 

Von: http://developer.okta.com/blog/2017/04/17/angular-authentication-with-oidc#create-open-id-connect-app

Answer 2

geändert zone.js Version

"zone.js": "^0.8.4" 

seine jetzt arbeiten ..