Angular에서 HTTP POST를 사용하여 스트리밍 파일을 다운로드하려면

1776 단어 angularhttppost
Angular/Vue HTTP POST 다운스트림 파일
HTTP POST 요청 스트림 파일을 excel로 변환
Angular 개발 프로젝트를 사용할 때 일반적으로 파일을 다운로드하는 기능 항목이 있습니다.일반적으로 백그라운드에서 다운로드 주소를 되돌려줍니다. 제목이나 윈도우를 사용하여 다운로드 주소의 새 창을 열면 브라우저는 흐르는 파일을 식별하여 파일을 다운로드합니다.그러나 때때로 http 비동기 요청을 할 때 백그라운드에서 되돌아오는 것은 다운로드 주소가 아니라 하나의 파일 흐름을 직접 되돌려줍니다. 이때 어떻게 http에서 요청한 파일 흐름을 파일 다운로드로 변환합니까?사실은Angular 프레임워크 저장소와 같은 상황이 아니다. 다른 PWA, 예를 들어 Vue,React, 심지어 Jquery는 httpxhr를 통해 요청을 해서 얻은 흐름 파일을 브라우저가 자동으로 식별하고 다운로드하지 않는다.물론 해결 방안이 있을 것이다.시나리오 사고방식:http 요청은blob의 반환 형식을 사용하여 파일 흐름을 얻은 후 데이터에 대해 Blob를 하고 브라우저에 제출하여 식별합니다다음은 코드 예시입니다. /** * excel 내보내기 */ exportExcel(){ const params = {}; // body 매개 변수 const queryParams = undefined; // urlquery 매개 변수 this.http.post(this.exportUrl, params, queryParams, { responseType: "blob", headers: new HttpHeaders().append("Content-Type", "application/json") }).subscribe(resp=>{ //resp: 파일 흐름 this.downloadFile(resp); }) } /** *blob 대상을 만들고 브라우저를 이용하여 URL을 열어 다운로드 * @param 데이터 파일 흐름 데이터 */ downloadFile(data) { // 다운로드 유형 xls const contentType = 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet'; // 다운로드 유형: csv const contentType2 = 'text/csv'; const blob = new Blob([data], { type: contentType }); const url = window.URL.createObjectURL(blob); // 다운로드할 새 창 열기 // window.open(url); // 동적으로 a태그를 만들어 다운로드 const a = document.createElement('a'); const fileName = this.datePipe.transform(new Date(), 'yyyyMMdd'); a.href = url; // a.download = fileName; a.download = fileName + '.xlsx'; a.click(); window.URL.revokeObjectURL(url); } 총결산Angular가 HTTP POST를 이용하여 스트리밍 파일을 다운로드하는 것에 관한 이 글은 여기에 소개되어 있습니다. 더 많은 관련 Angular가 HTTP POST로 스트리밍 파일을 다운로드하는 내용은 저희 이전의 글을 검색하거나 아래의 관련 글을 계속 훑어보시기 바랍니다. 앞으로 많은 응원 부탁드립니다!
[C] 백준 2178 미로 탐색
JAVA에서 자주 사용하는 시간 조작에 대한 상세한 설명[실용]

좋은 웹페이지 즐겨찾기

개발자 우수 사이트 수집

개발자가 알아야 할 필수 사이트 100선 추천 우리는 당신을 위해 100개의 자주 사용하는 개발자 학습 사이트를 정리했습니다
best100-homepage