Integrate Okta for Authentication

kotlin-basic/client/package.json

@@ -23,6 +23,7 @@
     "@angular/platform-browser": "^5.0.0",
     "@angular/platform-browser-dynamic": "^5.0.0",
     "@angular/router": "^5.0.0",
+    "@okta/okta-angular": "0.0.8",
     "core-js": "^2.4.1",
     "rxjs": "^5.5.2",
     "zone.js": "^0.8.14"

kotlin-basic/client/proxy.conf.json

@@ -0,0 +1,6 @@
+{
+  "/good-cars": {
+    "target": "http://localhost:8081",
+    "secure": false
+  }
+}

kotlin-basic/client/src/app/app.component.css

@@ -0,0 +1,3 @@
+.toolbar-spacer {
+  flex: 1 1 auto;
+}

kotlin-basic/client/src/app/app.component.html

@@ -1,5 +1,22 @@
 <mat-toolbar color="primary">
   <span>Welcome to {{title}}!</span>
+  <span class="toolbar-spacer"></span>
+  <button mat-raised-button color="accent"
+          *ngIf="oktaAuth.isAuthenticated()"
+          (click)="oktaAuth.logout()">Logout</button>
 </mat-toolbar>
 
-<app-car-list></app-car-list>
+<router-outlet></router-outlet>
+
+<div *ngIf="oktaAuth.isAuthenticated()">
+  <app-car-list></app-car-list>
+</div>
+
+<mat-card>
+  <mat-card-content>
+    <button mat-raised-button color="accent"
+            *ngIf="!oktaAuth.isAuthenticated()"
+            (click)="oktaAuth.loginRedirect()">Login</button>
+
+  </mat-card-content>
+</mat-card>

kotlin-basic/client/src/app/app.component.ts

@@ -1,4 +1,5 @@
 import { Component } from '@angular/core';
+import { OktaAuthService } from '@okta/okta-angular';
 
 @Component({
   selector: 'app-root',
@@ -7,4 +8,6 @@ import { Component } from '@angular/core';
 })
 export class AppComponent {
   title = 'app';
+
+  constructor(public oktaAuth: OktaAuthService) {}
 }

kotlin-basic/client/src/app/app.module.ts

@@ -2,9 +2,26 @@ import { BrowserModule } from '@angular/platform-browser';
 import { NgModule } from '@angular/core';
 import { AppComponent } from './app.component';
 import { CarListComponent } from './car-list/car-list.component';
-import { HttpClientModule } from '@angular/common/http';
+import { HttpClientModule, HTTP_INTERCEPTORS } from '@angular/common/http';
+import { MatButtonModule, MatCardModule, MatListModule, MatToolbarModule } from '@angular/material';
+
+import { OktaAuthModule, OktaCallbackComponent } from '@okta/okta-angular';
+import { RouterModule, Routes } from '@angular/router';
+import { AuthInterceptor } from './shared';
 import { CarService, GiphyService } from './shared';
