Laravel HTTP facade在响应标头中不返回内容长度

Question

我有一个控制器，它从Gmail API、调用多个GET请求

基本上，我正在尝试获得most recent 50 SENT MESSAGES。

我所做的是汇集这些请求，循环Pool响应，并将检索到的数据插入到我的数据库中。

$resp = Http::pool(function (Pool $pool) use ($messages_ids, $user, $label) {
$messages_ids->map(function ($value, $key) use ($user, $pool, $label) {
$pool->as('sent-'.$key)->withToken($user->token)->get($this->BASE_URL . $user->email . '/messages/' . $value['id'] . $this->QUERY_CONFIG);
return $pool;
});
});
collect($resp)->map(function ($req) use($label, $next_page_token, $user_model) {
Email::firstOrCreate(...)
});
return response()->json(['msg' => 'retrieved and saved']);

现在，在我的vue组件中，我想显示一个进度条。所以我用了

const config = {
onUploadProgress: progressEvent => {
console.log(progressEvent);
// console.log(`progress: ${Math.floor((progressEvent.loaded * 100))}`)
}
}
const param = new FormData();
param.append('user', this.auth_user);
param.append('user_model', this.user_model);
param.append('date_filter', this.afterDateFilter);
param.append('label', 'sent');
let req = axios.post(url, param, config, headers);
req.then(res => {
return res;
}).catch(err => {
return Promise.reject(err)
})

现在，进度跳转到100%。我注意到我不应该使用onUploadProgress，因为它将获得请求主体参数的content-length。

所以，我用了onDownloadProgress。。。然而，onDownloadProgress不返回progressEvent.total，可能是因为content-length不存在于请求的response header中。

这是响应标头：

cache-control: no-cache, private
content-encoding: gzip
content-type: text/html; charset=UTF-8
date: Mon, 07 Mar 2022 06:07:54 GMT
server: nginx/1.10.3 (Ubuntu)
set-cookie: XSRF-TOKEN=eyJp...; expires=Mon, 07-Mar-2022 08:07:54 GMT; Max-Age=7200; path=/; samesite=lax
set-cookie: laravel_session=eyJp...; expires=Mon, 07-Mar-2022 08:07:54 GMT; Max-Age=7200; path=/; httponly; samesite=lax
vary: Accept-Encoding
via: 1.1 somehash.cloudfront.net (CloudFront)
x-amz-cf-id: somehash-Q==
x-amz-cf-pop: MNL50-C1
x-cache: Miss from cloudfront

有人能指出我在使用HTTP facade和axios时是如何做进度条的吗？

Answer 1

问题出在gzipped响应中。您应该在响应中包含一个Content-Length标头。此外，Node不允许'Transfer-Encoding'和Content-Length标头同时出现在响应中。

此问题在此处解决：https://github.com/axios/axios/issues/1591#issuecomment-431400903

在这里：https://github.com/axios/axios/issues/2709