add iframe silent refresh

Author: NEXUS\Anthony.Giretti

src/app/app.component.ts

@@ -1,4 +1,5 @@
 import { Component } from '@angular/core';
+import  $ from 'jquery';
 
 @Component({
   selector: 'app-root',
@@ -7,4 +8,13 @@ import { Component } from '@angular/core';
 })
 export class AppComponent {
   title = 'Demo Open Id Connect with Azure AD Connect';
+
+
+  constructor() {
+  }
+
+  public call()
+  {
+    
+  }
 }

src/app/auth-callback/auth-callback.component.ts

@@ -1,5 +1,5 @@
 import { AuthService } from './../services/auth.service';
-import { Router } from '@angular/router';
+import { Router, ActivatedRoute } from '@angular/router';
 import { Component, OnInit, NgZone } from '@angular/core';
 
 @Component({
@@ -9,9 +9,14 @@ import { Component, OnInit, NgZone } from '@angular/core';
 })
 export class AuthCallbackComponent implements OnInit {
 
-  constructor(private _router:Router, private _authService: AuthService, private _zone: NgZone) { }
+  constructor(private _router:Router, private _authService: AuthService, private _zone: NgZone, private _activatedRoute: ActivatedRoute) { }
 
   ngOnInit() {
+
+
+      console.log(document.location.href);
+
+
     this._authService.completeAuthentication().then(() => {
       this._zone.run(
         () => this._router.navigate(['/protected'])

src/app/openIdConnectConfig.ts

@@ -13,7 +13,9 @@ export function getClientSettings(): UserManagerSettings {
       filterProtocolClaims: true,
       loadUserInfo: true,
       automaticSilentRenew: true,
-      silent_redirect_uri: 'http://localhost:4200/assets/silent-refresh.html',
+      clockSkew: 0,
+      accessTokenExpiringNotificationTime: 570,
+      silent_redirect_uri: 'http://localhost:4200/silent-refresh.html',
       metadata: {
         issuer: "https://sts.windows.net/136544d9-038e-4646-afff-10accb370679/",
         authorization_endpoint: "https://login.microsoftonline.com/136544d9-038e-4646-afff-10accb370679/oauth2/authorize",

src/app/protected/protected.component.html

@@ -1,3 +1,7 @@
 <p>
   Welcome {{name}}
 </p>
+
+
+
+<iframe id="test" name="frame1" src="https://login.microsoftonline.com/136544d9-038e-4646-afff-10accb370679/oauth2/authorize?client_id=257b6c36-1168-4aac-be93-6f2cd81cec43&redirect_uri=http%3A%2F%2Flocalhost%3A4200%2Fauth-callback&response_type=id_token&scope=openid%20profile&state=1d56619048f94af587af8e35529735d1&nonce=89ddb46c69c047caa26fdc44a938eb45&prompt=none"></iframe>

src/app/protected/protected.component.ts

@@ -15,6 +15,8 @@ export class ProtectedComponent implements OnInit {
     console.log(this._authService.isLoggedIn());
     console.log(this._authService.getUser());
     this.name = this._authService.getName();
+
+    this._authService.subscribeevents();
   }
 
 }

src/app/services/auth.service.ts

@@ -9,14 +9,37 @@ export class AuthService {
   private _user: User = null;
 
   constructor() {
-    this._manager.getUser().then(user => {
-      this._user = user;
-    });
+
+    // this._manager.getUser().then(user => {
+    //   var token = this.parseJwt(user.id_token);
+    //   user.expires_at = token.exp;
+    //   console.log(user.expires_at);
+    //   this._user = user;
+    // });
 
     this._manager.events.addUserLoaded(user => {
+      var token = this.parseJwt(user.id_token);
+      user.expires_at = token.exp;
+      console.log(user.expires_at);
       this._user = user;
+      var that = this;
+      this.subscribeevents();
     });
 
+    //
+    
+    
+  }
+
+  public isLoggedIn(): boolean {
+    return this._user != null && !this._user.expired;
+  }
+
+  public getClaims(): any {
+    return this._user.profile;
+  }
+
+  public subscribeevents() :void {
     this._manager.events.addSilentRenewError(() => {
       console.log("error SilentRenew");
     });
@@ -28,15 +51,17 @@ export class AuthService {
     this._manager.events.addAccessTokenExpired(() => {
       console.log("access token expired");
     });
-
   }
 
-  public isLoggedIn(): boolean {
-    return this._user != null && !this._user.expired;
-  }
-
-  public getClaims(): any {
-    return this._user.profile;
+  public refreshCallBack(): void
+  {
+    console.log("start refresh callback");
+    this._manager.signinSilentCallback()
+      .then(data => {console.log("suucess callback")})
+      .catch(err => {
+          console.log("err callback");
+      });
+      console.log("end refresh callback");
   }
 
   getUser(): any {
@@ -62,4 +87,17 @@ export class AuthService {
 
 
   }
+
+   parseJwt (token) {
+    var base64Url = token.split('.')[1];
+    var base64 = base64Url.replace('-', '+').replace('_', '/');
+    return JSON.parse(window.atob(base64));
+  };
+
+
+  public Call()
+  {
+    //this._http.
+  }
+
 }

src/app/silentrefresh/silentrefresh.component.ts

@@ -1,6 +1,7 @@
 import { Component, OnInit } from '@angular/core';
 import { UserManager } from 'oidc-client';
 import { getClientSettings } from '../openIdConnectConfig';
+import { AuthService } from '../services/auth.service';
 
 @Component({
   selector: 'app-silentrefresh',
@@ -9,24 +10,14 @@ import { getClientSettings } from '../openIdConnectConfig';
 })
 export class SilentRefreshComponent implements OnInit {
 
-  private _manager = new UserManager(getClientSettings());
-
-  constructor() {
+  
+  constructor(private _authService:AuthService) {
+    
   }
 
   ngOnInit() {
-    
+    this._authService.refreshCallBack();
   }
 
-  public refresh(): void
-  {
-    console.log("start refresh");
-    this._manager.signinSilentCallback()
-      .then(data => {console.log(data)})
-      .catch((err) => {
-          console.log(err);
-      });
-      console.log("end refresh");
-  }
 
-}
+}

src/assets/silent-refresh.html

@@ -2,7 +2,7 @@
     <title></title>
 </head>
 <body>
-<script src="oidc-client.min.js"></script>
+<script src="./oidc-client.min.js"></script>
 <script>
     new UserManager().signinSilentCallback()
         .catch((err) => {