merged

Author: manfredsteyer

CHANGELOG.md

@@ -2,26 +2,13 @@
 
 ## Lates features
 
-See [Release Notes](https://github.com/manfredsteyer/angular-oauth2-oidc/releases)
+See [Release Notes](https://github.com/manfredsteyer/angular-oauth2-oidc/releases) for details on each release.
 
-## New Features in Version 2.1
-- New Config API (the original one is still supported)
-- New convenience methods in OAuthService to streamline default tasks:
-    - ``setupAutomaticSilentRefresh()``
-    - ``loadDiscoveryDocumentAndTryLogin()``
-- Single Sign out through Session Status Change Notification according to the OpenID Connect Session Management specs. This means, you can be notified when the user logs out using at the login provider.
-- Possibility to define the ValidationHandler, the Config as well as the OAuthStorage via DI
-- Better structured documentation
+## Older versions
 
-## New Features in Version 2
-- Token Refresh for Implicit Flow by implementing "silent refresh"
-- Validating the signature of the received id_token
-- Providing Events via the observable ``events``.
-- The event ``token_expires`` can be used together with a silent refresh to automatically refresh a token when/ before it expires (see also property ``timeoutFactor``).
+Since Angular 5, versions of this library matched up with the Angular version.
+So versions 5.x were released while Angular 5 was out, the 6.x versions during Angular 6, etc.
+If you need to support a specific old version of Angular, you can consider using a version of the library that lines up.
 
-## Breaking Changes in Version 2
-- The property ``oidc`` defaults to ``true``.
-- If you are just using oauth2, you have to set ``oidc`` to ``false``. Otherwise, the validation of the user profile will fail!
-- By default, ``sessionStorage`` is used. To use ``localStorage`` call method setStorage
-- Demands using https as OIDC and OAuth2 relay on it. This rule can be relaxed using the property ``requireHttps``, e. g. for local testing.
-- Demands that every url provided by the discovery document starts with the issuer's url. This can be relaxed by using the property ``strictDiscoveryDocumentValidation``.
+For older release notes check the repository version history, or above-linked release notes.
+For even older versions, check out [the old change log](https://github.com/manfredsteyer/angular-oauth2-oidc/blob/5d676101c6118d6fa01bfa05b17fb4a58490eaf7/CHANGELOG.md).

README.md

@@ -7,21 +7,25 @@ Support for OAuth 2 and OpenId Connect (OIDC) in Angular.
 ## Credits
 
 - [generator-angular2-library](https://github.com/jvandemo/generator-angular2-library) for scaffolding an Angular library
-- [jsrasign](https://kjur.github.io/jsrsasign/) until version 5: For validating token signature and for hashing; beginning with version 6, we are using browser APIs to minimize our bundle size
-- [Identity Server](https://github.com/identityserver) (used for testing with an .NET/.NET Core Backend)
+- [jsrasign](https://kjur.github.io/jsrsasign/) for validating token signature and for hashing
+- [Identity Server](https://github.com/identityserver) for testing with an .NET/.NET Core Backend
 - [Keycloak (Redhat)](http://www.keycloak.org/) for testing with Java
 
 ## Resources
 
-- Sources and Sample:
-https://github.com/manfredsteyer/angular-oauth2-oidc
-
-- Source Code Documentation
-https://manfredsteyer.github.io/angular-oauth2-oidc/docs
+- Sources and Sample: [https://github.com/manfredsteyer/angular-oauth2-oidc](https://github.com/manfredsteyer/angular-oauth2-oidc)
+- Source Code Documentation: [https://manfredsteyer.github.io/angular-oauth2-oidc/docs](https://manfredsteyer.github.io/angular-oauth2-oidc/docs)
+- Community-provided sample implementation: [https://github.com/jeroenheijmans/sample-angular-oauth2-oidc-with-auth-guards/](https://github.com/jeroenheijmans/sample-angular-oauth2-oidc-with-auth-guards/)
 
 ## Tested Environment
 
-Successfully tested with **Angular 8**, **Angular 7**, and its Router, PathLocationStrategy as well as HashLocationStrategy and CommonJS-Bundling via webpack. At server side we've used IdentityServer (.NET/ .NET Core) and Redhat's Keycloak (Java).
+Successfully tested with **Angular 9** and its Router, PathLocationStrategy as well as HashLocationStrategy and CommonJS-Bundling via webpack. At server side we've used IdentityServer (.NET / .NET Core) and Redhat's Keycloak (Java).
+
+**Angular 9**: Use 9.x versions of this library.
+
+**Angular 8**: Use 8.x versions of this library.
+
+**Angular 7**: Use 7.x versions of this library.
 
 **Angular 6**: Use Version 4.x of this library. Version 4.x was tested with Angular 6. You can also try the newer version 5.x of this library which has a much smaller bundle size.
 
@@ -30,21 +34,23 @@ Successfully tested with **Angular 8**, **Angular 7**, and its Router, PathLocat
 ## Release Cycle
 
 - We plan one major release for each Angular version
-    - Will contain new features
-    - Will contain bug fixes and PRs
+  - Will contain new features
+  - Will contain bug fixes and PRs
 - Critical Bugfixes on demand
 
 ## Contributions
+
 - Feel free to file pull requests
 - The closed issues contain some ideas for PRs and enhancements (see labels)
 - If you want to contribute to the docs, you can do so in the `docs-src` folder. Make sure you update `summary.json` as well. Then generate the docs with the following commands:
 
-  ```
+  ``` sh
   npm install -g @compodoc/compodoc
   npm run docs
   ```
 
-# Features 
+## Features
+
 - Logging in via Implicit Flow (where a user is redirected to Identity Provider)
 - Logging in via Code Flow + PKCE
 - "Logging in" via Password Flow (where a user enters their password into the client)
@@ -58,22 +64,24 @@ Successfully tested with **Angular 8**, **Angular 7**, and its Router, PathLocat
 
 ## Sample-Auth-Server
 
-You can use the OIDC-Sample-Server mentioned in the samples for Testing. It assumes, that your Web-App runs on http://localhost:8080.
+You can use the OIDC-Sample-Server mentioned in the samples for Testing. It assumes, that your Web-App runs on http://localhost:8080
 
 Username/Password: max/geheim
 
-*clientIds:* 
+*clientIds:*
+
 - spa-demo (implicit flow)
 - demo-resource-owner (resource owner password flow)
 
 *redirectUris:*
+
 - localhost:[8080-8089|4200-4202]
 - localhost:[8080-8089|4200-4202]/index.html
 - localhost:[8080-8089|4200-4202]/silent-refresh.html
 
 ## Installing
 
-```
+```sh
 npm i angular-oauth2-oidc --save
 ```
 
@@ -85,7 +93,7 @@ import { OAuthModule } from 'angular-oauth2-oidc';
 // etc.
 
 @NgModule({
-  imports: [ 
+  imports: [
     // etc.
     HttpClientModule,
     OAuthModule.forRoot()
@@ -96,12 +104,12 @@ import { OAuthModule } from 'angular-oauth2-oidc';
     // etc.
   ],
   bootstrap: [
-    AppComponent 
+    AppComponent
   ]
 })
 export class AppModule {
 }
-``` 
+```
 
 ## Configuring for Implicit Flow
 
@@ -116,7 +124,6 @@ Hence, the original API is still supported.
 import { AuthConfig } from 'angular-oauth2-oidc';
 
 export const authConfig: AuthConfig = {
-
   // Url of the Identity Provider
   issuer: 'https://steyer-identity-server.azurewebsites.net/identity',
 
@@ -215,9 +222,47 @@ The following snippet contains the template for the login page:
 
 ### Skipping the Login Form
 
-If you don't want to display a login form that tells the user that they are redirected to the identity server, you can use the convenience function ``this.oauthService.loadDiscoveryDocumentAndLogin();`` instead of ``this.oauthService.loadDiscoveryDocumentAndTryLogin();`` when setting up the library. 
+If you don't want to display a login form that tells the user that they are redirected to the identity server, you can use the convenience function ``this.oauthService.loadDiscoveryDocumentAndLogin();`` instead of ``this.oauthService.loadDiscoveryDocumentAndTryLogin();`` when setting up the library.
+
+This directly redirects the user to the identity server if there are no valid tokens. Ensure you have your `issuer` set to your discovery document endpoint!
 
-This directly redirects the user to the identity server if there are no valid tokens. 
+
+#### Manually skipping
+
+This is sort of what ``this.oauthService.loadDiscoveryDocumentAndLogin();`` is doing under the hood. But this gives you a fair bit more control
+
+```TypeScript
+this.oauthService
+    .loadDiscoveryDocumentAndTryLogin(/* { your LoginOptions }*/) // checks to see if the current url contains id token and access token
+    .(hasReceivedTokens => {
+        // this would have stored all the tokens needed
+        if (hasReceivedTokens) {
+            // carry on with your app
+            return Promise.resolve();
+
+            /* if you wish to do something when the user receives tokens from the identity server,
+             * use the event stream or the `onTokenReceived` callback in LoginOptions.
+             *
+             * this.oauthService.events(filter(e => e.type === 'token_received')).subscribe()
+             */
+        } else {
+            // may want to check if you were previously authenticated
+            if (this.oauthService.hasValidAccessToken() && this.oauthService.hasValidIdToken()) {
+                return Promise.resolve();
+            } else {
+                // to safe guard this from progressing through the calling promise,
+                // resolve it when it directed to the sign up page
+                return new Promise(resolve => {
+                    this.oauthService.initLoginFlow();
+                    // example if you are using explicit flow
+                    this.window.addEventListener('unload', () => {
+                        resolve(true);
+                    });
+                });
+            }
+        }
+    })
+```
 
 
 ### Calling a Web API with an Access Token
@@ -253,16 +298,9 @@ See the [documentation](https://manfredsteyer.github.io/angular-oauth2-oidc/docs
 
 ## Tutorials
 
-* [Tutorial with Demo Servers available online](https://www.softwarearchitekt.at/post/2016/07/03/authentication-in-angular-2-with-oauth2-oidc-and-guards-for-the-newest-new-router-english-version.aspx)
-* [Angular Authentication with OpenID Connect and Okta in 20 Minutes](https://developer.okta.com/blog/2017/04/17/angular-authentication-with-oidc)
-* [Add Authentication to Your Angular PWA](https://developer.okta.com/blog/2017/06/13/add-authentication-angular-pwa)
-* [Build an Ionic App with User Authentication](https://developer.okta.com/blog/2017/08/22/build-an-ionic-app-with-user-authentication)
-* [On-Site Workshops](https://www.softwarearchitekt.at)
-
-
-
-
-
-
-
-
+- [Tutorial with Demo Servers available online](https://www.softwarearchitekt.at/post/2016/07/03/authentication-in-angular-2-with-oauth2-oidc-and-guards-for-the-newest-new-router-english-version.aspx)
+- [Angular Authentication with OpenID Connect and Okta in 20 Minutes](https://developer.okta.com/blog/2017/04/17/angular-authentication-with-oidc)
+- [Add Authentication to Your Angular PWA](https://developer.okta.com/blog/2017/06/13/add-authentication-angular-pwa)
+- [Build an Ionic App with User Authentication](https://developer.okta.com/blog/2017/08/22/build-an-ionic-app-with-user-authentication)
+- [On-Site Workshops](https://www.softwarearchitekt.at)
+- [Angular 6 with Auth0 using this library](https://github.com/jeroenheijmans/sample-auth0-angular-oauth2-oidc)

angular.json

@@ -17,7 +17,8 @@
           },
           "configurations": {
             "production": {
-              "project": "projects/lib/ng-package.prod.json"
+              "project": "projects/lib/ng-package.prod.json",
+              "tsConfig": "projects/lib/tsconfig.lib.prod.json"
             }
           }
         },
@@ -45,6 +46,7 @@
         "build": {
           "builder": "@angular-devkit/build-angular:browser",
           "options": {
+            "aot": true,
             "outputPath": "dist/sample",
             "index": "projects/sample/src/index.html",
             "main": "projects/sample/src/main.ts",
@@ -63,6 +65,12 @@
           },
           "configurations": {
             "production": {
+              "budgets": [
+                {
+                  "type": "anyComponentStyle",
+                  "maximumWarning": "6kb"
+                }
+              ],
               "fileReplacements": [
                 {
                   "replace": "projects/sample/src/environments/environment.ts",
@@ -285,5 +293,8 @@
     "@schematics/angular:component": {
       "styleext": "css"
     }
+  },
+  "cli": {
+    "analytics": false
   }
 }

docs-src/silent-refresh.md

@@ -66,7 +66,7 @@ This file is loaded into the hidden iframe after getting new tokens. Its only ta
 <html>
 <body>
     <script>
-    parent.postMessage(location.hash, location.origin);
+    window.parent.postMessage(location.hash || ('#' + location.search), location.origin);
     </script>
 </body>
 </html>

docs/classes/AuthConfig.html

@@ -449,6 +449,12 @@ <h3 id="inputs">
                         </span>
                     </td>
                 </tr>
+                    <tr>
+                        <td class="col-md-4">
+                            <i>Type : </i>        <code><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/number" target="_blank" >number</a></code>
+
+                        </td>
+                    </tr>
                         <tr>
                             <td class="col-md-4">
                                     <div class="io-line">Defined in <a href="" data-line="222" class="link-to-prism">projects/lib/src/auth.config.ts:222</a></div>
@@ -2206,7 +2212,7 @@ <h3 id="inputs">
   /**
    * The window of time (in seconds) to allow the current time to deviate when validating id_token&#x27;s iat and exp values.
    */
-  public clockSkewInSec?: 600;
+  public clockSkewInSec?: number;
 
   /**
    * The interceptors waits this time span if there is no token