-import { MatListModule, MatToolbarModule } from '@angular/material';
+
+const config = {
+  issuer: 'https://dev-158606.oktapreview.com/oauth2/default',
+  redirectUri: 'http://localhost:4200/implicit/callback',
+  clientId: '0oac85oh5p2VqZJ7c0h7'
+};
+
+const appRoutes: Routes = [
+  {
+    path: 'implicit/callback',
+    component: OktaCallbackComponent
+  }
+];
 
 @NgModule({
   declarations: [
@@ -14,9 +31,13 @@ import { MatListModule, MatToolbarModule } from '@angular/material';
   imports: [
     BrowserModule,
     HttpClientModule,
-    MatListModule, MatToolbarModule
+    MatButtonModule, MatCardModule, MatListModule, MatToolbarModule,
+    RouterModule.forRoot(appRoutes),
+    OktaAuthModule.initAuth(config)
+  ],
+  providers: [CarService, GiphyService,
+    { provide: HTTP_INTERCEPTORS, useClass: AuthInterceptor, multi: true }
   ],
-  providers: [CarService, GiphyService],
   bootstrap: [AppComponent]
 })
 export class AppModule { }

kotlin-basic/client/src/app/car-list/car-list.component.html

@@ -1,6 +1,13 @@
-<mat-list>
-  <mat-list-item *ngFor="let car of cars">
-    <img mat-list-avatar src="{{car.giphyUrl}}" alt="{{car.name}}">
-    <h3 mat-line>{{car.name}}</h3>
-  </mat-list-item>
-</mat-list>
+<mat-card>
+  <mat-card-header>Car List</mat-card-header>
+  <mat-card-content>
+    <mat-list>
+      <mat-list-item *ngFor="let car of cars">
+        <img mat-list-avatar src="{{car.giphyUrl}}" alt="{{car.name}}">
+        <h3 mat-line>
+          {{car.name}}
+        </h3>
+      </mat-list-item>
+    </mat-list>
+  </mat-card-content>
+</mat-card>

kotlin-basic/client/src/app/shared/car/car.service.ts

@@ -10,5 +10,4 @@ export class CarService {
   getAll(): Observable<any> {
     return this.http.get('http://localhost:8081/good-cars');
   }
-
 }

kotlin-basic/client/src/app/shared/index.ts

@@ -1,2 +1,3 @@
 export * from './car/car.service';
 export * from './giphy/giphy.service';
+export * from './okta/auth.interceptor';

kotlin-basic/client/src/app/shared/okta/auth.interceptor.ts

@@ -0,0 +1,29 @@
+import { Injectable } from '@angular/core';
+import {
+  HttpRequest,
+  HttpHandler,
+  HttpEvent,
+  HttpInterceptor
+} from '@angular/common/http';
+import { Observable } from 'rxjs/Observable';
+import { OktaAuthService } from '@okta/okta-angular';
+
+@Injectable()
+export class AuthInterceptor implements HttpInterceptor {
+
+  constructor(private oktaAuth: OktaAuthService) {
+  }
+
+  intercept(request: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
+
+    if (request.url.indexOf('localhost') > -1) {
+      request = request.clone({
+        setHeaders: {
+          Authorization: `Bearer ${this.oktaAuth.getAccessToken().accessToken}`
+        }
+      });
+    }
+
+    return next.handle(request);
+  }
+}

kotlin-basic/client/yarn.lock

@@ -191,6 +191,22 @@
     source-map "^0.5.6"
     tree-kill "^1.0.0"
 
+"@okta/[email protected]":
+  version "0.0.8"
+  resolved "https://registry.yarnpkg.com/@okta/okta-angular/-/okta-angular-0.0.8.tgz#b205e5019af56ba415700e068388adb097818e64"
+  dependencies:
+    "@okta/okta-auth-js" "^1.8.0"
+
+"@okta/okta-auth-js@^1.8.0":
+  version "1.8.0"
+  resolved "https://registry.yarnpkg.com/@okta/okta-auth-js/-/okta-auth-js-1.8.0.tgz#0fd7365f21c87339d5e24a36b4fe052430b7c728"
+  dependencies:
+    Base64 "0.3.0"
+    q "1.4.1"
+    reqwest "2.0.5"
+    tiny-emitter "1.1.0"
+    xhr2 "0.1.3"
+
 "@schematics/angular@~0.1.0":
   version "0.1.2"
   resolved "https://registry.yarnpkg.com/@schematics/angular/-/angular-0.1.2.tgz#4d24e385c21bf2cc9ce4d3c91a8dbdd81aa463ac"
@@ -223,6 +239,10 @@
   version "2.53.43"
   resolved "https://registry.yarnpkg.com/@types/selenium-webdriver/-/selenium-webdriver-2.53.43.tgz#2de3d718819bc20165754c4a59afb7e9833f6707"
 
+[email protected]:
+  version "0.3.0"
+  resolved "https://registry.yarnpkg.com/Base64/-/Base64-0.3.0.tgz#6da261a4e80d4fa0f5c684254e5bccd16bbdce9f"
+
 abbrev@1:
   version "1.1.1"
   resolved "https://registry.yarnpkg.com/abbrev/-/abbrev-1.1.1.tgz#f8f2c887ad10bf67f634f005b6987fed3179aac8"
@@ -4778,6 +4798,10 @@ [email protected], [email protected], requires-port@~1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/requires-port/-/requires-port-1.0.0.tgz#925d2601d39ac485e091cf0da5c6e694dc3dcaff"
 
+[email protected]:
+  version "2.0.5"
+  resolved "https://registry.yarnpkg.com/reqwest/-/reqwest-2.0.5.tgz#00fb15ac4918c419ca82b43f24c78882e66039a1"
+
 resolve-cwd@^2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/resolve-cwd/-/resolve-cwd-2.0.0.tgz#00a9f7387556e27038eae232caa372a6a59b665a"
@@ -5430,6 +5454,10 @@ timers-browserify@^2.0.2:
   dependencies:
     setimmediate "^1.0.4"
 
+[email protected]:
+  version "1.1.0"
+  resolved "https://registry.yarnpkg.com/tiny-emitter/-/tiny-emitter-1.1.0.tgz#ab405a21ffed814a76c19739648093d70654fecb"
+
 [email protected]:
   version "0.0.24"
   resolved "https://registry.yarnpkg.com/tmp/-/tmp-0.0.24.tgz#d6a5e198d14a9835cc6f2d7c3d9e302428c8cf12"
@@ -6011,6 +6039,10 @@ [email protected]:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/wtf-8/-/wtf-8-1.0.0.tgz#392d8ba2d0f1c34d1ee2d630f15d0efb68e1048a"
 
+[email protected]:
+  version "0.1.3"
+  resolved "https://registry.yarnpkg.com/xhr2/-/xhr2-0.1.3.tgz#cbfc4759a69b4a888e78cf4f20b051038757bd11"
+
 xml-char-classes@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/xml-char-classes/-/xml-char-classes-1.0.0.tgz#64657848a20ffc5df583a42ad8a277b4512bbc4d"

kotlin-basic/edge-service/pom.xml

@@ -62,7 +62,11 @@
 			<artifactId>kotlin-reflect</artifactId>
 			<version>${kotlin.version}</version>
 		</dependency>
-
+		<dependency>
+			<groupId>com.okta.spring</groupId>
+			<artifactId>okta-spring-security-starter</artifactId>
+			<version>0.1.0</version>
+		</dependency>
 		<dependency>
 			<groupId>org.springframework.boot</groupId>
 			<artifactId>spring-boot-starter-test</artifactId>

kotlin-basic/edge-service/src/main/kotlin/com/example/edgeservice/EdgeServiceApplication.kt

@@ -11,7 +11,6 @@ import org.springframework.cloud.netflix.feign.FeignClient
 import org.springframework.cloud.netflix.zuul.EnableZuulProxy
 import org.springframework.context.annotation.Bean
 import org.springframework.core.Ordered
-import org.springframework.web.bind.annotation.CrossOrigin
 import org.springframework.web.bind.annotation.GetMapping
 import org.springframework.web.bind.annotation.RestController
 import org.springframework.web.cors.CorsConfiguration
@@ -59,7 +58,6 @@ class CarApiAdapterRestController(val carClient: CarClient) {
 
     @HystrixCommand(fallbackMethod = "fallback")
     @GetMapping("/good-cars")
-    @CrossOrigin(origins = arrayOf("*"))
     fun goodCars(): Collection<Car> =
             carClient
                     .read()

kotlin-basic/edge-service/src/main/resources/application.properties

@@ -1,2 +1,5 @@
 spring.application.name=edge-service
-server.port=8081
+server.port=8081
+okta.oauth.issuer=https://dev-158606.oktapreview.com/oauth2/default
+okta.oauth.clientId=0oac1m42hrA5FthoW0h7
+okta.oauth.clientSecret=Z_amJUS6WaCK8q6FrifYLP2hMinq_m0-YemC41pU