Angular에서 중단 된 업로드를 처리하는 방법은 무엇입니까?

Question

POST 요청을 통해 백엔드에 파일을 업로드 할 수 있으며 파일이 너무 클 경우 Http 400 상태 코드를 반환합니다. 우편 배달부를 사용할 때 완벽하게 작동합니다. 나는 브라우저 (크롬)이 호출을 수행 할 때

, 나는이 오류 얻을 : 결과로

zone.js:2933 POST http://localhost:8080/backend/rest/upload/ net::ERR_CONNECTION_ABORTED

을 내 HttpErrorResponse 0의 상태 코드가 있습니다

HttpErrorResponse {headers: HttpHeaders, status: 0, statusText: "Unknown Error", url: null, ok: false, …}

을

This 대답은 문제, 를 설명합니다. 그러나이 문제를 어떻게 각도로 처리합니까? 내 HTTP 400 응답에 포함 된 반환 된 오류 메시지를 믿고 있었다 ...

Answer 1

API와 관련된 문제가 Angular 자체보다 ... API가이를 처리하고 적절한 400 오류를 반환해야한다고 생각합니다. .

해결 방법으로 UI를 개선하려면 파일 에서 각도 확인을 수행 한 후을 백엔드에 게시하십시오. 너무 큰 경우 게시물을 차단하고 사용자에게 알립니다.

이 같은 파일의 크기 속성에 액세스 할 수 있습니다 :이 각도 문제가되지 않습니다 노호

@Component({ 
    selector: 'my-app', 
    template: ` 
    <div> 
     <input type="file" (change)="onChange($event)"/> 
    </div> 
    `, 
    providers: [ UploadService ] 
}) 
export class AppComponent { 
    onChange(event) { 
    var files = event.srcElement.files; 
    console.log(files[0].size); 
    } 
}