|
1 |
| -# Angular 8 Spring Boot JWT Authentication example |
2 |
| - |
3 |
| -> [Angular 8 + Spring Boot: JWT Authentication example](https://bezkoder.com/angular-spring-boot-jwt-auth/) |
4 |
| -
|
5 | 1 | # Angular 8 JWT Authentication example
|
6 | 2 |
|
7 | 3 | For more detail, please visit:
|
8 |
| -> [Angular 8 JWT Authentication with HttpInterceptor and Router](https://bezkoder.com/angular-jwt-authentication/) |
| 4 | +> [Angular 8 JWT Authentication with Web API](https://bezkoder.com/angular-jwt-authentication/) |
| 5 | +
|
| 6 | +> [Angular 10 JWT Authentication with Web API](https://bezkoder.com/angular-10-jwt-auth/) |
| 7 | +
|
| 8 | +## With Spring Boot back-end |
9 | 9 |
|
10 |
| -This project was generated with [Angular CLI](https://github.com/angular/angular-cli) version 8.3.21. |
| 10 | +> [Angular 8 + Spring Boot: JWT Authentication & Authorization example](https://bezkoder.com/angular-spring-boot-jwt-auth/) |
11 | 11 |
|
12 |
| -## Development server |
| 12 | +> [Angular 10 + Spring Boot: JWT Authentication & Authorization example](https://bezkoder.com/angular-10-spring-boot-jwt-auth/) |
13 | 13 |
|
14 |
| -Run `ng serve` for a dev server. Navigate to `http://localhost:4200/`. The app will automatically reload if you change any of the source files. |
| 14 | +Run `ng serve` for a dev server. Navigate to `http://localhost:4200/`. |
15 | 15 |
|
16 |
| -## Code scaffolding |
| 16 | +## With Node.js Express back-end |
17 | 17 |
|
18 |
| -Run `ng generate component component-name` to generate a new component. You can also use `ng generate directive|pipe|service|class|guard|interface|enum|module`. |
| 18 | +> [Node.js Express + Angular 8: JWT Authentication & Authorization example](https://bezkoder.com/node-js-express-angular-jwt-auth/) |
19 | 19 |
|
20 |
| -## Build |
| 20 | +> [Node.js Express + Angular 10: JWT Authentication & Authorization example](https://bezkoder.com/node-js-express-angular-10-jwt-auth/) |
21 | 21 |
|
22 |
| -Run `ng build` to build the project. The build artifacts will be stored in the `dist/` directory. Use the `--prod` flag for a production build. |
| 22 | +Open `app/_helpers/auth.interceptor.js`, modify the code to work with **x-access-token** like this: |
| 23 | +```js |
| 24 | +... |
23 | 25 |
|
24 |
| -## Running unit tests |
| 26 | +// const TOKEN_HEADER_KEY = 'Authorization'; // for Spring Boot back-end |
| 27 | +const TOKEN_HEADER_KEY = 'x-access-token'; // for Node.js Express back-end |
25 | 28 |
|
26 |
| -Run `ng test` to execute the unit tests via [Karma](https://karma-runner.github.io). |
| 29 | +@Injectable() |
| 30 | +export class AuthInterceptor implements HttpInterceptor { |
| 31 | + ... |
27 | 32 |
|
28 |
| -## Running end-to-end tests |
| 33 | + intercept(req: HttpRequest<any>, next: HttpHandler) { |
| 34 | + ... |
| 35 | + if (token != null) { |
| 36 | + // for Spring Boot back-end |
| 37 | + // authReq = req.clone({ headers: req.headers.set(TOKEN_HEADER_KEY, 'Bearer ' + token) }); |
29 | 38 |
|
30 |
| -Run `ng e2e` to execute the end-to-end tests via [Protractor](http://www.protractortest.org/). |
| 39 | + // for Node.js Express back-end |
| 40 | + authReq = req.clone({ headers: req.headers.set(TOKEN_HEADER_KEY, token) }); |
| 41 | + } |
| 42 | + return next.handle(authReq); |
| 43 | + } |
| 44 | +} |
31 | 45 |
|
32 |
| -## Further help |
| 46 | +... |
| 47 | +``` |
33 | 48 |
|
34 |
| -To get more help on the Angular CLI use `ng help` or go check out the [Angular CLI README](https://github.com/angular/angular-cli/blob/master/README.md). |
| 49 | +Run `ng serve --port 8081` for a dev server. Navigate to `http://localhost:8081/`. |
0 commit comments