A permissions operator is a custom RxJS operator that combines permission checks with observable processing, allowing emissions to continue only when required permissions exist. section 5.4.3
Its implementation follows a small, reusable pipeline:
- Accept the required permissions and obtain a permissions service through dependency injection. section 5.4.3
- Combine each source value with the latest permission result, filter unauthorized values, and map authorized values back to the original emission. section 5.4.3
- Reuse the operator wherever an observable needs permission-based prevention, not only for HTTP requests. section 5.4.3
Protecting employee APIs
An Angular HTTP interceptor applies the operator with CreateEmployee, DeleteEmployee, EditEmployeeGeneralDetails, and ViewEmployees permissions. Unauthorized requests do not proceed, reducing calls that would otherwise produce a 403 response. section 5.4.3
Listing 5.13 Custom RxJS operator that uses dependency injection
export function hasPermissions<T>(
permissions: Permissions[], #1
permissionsService = inject(PermissionsService), #2
): MonoTypeOperatorFunction<T> {
return pipe(
withLatestFrom(permissionsService.hasPermissions(permissions)), #3
filter(([, hasPermissions]) => hasPermissions), #4
map(([value]) => value) #5
);
}
Inspect the generic operator signature and its dependency-injected permission pipeline. section 5.4.3
Listing 5.14 Using a custom RxJS operator in an Angular interceptor
export const employeePermissionsInterceptor: HttpInterceptorFn = (
req: HttpRequest<any>,
next: HttpHandlerFn
) => {
return next(req).pipe(
hasPermissions(['CreateEmployee', 'DeleteEmployee', 'EditEmployeeGeneralDetails', 'ViewEmployees']),
);
};
Inspect how the operator is applied in an Angular functional HTTP interceptor. section 5.4.3
