場景：web前端在獲取一些基礎資料(比如：地區資料、行業、學歷、專業，各種分類、屬性等等)時，通過伺服器一次拉取所有基礎資料json壓縮包。優點：一可以減少流量，二可以減少很多http請求 …

該例需要瀏覽器localStorage來儲存以上解壓後的大量資料，同時，需要XMLHTTPRequest2支援請求二進位制資料流，故ie低版本瀏覽器不適用…

# 方法程式碼

/**
 * XMLHttpRequest2
 */
ajax2 = function (opts) {
    var XHR = new XMLHttpRequest();
    XHR.open(opts.type || 'GET'
 
, opts.url, true);
    XHR.responseType = opts.dataType || 'arraybuffer';
    XHR.onload = function(e) {
        opts.success && opts.success(this.response);
    };
    XHR.onerror = function (err) {
        opts.error && opts.error(err);
    }
    XHR.send();
};


/**
 * 解壓zlib資料
 * @param
 
 url 資料包url地址
 * @param callback 資料包獲取完成回撥函式
 */
getZlibBasicData = function (url, callback) {
    // 成功處理
    function successHandler(data) {
        data = new Uint8Array(data);
        console.log(data);
        try {
            var result = JSON.parse(pako.inflate(data, { to: 'string' }));
            callback && callback({
                code: 0
 
,
                msg: 'Success',
                data: result
            });
        } catch (e) {
            callback && callback({
                code: 2,
                msg: e,
                data: data,
                url: url
            });
        }
    };
    // 錯誤處理
    function errorHandle(err) {
        callback && callback({
            code: 1,
            msg: 'ERROR: getZlibXmqData() Ajax2 ...',
            data: err
        });
    };
    // 請求資料
    ajax2({
        url: url,
        // dataType: 'arraybuffer',
        // type: 'GET',
        success: successHandler,
        error: errorHandle
    });
};

# 使用

// 資料包地址
var url = 'http://config-1253933147.file.myqcloud.com/app/xmq_data20170927344.zip';
// 獲取資料包json內容
getZlibBasicData(url, function (res) {
    console.log(res);
});

pako 的使用我未深究，需要的同學可以去git閱讀詳情。