diff --git a/frontend/src/app/app.module.ts b/frontend/src/app/app.module.ts index f0f3070..c98f792 100644 --- a/frontend/src/app/app.module.ts +++ b/frontend/src/app/app.module.ts @@ -4,7 +4,7 @@ import { BrowserModule } from '@angular/platform-browser'; import { AppRoutingModule } from './app-routing.module'; import { AppComponent } from './app.component'; import { PageHomeComponent } from './page-home/page-home.component'; -import { HttpClientModule } from '@angular/common/http'; +import { HTTP_INTERCEPTORS, HttpClientModule } from '@angular/common/http'; import { PageLoginComponent } from './page-login/page-login.component'; import { ReactiveFormsModule } from '@angular/forms'; import { PageSignupComponent } from './page-signup/page-signup.component'; @@ -14,6 +14,8 @@ import { ImagesComponent } from './images/images.component'; import { ImageComponent } from './image/image.component'; import { MessageComponent } from './message/message.component'; import { PageImageComponent } from './page-image/page-image.component'; +import { SecurePipe } from './secure.pipe'; +import { AuthorizerInterceptor } from './authorizer.interceptor'; @NgModule({ declarations: [ @@ -26,7 +28,8 @@ import { PageImageComponent } from './page-image/page-image.component'; ImagesComponent, ImageComponent, MessageComponent, - PageImageComponent + PageImageComponent, + SecurePipe ], imports: [ BrowserModule, @@ -34,7 +37,9 @@ import { PageImageComponent } from './page-image/page-image.component'; ReactiveFormsModule, HttpClientModule, ], - providers: [], + providers: [ + { provide: HTTP_INTERCEPTORS, useClass: AuthorizerInterceptor, multi: true } + ], bootstrap: [AppComponent] }) export class AppModule { } diff --git a/frontend/src/app/authorizer.interceptor.ts b/frontend/src/app/authorizer.interceptor.ts new file mode 100644 index 0000000..208914a --- /dev/null +++ b/frontend/src/app/authorizer.interceptor.ts @@ -0,0 +1,23 @@ +import { Injectable } from '@angular/core'; +import { + HttpRequest, + HttpHandler, + HttpEvent, + HttpInterceptor +} from '@angular/common/http'; +import { Observable } from 'rxjs'; +import { UsersService } from './services/users.service'; + +@Injectable({ providedIn: 'root' }) +export class AuthorizerInterceptor implements HttpInterceptor { + public intercept(request: HttpRequest, next: HttpHandler): Observable> { + const token = localStorage.getItem('token') ?? undefined; + if (token) request = request.clone({ + setHeaders: { + Authorization: `Bearer ${token}` + } + }); + + return next.handle(request); + } +} diff --git a/frontend/src/app/image/image.component.html b/frontend/src/app/image/image.component.html index 1053136..487575b 100644 --- a/frontend/src/app/image/image.component.html +++ b/frontend/src/app/image/image.component.html @@ -1,5 +1,10 @@
- + +

{{image.name}}