Angular πŸ‡ΊπŸ‡¦ - practical notes
1.63K subscribers
1.6K photos
1 file
532 links
Angular - practical notes

This group is for posting practical notes for Angular developers. Mostly all posts are for quick implementation https://t.me/angular_practical_notes (Commenting on posts only in ENG and UA langs here). Welcome!
Download Telegram
πŸ“„ Angular Interceptors: Localization Interceptor

#angular #interceptor

A localization interceptor can be used to automatically include the user’s preferred language or locale in HTTP requests, ensuring that the server sends responses in the appropriate language.


import { Injectable } from '@angular/core';
import {
HttpInterceptor,
HttpRequest,
HttpHandler,
} from '@angular/common/http';
import { LocaleService } from './locale.service';

@Injectable()
export class LocalizationInterceptor implements HttpInterceptor {
constructor(private localeService: LocaleService) {}

intercept(
request: HttpRequest<unknown>,
next: HttpHandler
) {
const userLocale = this.localeService.getUserLocale();
const localizedRequest = request.clone({
setHeaders: {
'Accept-Language': userLocale,
},
});
return next.handle(localizedRequest);
}
}
πŸ”₯3
πŸ“„ Content Security Policy (CSP) Interceptor

#angular #interceptor

A CSP interceptor can be used to automatically add Content Security Policy headers to outgoing HTTP requests to improve security.


import { Injectable } from '@angular/core';
import {
HttpInterceptor,
HttpRequest,
HttpHandler,
} from '@angular/common/http';

@Injectable()
export class CspInterceptor implements HttpInterceptor {

intercept(
request: HttpRequest<any>,
next: HttpHandler
) {
const cspHeader = "default-src 'self'; script-src 'self' 'unsafe-inline'";
const cspRequest = request.clone({
setHeaders: {
'Content-Security-Policy': cspHeader,
},
});
return next.handle(cspRequest);
}
}
πŸ“„ Angular Interceptors: Compression Interceptor

#angular #interceptor

A compression interceptor can be used to automatically request compressed content (e.g., gzip) from the server, reducing the amount of data transferred over the network.


import { Injectable } from '@angular/core';
import {
HttpInterceptor,
HttpRequest,
HttpHandler,
} from '@angular/common/http';

@Injectable()
export class CompressionInterceptor implements HttpInterceptor {
intercept(
request: HttpRequest<unknown>,
next: HttpHandler
) {
const compressedRequest = request.clone({
setHeaders: {
'Accept-Encoding': 'gzip, deflate'
},
});
return next.handle(compressedRequest);
}
}
❀️ 🀍 Global Error Handler β€” Angular

#angular #error #interceptor

⚠️ The example is for presentation purposes only and can be refactored.

βœ… Article link
Please open Telegram to view this post
VIEW IN TELEGRAM
Please open Telegram to view this post
VIEW IN TELEGRAM
πŸ‘1