在 Angular 2+ 中压缩传出请求

Question

我想对从 Angular 4 应用程序向 API 项目发出的 POST 和 PUT JSON 请求使用 gzip 或 deflate 压缩。

目前，我正在使用 HttpClient 发送请求。 我曾尝试使用 pako 或 zlib 来生成压缩内容，但服务器返回响应指示压缩算法的错误实现。

我的 POST TypeScript 如下所示：

 public post(url: string, content: any): Observable < any > { const fullUrl: string = `${HttpService.baseUrl}/${url}`; Logger.debug(`Beginning HttpPost invoke to ${fullUrl}`, content); // Optionally, deflate the input const toSend: any = HttpService.compressInputIfNeeded(content); return Observable.create((obs: Observer < any > ) => { this.client.post(fullUrl, toSend, HttpService.getClientOptions()).subscribe( (r: any) => { Logger.debug(`HttpPost operation to ${fullUrl} completed`, r); // Send the response along to the invoker obs.next(r); obs.complete(); }, (err: any) => { Logger.error(`Error on HttpPost invoke to ${fullUrl}`, err); // Pass the error along to the client observer obs.error(err); } ); }); } private static getClientOptions(): { headers: HttpHeaders } { return { headers: HttpService.getContentHeaders() }; } private static getContentHeaders(): HttpHeaders { let headers: HttpHeaders = new HttpHeaders({ 'Content-Type': 'application/json; charset=utf-8' }); // Headers are immutable, so any set operation needs to set our reference if (HttpService.deflate) { headers = headers.set('Content-Encoding', 'deflate'); } if (HttpService.gzip) { headers = headers.set('Content-Encoding', 'gzip'); } return headers; } private static compressInputIfNeeded(content: any): string { const json: string = JSON.stringify(content); Logger.debug('Pako Content', pako); if (HttpService.deflate) { const deflated: string = pako.deflate(json); Logger.debug(`Deflated content`, deflated); return deflated; } if (HttpService.gzip) { const zipped: string = pako.gzip(json); Logger.debug(`Zipped content`, zipped); return zipped; } return json; }

我已经尝试了对内容进行压缩和压缩的各种排列，但似乎没有任何效果。 我还检查了 Fiddler 中的传出请求并验证 Fiddler 无法解释请求 JSON。

我还验证了内容是使用 Content-Type: application/json 发送的； charset=UTF-8 和 Content-Encoding：使用适当的 Accept-Encoding 值进行压缩。

在这一点上，我确定我做错了什么我还没有弄清楚，或者我正在尝试做的比 HttpClient 允许我做的更多。

Answer 1

我刚刚自己开始工作了。

我认为问题可能是你使用pako 。

除非您明确传递该选项，否则pako.gzip(obj)不会返回字符串。 它返回一个字节数组。 （特别是Uint8Array ）

默认的HttpClient会尝试将其转换为json字符串，这是错误的。 我做了以下事情：

  const newHeaders: Headers = new Headers();
  newHeaders.append('Content-Encoding', 'gzip')
  newHeaders.set('Content-Type', 'application/octet-stream');

  var options = { headers: newHeaders, responseType: ResponseContentType.Json };

  var compressedBody = pako.gzip(JSON.stringify(body))

  client.post(url, compressedBody.buffer, options);

请注意以下几点：

1. 需要为压缩字节数组正确设置Content-Type和Content-Encoding标头。
2. 在compressedBody对象上使用.buffer属性。 HttpClient需要这种方式，以便它知道它正在处理一个字节数组。
3. 您的API需要足够智能，以便将字节数组转换为另一端的json。 这通常不会默认处理。

Answer 2

您不必自己压缩任何东西，只需设置适当的标题，浏览器使用与服务器的协商过程自动执行此操作，如果服务器支持gzip编码，则浏览器将发送编码请求。