Enable Code Flow silent refresh

Fixes #34
jeroenheijmans · Mar 29, 2020 · eb308d0 · eb308d0
1 parent e977739
commit eb308d0
Show file tree

Hide file tree

Showing 3 changed files with 17 additions and 6 deletions.
diff --git a/src/app/core/auth-config.ts b/src/app/core/auth-config.ts
@@ -4,10 +4,9 @@ export const authConfig: AuthConfig = {
   issuer: 'https://demo.identityserver.io',
   clientId: 'spa', // The "Auth Code + PKCE" client
   responseType: 'code',
-  useSilentRefresh: true, // Only needed for Code Flow
   redirectUri: window.location.origin + '/index.html',
   silentRefreshRedirectUri: window.location.origin + '/silent-refresh.html',
-  scope: 'openid profile email api',
+  scope: 'openid profile email api', // Ask offline_access to support refresh token refreshes
   silentRefreshTimeout: 5000, // For faster testing
   timeoutFactor: 0.25, // For faster testing
   sessionChecksEnabled: true,

diff --git a/src/app/core/auth.service.ts b/src/app/core/auth.service.ts
@@ -106,7 +106,7 @@ export class AuthService {
         // 2. SILENT LOGIN:
         // Try to log in via a refresh because then we can prevent
         // needing to redirect the user:
-        return this.startWithRefresh()
+        return this.tryNoPromptRefresh()
           .then(() => Promise.resolve())
           .catch(result => {
             // Subset of situations from https://openid.net/specs/openid-connect-core-1_0.html#AuthError
@@ -160,7 +160,7 @@ export class AuthService {
       .catch(() => this.isDoneLoadingSubject$.next(true));
   }
 
-  private startWithRefresh(): Promise<TokenResponse | OAuthEvent> {
+  private tryNoPromptRefresh(): Promise<TokenResponse | OAuthEvent> {
     if (this.oauthService.getRefreshToken()) {
       console.log('Found a refresh token, trying to use it.');
       return this.oauthService.refreshToken();
@@ -177,7 +177,7 @@ export class AuthService {
   }
 
   public logout() { this.oauthService.logOut(); }
-  public refresh() { this.oauthService.silentRefresh(); }
+  public refresh() { this.tryNoPromptRefresh(); }
   public hasValidToken() { return this.oauthService.hasValidAccessToken(); }
 
   // These normally won't be exposed from a service like this, but

diff --git a/src/silent-refresh.html b/src/silent-refresh.html
@@ -2,7 +2,19 @@
 <html>
 <body>
     <script>
-    parent.postMessage(location.hash, location.origin);
+      console.log("The silent-refresh.html file was loaded and now posting to the parent.");
+
+      // For code flow with IdentityServer4 the redirect will contain the new code in
+      // the location.search. However, the oauth library expects it in the hash fragment
+      // so we need to "fake" that.
+      //
+      // We can't just set `silentRefreshMessagePrefix` on AuthConfig, because the normal
+      // redirect after interactive login *does* use the hash fragment, so we'd break that.
+      //
+      // See also: https://github.com/manfredsteyer/angular-oauth2-oidc/issues/777
+      const fakeHashFragment = location.search.replace(/^\?/, "#");
+
+      parent.postMessage(fakeHashFragment, location.origin);
     </script>
 </body>
 </html>