Call a Promise from an Angular HttpInterceptor

Question

I've got an angular HttpInterceptor and I need to call an encryption method that's defined like so:

private async encrypt(obj: any): Promise<string> {

I'm not sure how to handle this in the HttpInterceptor though:

intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
    const modified = req.clone({ 
       body: this.encrypt(req.body)
    });

    return next.handle(modified).pipe(

I'm not sure how to tie the two of those together so that I can call the encrypt method properly from within the intercept function.

does this help? https://stackoverflow.com/questions/39319279/convert-promise-to-observable — Akber Iqbal, Dec 24 '18 at 04:22
It probably should, but I'm really new to rxjs. Even getting it as an Observable I'm still not sure how to put the two together. — Gargoyle, Dec 24 '18 at 04:25
@SachilaRanawaka Why? It's encryption code, and at the end it'll return a Promise — Gargoyle, Dec 24 '18 at 04:36

score 6 · Accepted Answer · answered Dec 24 '18 at 04:47

USe from to convert promise to observable and use the switchMap operator to do the modification u need and return the handler.

  intercept(request: HttpRequest<any>, next: HttpHandler) : Observable<HttpEvent<any>>{
        return from( this.encrypt(req.body))
              .pipe(
                switchMap(data=> { // do the changes here
                  const modified = req.clone({ 
                           body: data
                  });

                  return next.handle(modified)
                })
               );
    }

Yoarthur · Answer 2 · 2018-12-24T04:43:41.763

0

Import the from operator in the component.

import { from } from 'rxjs';

Then call your encrypt() method, and in the response return the next.handle() object. Like this.

intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {

  from(encrypt(obj: any).then(
  (data) => {  
   /* do the modifications */
   const modified = req.clone({ ..... });
   ...
   /* return the object interceptor function so it can work */
    next.handle(modified) 
  })

I'll let the link if you need it later. https://www.learnrxjs.io/

edited Dec 24 '18 at 04:43

answered Dec 24 '18 at 04:27

Yoarthur

909
9
20

I've gotta call it before the `next.handle` as it needs to change the `modified` variable. – Gargoyle Dec 24 '18 at 04:28
No. req is an HttpRequest so calling clone() will also return an HttpRequest. – Gargoyle Dec 24 '18 at 04:33
But now the intercept method doesn't actually return the `next.handle` call. That's where I'm getting stuck. – Gargoyle Dec 24 '18 at 04:42
Now it does, from() operator transform the Promise into an observable. Let me now ;) – Yoarthur Dec 24 '18 at 04:44

Call a Promise from an Angular HttpInterceptor

2 Answers2