[英]Enabling gzip compression with fetch.js
我正在使用 fetch.js ( https://github.com/github/fetch ) 向后端发送一个相对较大的 json 对象。 json 很大,因为它包含一个 SVG 图像字符串。
我不清楚 fetch.js 是否默认使用 gzip 压缩,或者我是否需要手动压缩和添加标头。 任何帮助将不胜感激。
return new Promise((resolve, reject) => {
fetch(api_base + "/api/save-photo", {
method: 'POST',
mode: 'cors',
headers: {
'Content-Type': 'application/json'
},
body: JSON.stringify(payload)
})
.then((response) => {
if (response.status === 404) {
throw new Error('404 (Not Found)');
} else {
return response.json().then((json) => {
console.log('save poster response: ', json);
return json;
});
}
});
});
使用https://github.com/nodeca/pako(zlib的更快端口)。
添加以下导入:
import { gzip } from 'pako';
然后,更改:
body: JSON.stringify(payload)
至:
body: await gzip(JSON.stringify(payload))
并添加标题:
'Content-Encoding': 'gzip',
或者,如果您不使用 await/async 语法,您的示例代码将变为:
return new Promise((resolve, reject) => {
gzip(JSON.stringify(payload)).then((gzippedBody) => {
fetch(api_base + "/api/save-photo", {
method: 'POST',
mode: 'cors',
headers: {
'Content-Encoding': 'gzip',
'Content-Type': 'application/json'
},
body: gzippedBody
})
.then((response) => {
if (response.status === 404) {
throw new Error('404 (Not Found)');
} else {
return response.json().then((json) => {
console.log('save poster response: ', json);
return json;
});
}
});
});
});
我假设你的行
body: JSON.stringify(payload)
该有效载荷未压缩。
我还希望能够压缩/压缩有效负载主体,并且我还需要一种异步方法来适应我的其余代码。 我正在努力寻找一种方法来使用 zlib 没有回调。
为了实现这一点,我做了以下......
在单独的帮助库中,我导入 zib...
import zlib from 'zlib'
我创建了以下功能....
async function asyncCompressBody(body) {
const compressedData = await compressBody(body);
console.log("Data Compressed");
return compressedData;
}
function compressBody(body) {
return new Promise( function( resolve, reject ) {
zlib.deflate(body, (err, buffer) => {
if(err){
console.log("Error Zipping");
reject(err);
}
console.log("Zipped");
resolve(buffer);
});
});
}
compressBody 函数是围绕 zlib.deflate 的一个承诺。 函数 asyncCompressBody 是一个异步函数,它允许调用函数等待。
在调用函数中,我将其用作...
let compressedBody = await asyncCompressBody(jsonContent);
let headers = new Headers();
headers.append("Content-Type","application/json");
headers.append("Content-Encoding","zlib");
const response = await fetch(url,
{method: 'POST',
headers:headers,
body:compressedBody});
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.