При загрузке файлов с помощью моего приложения Angular 7 с помощью angular-file данные формы не всегда отправляются с помощью Chrome (macOS).У меня нет проблем с Firefox или Safari.Обновление Chrome (F5) помогает, по крайней мере, в последний раз, когда это произошло.
Я обновил angular-файл до его последней версии, но это не помогло.Я думаю, что это не проблема угловых файлов, потому что я использую HttpRequest от Angular common для выполнения загрузки.
Код Angular выглядит следующим образом:
uploadFile(file: File, type: string): Subscription {
const fileFormData: FormData = new FormData();
fileFormData.append("file", file, file.name);
const req = new HttpRequest<FormData>('PUT', '/api/v2/images/' + type, fileFormData, {
reportProgress: true
});
return this.httpEmitter = this.http.request<any>(req)
.subscribe(
event => {
this.appUtil.logHttpEvent(event, file);
if (event instanceof HttpResponse) {
this.httpEmitter.unsubscribe();
this.setImageUrl(type);
}
}
);
}
logHttpEvent(event: any, file: File) {
switch (event.type) {
case HttpEventType.Sent:
console.log(`Uploading file "${file.name}" of size ${file.size}.`);
return;
case HttpEventType.UploadProgress:
const percentDone = Math.round(100 * event.loaded / event.total);
console.log(`File "${file.name}" is ${percentDone}% uploaded.`);
return;
case HttpEventType.ResponseHeader:
console.log(`File "${file.name}" upload got response header ${event.status}/${event.statusText}`);
return;
case HttpEventType.DownloadProgress:
console.log(`File "${file.name}" upload got download progress loaded ${event.loaded} bytes`);
return;
case HttpEventType.Response:
console.log(`File "${file.name}" was completely uploaded!`);
return;
default:
console.log(`File "${file.name}" surprising upload event: ${event.type}.`);
return;
}
}
Когда загрузка работает, она печатается на консоль:
main.23cb89c05a4329fb2f30.js:1 Uploading file "logo.png" of size 6631.
main.23cb89c05a4329fb2f30.js:1 File "logo.png" upload got response header 200/OK
main.23cb89c05a4329fb2f30.js:1 File "logo.png" upload got download progress loaded 1930 bytes
main.23cb89c05a4329fb2f30.js:1 File "logo.png" was completely uploaded!
Но при сбое он печатает:
main.23cb89c05a4329fb2f30.js:1 Uploading file "logo.png" of size 6631.
POST https://www.example.com/api/v2/images/logo 500
main.23cb89c05a4329fb2f30.js:1 File "logo.png" upload got response header 500/OK
main.23cb89c05a4329fb2f30.js:1 File "logo.png" upload got download progress loaded 205 bytes
Когда я проверяю вкладку «Сеть», после «Запроса заголовков» вообще отсутствует раздел «Данные формы» после «Запрос заголовков»,Все еще в заголовке запроса есть правильно настроенный тип контента: "Content-Type: multipart / form-data; border = ---- WebKitFormBoundary2SRIMu3Tb4HzNjJo"
Я использую работника сервиса Angular по умолчанию, поэтому мне интересно, может ли это вызвать этипроблемы?