HTTPリクエスト データ圧縮の基本

実際のWebプロジェクトでは、長いブログを投稿したり、デバッグ用にネットワークデータをアップロードしたりと、リクエストボディが非常に大きくなるシーンがある。
このデータをローカルで圧縮して送信できれば、ネットワークトラフィックを節約し、送信時間を短縮することができる。

HTTPプロトコルのAccept-Encoding/Content-Encodingの仕組み。
テキストベースの本文を圧縮するのに適しており、ネットワーク通信量を大幅に削減できるため、広く利用されている。
しかし、HTTPリクエストのブラウザなどは、アクセス先のサーバーが解凍に対応しているかどうか事前に分からないため、この段階のブラウザはリクエストのボディを圧縮しない。
HTTPを拡張した通信プロトコルは、リクエストボディを圧縮することをメインに。

今回取り上げる3つのデータ圧縮形式。
DEFLATE Lempel-Ziv圧縮アルゴリズム（LZ77）とHuffmanエンコーディングを使用した圧縮形式。
ZLIB DEFLATEを利用した圧縮形式。HTTPのContent-Encoding: deflateに相当。
GZIP 同じくDEFLATEを用いた圧縮形式で、HTTPのContent-Encoding: gzipに相当。

クライアント

pakoJS
Zlibライブラリのほとんどの機能をブラウザで使用できます。
GZIP、ZLIB、RAW DEFLATE の3つの圧縮形式をサポート。





var rawbd = 'content=test';
var rawl = rawbd.length;

var bufBody = new Uint8Array(rawl);
for(var i = 0; i < rawl; i++) {
bufBody[i] = rawbd.charCodeAt(i);
}

var format = 'gzip';
var buf;

switch(format) {
case 'gzip':
buf = window.pako.gzip(bufBody);
break;
case 'deflate':
buf = window.pako.deflate(bufBody);
break;
case 'deflate-raw':
buf = window.pako.deflateRaw(bufBody);
break;
}

var xhr = new XMLHttpRequest();
xhr.open('POST', '/node/');

xhr.setRequestHeader('Content-Encoding', format);
xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded; charset=UTF-8');

xhr.send(buf);

サーバー

Node.js
Zlibの組み込みラッパーがあります。




var http = require('http');
var zlib = require('zlib');

http.createServer(function (req, res) {
var zst;
var cenc = req.headers['content-encoding'];

switch(cenc) {
case 'gzip':
zst = zlib.createGunzip();
break;
case 'deflate':
zst = zlib.createInflate();
break;
case 'deflate-raw':
zst = zlib.createInflateRaw();
break;
}

res.writeHead(200, {'Content-Type': 'text/plain'});
req.pipe(zst).pipe(res);
}).listen(8111, '127.0.0.1');

PHP
組み込み関数があります。




$hce = $_SERVER['HTTP_CONTENT_ENCODING];
$rawbd = file_get_contents('php://input');

$body = '';
switch($hce) {
case 'gzip':
$body = gzdecode($rawbd);
break;
case 'deflate':
$body = gzinflate(substr($rawbd, 2, -4)) . PHP_EOL . PHP_EOL;
break;
case 'deflate-raw':
$body = gzinflate($rawbd);
break;
}

echo $body;