본문 바로가기

develop/JavaScript

axios의 onUploadProgress (요청 응답 시간 확인) API 호출 후 응답까지 걸리는 시간이 길면 보통 ProgressBar로 진행정도를 표시해주고는 한다. API 호출 후 응답이 언제 올지 어떻게 알고 진행 정도를 표시해 줄 수 있을까? onUploadProgress 파일 업로드 중 진행 상태를 모니터링할 수 있는 콜백 함수파일 업로드 과정에서 특정 간격으로 실행된다. progressEvent 객체를 매개변수로 받아서 파일 업로드의 진행 상태를 알 수 있는 정보를 제공해준다.   progressEvent 객체loaded와 total을 확인할수 있다. loaded: 현재까지 업로드된 데이터 크기 (바이트 단위)total: 업로드 할 총 데이터 크기 (바이트 단위, 일부 서버 환경에서는 제공되지 않을 수 있다. ) //serviceApis.jsconst up.. 더보기
POST로 파일, 이미지, JSON 데이터 보내기 백엔드 코드특정 서비스에 사진파일 여러개( attaches ), PDF 파일 1개( report )와 정보( ServiceDTO.ReportUpload  )를 저장해야한다. API 호출시 참고할 백엔드 코드이다. POST 라는것과 어떤 타입으로 보내야할지 알 수 있다. @PostMapping("/services/{id}/upload")public ResponseEntity uploadReport(@PathVariable(value = "id") Long id, @RequestPart ServiceDTO.ReportUpload request, @RequestPart(value = "report") MultipartFile report, .. 더보기
[Javascript] 에러 핸들링 Exception과 ErrorException- 예상 불가능한 오류 상황- 파일을 정상적으로 읽어오지 못했거나, 네트워크 오류, 메모리 부족 등- 발생시 프로그램 실행이 중단된다.  Error- 예상 가능한 Error State(4XX, 5XX 에러)- 일반적으로 프로그램 실행중 발생 가능한 문제를 나타내는 객체- 다양한 Error객체가 존재한다. (TypeError, ReferenceError, SyntaxError 등)- 시스템 에러, 메모리 에러, 문법 에러 등  발생 가능한 예외에 대해 무작정 try-catch문이나 throw new Error()로 예외처리를 하기보다는예상 가능한 예외라면 Error State를 정의해서 예상 가능한 에러 상황으로 간주해서 상황에 맞춰 각기 다른 처리를 해주는것이.. 더보기