Angular HttpClient replacement for RequestOptions?

问题

Angular's Http module used to have a RequestOptions object which could be passed to its get method (e.g. this.http.get(fooUrl, barOptions). The RequestOptions contained any headers. This was deprecated. The "closest replacement" for the deprecated RequestOptions is HttpRequest.

There's two problems with this:
1. HttpRequest has a url param, so it is NOT an equivalent of RequestOptions. In fact, it seems to encapsulate the entire request, yet I don't see it used anywhere, so I am guessing it's just an internal class..
2. HttpClient's get method does NOT take HttpRequest as an argument.

The source code for HttpClient's get method looks like this:

/**
 * Constructs a `GET` request that interprets the body as an `ArrayBuffer` and returns the response in
 *  an `ArrayBuffer`.
 *
 * @param url     The endpoint URL.
 * @param options The HTTP options to send with the request.
 *
 * @return An `Observable` of the response, with the response body as an `ArrayBuffer`.
 */
get(url: string, options: {
    headers?: HttpHeaders | {
        [header: string]: string | string[];
    };
    observe?: 'body';
    params?: HttpParams | {
        [param: string]: string | string[];
    };
    reportProgress?: boolean;
    responseType: 'arraybuffer';
    withCredentials?: boolean;
}): Observable<ArrayBuffer>;

Is s there some type I can use for the options param now? Should I just define an interface that has HttpHeaders on it? If there isn't a type for it, why not?

My old code looks like this:

reqOptions.headers.set('Authorization', user.token);
reqOptions.headers.set('RefreshToken', user.refreshToken);

RequestOptions from the old Http module had a headers property and was statically typed.

P.S. I read the answer here, but it doesn't use a type: Angular4: Http -> HttpClient - requestOptions

回答1:

Here's a little something I had written as a helper service. I'm sure you could extend to pass along any explicit headers.

export class ParamBuilderService {
  buildParams(queryParams: Params, excludedValues ? : Array < string > ): HttpParams {
    let params = new HttpParams();
    for (const key in queryParams) {
      if (queryParams.hasOwnProperty(key)) {
        const value = queryParams[key];
        if (excludedValues) {
          const containExcludedValue = excludedValues.indexOf(value) !== -1;
          if (!!value && !containExcludedValue) {
            params = params.append(key, value);
          }
        } else if (!!value || value === 0) {
          params = params.append(key, value);
        }
      }
    }
    return params;
  }
}

回答2:

For now, I just defined "my own" RequestOptions interface in a new file in my app called request-options.ts. The interface definition is below, the properties were lifted straight out of the Angular Library's client.d.ts file to match what HttpClient expects from the options param for REST calls:

import { HttpHeaders, HttpParams } from '@angular/common/http';

export interface RequestOptions {
  headers?: HttpHeaders;
  params?: HttpParams;
}

Now I can statically type RequestOptions again, e.g.:

const requestOptions: RequestOptions = {
  params: new HttpParams()
};

(Above example code lifted from here: Angular4: Http -> HttpClient - requestOptions)

I am not sure if I am completely missing something or I should go make a PR against the angular repo. This seems like a rather obvious omission if there isn't a reason for it.

来源：https://stackoverflow.com/questions/56977325/angular-httpclient-replacement-for-requestoptions

标签

angular

typescript

angular-httpclient