Angular 5 中 ResponseType 的替代方案是什么？

Question

我正在尝试使用泛型为 http 请求重写一个包装器。在 Angular 5 之前有 Observable<responseType> 可用。我正在寻找通用 responseType 的替代方案。我的代码如下。

request(endpoint: string, options?: RequestOptions, apiOptions?: IApiServiceOptions): Observable<any> {
        options = options || {method: 'GET'};
        apiOptions = apiOptions || {};

        // build url
        const url = `${this.baseUrl}${endpoint}`;
        this.log.debugApiCall(url, this.source, options);

        // set headers
        const authToken = this.authStorage.getAuthenticationToken(this.service);

        let headers = new HttpHeaders();

        if (authToken) {
          headers = headers.set('Authorization', `Bearer ${authToken.jwtToken}`);
        }
        headers = headers.set('Content-Type', 'application/json');

        options.headers = headers;

        // make request and handle errors
        return this
          .http
          .request(options.method, url, options)
          .do((req) => {
            this.log.debugApiResponse(url, this.source, req);
          })
          .catch((res: HttpErrorResponse) => {
            switch (res.status) {
              case 0:
                this.log.error(res, `>>server down<<: ${res} - if the server is up, make sure this isn't a CORS error`);
                this._serverDown$.next();
                return Observable.throw(res);
              case 401:
                this.log.debug(`authentication error: ${res}`);

                if (!apiOptions.disableServerDown) {
                  this._authError$.next(authToken);
                } else {
                  this.log.debug('authError$ not emitted since apiOptions.disableServerDown === true');
                }

                return Observable.throw(res);
              default:
                this.log.error(res, 'Unexpected Error');
                return Observable.throw(res);
            }
          });
      }

      get(url: string, options?: RequestOptions, apiOptions?: IApiServiceOptions): Observable<any> {
        options = options || {};
        options.method = 'GET';

        return this.request(url, options, apiOptions);
      }

      post(url: string, body: any, options?: RequestOptions, apiOptions?: IApiServiceOptions): Observable<any> {
        options = options || {};
        options.method = 'POST';
        options.body = body;

        return this.request(url, options, apiOptions);
      }

      put(url: string, body: any, options?: RequestOptions, apiOptions?: IApiServiceOptions): Observable<any> {
        options = options || {};
        options.method = 'PUT';
        options.body = body;

        return this.request(url, options, apiOptions);
      }

然而，return类型的请求方法是Observable<HttpResponse<T>>。一般来说，T 的值应该是多少？到目前为止，我最终得到了任何东西。对此有何建议？

Answer 1

根据 Angular HTTP client documentation and Typescript generics，您可以在 http 请求中的函数名称及其参数之间使用泛型类型。例如。以您的 get 函数为例，您的代码将如下所示

get<T>(url: string, options?: RequestOptions, apiOptions?: IApiServiceOptions): Observable<T> {
    options = options || {};
    options.method = 'GET';

    return this.request<T>(url, options, apiOptions);
}

注意添加了通用类型 <T>。然后你可以简单地通过下一行调用你的函数

someHttpServiceInstance.get<SomeClass>(...some arguments).subscribe(
    (output: SomeClass) => { ... }
);

Proof of concept

Answer 2

尽管 HttpClient documentation doesn't reflect that and uses any, request and other methods are already typed 并允许泛型类型。正如预期的那样，方法签名取决于 responseType 和 observe 选项，因为结果取决于它们。

Answer 3

这个怎么样。

export type ResponseData = ArrayBuffer | Blob | string;

export type RequestResponse = Observable<ResponseData | Object | any
  | HttpEvent<ResponseData | any>
  | HttpResponse<ResponseData | Object>>;

 request(endpoint: string, options?: IRequestOptions, apiOptions?: IApiServiceOptions): Observable<RequestResponse> {
............

Angular 5 中 ResponseType 的替代方案是什么？

What's the alternative for ResponseType in Angular 5?

httpresponse

httpclient

typescript

angular

angular5