자바 스크립트 로 파일 다운로드
2020年2月5日
지금까지 서버에서 제공되고 HTTP를 통해 클라이언트로 전송되는 파일을 다운로드하는 방법을 살펴보았는데, 이는 거의 전통적인 흐름입니다. 또한 웹 API를 사용하여 브라우저에서 프로그래밍 방식으로 콘텐츠를 추출하거나 생성하는 방법도 보았습니다. 링크를 클릭 할 때 다운로드 파일 (대신 파일로 이동): 여기에 약속 플러그인 소스를 사용하여 간단한 사용 사례 데모입니다. 데모 페이지에는 `더 나은 UX` 예제도 많이 포함되어 있습니다. 좋은 시각적 개체 (jQuery UI 대화 상자, 하지만 필수)로 설정 하는 매우 쉽게, 모든 것도 테스트 너무 그것은 주의 하는 것이 중요 하다, 이 메서드는 항상 새 개체 URL을 호출 될 때마다, 동일한 Blob 개체와 함께 호출 하는 경우에. 다음 간단한 기능을 사용하면 서버에 연결하지 않고 브라우저에서 직접 파일 다운로드를 생성할 수 있습니다. 그것은 요소의 다운로드 속성을 사용 하 여 모든 HTML5 준비 브라우저에서 작동: 자바 스크립트 다운로드 파일을 만드는이 방법은 사용자가 텍스트 영역에 제공 된 콘텐츠를 검색할 수 있습니다. 파일은 표준 텍스트 편집기에서 열리는 간단한 .txt로 컴퓨터 장치에 도달합니다. URL.createObjectURL()을 사용하여 JavaScript에서 생성된 데이터를 다운로드하고 나중에 객체 URL(해지ObjectURL 포함)을 취소하려는 경우(권장되는 대로) 다운로드가 완료된 후 이를 수행해야 합니다. 이렇게 하려면 downloads.on변경 된 이벤트를 들어보십시오.
그런 다음 텍스트 변수의 내용을 텍스트 파일로 내보내려면이 JavaScript 코드를 사용할 수 있습니다 . HTML5 및 자바 스크립트 다운로드 방법으로, 이것은 더 이상 문제가되지 않습니다. 파이어 폭스 DevTools 디버거 내에서이 위대한 기술을 구현스네하 자인에 소리! 서버에 연결하지 않고 파일을 다운로드하는 또 다른 옵션이 있습니다. 이번에는 FileSaver.js라는 자바 스크립트 라이브러리를 사용하고 있습니다. 아래 예제에서는 saveAs() FileSaver 인터페이스를 구현하기 위한 구문을 제공합니다. HTML5를 지원하는 브라우저에서 이 방법을 사용할 수 있습니다. 나는 또한 당신의 상황에 도움이 될 수있는 jQuery 파일 다운로드 플러그인 (데모) (GitHub)를 만들었습니다. 그것은 iframe과 꽤 유사하게 작동하지만 내가 매우 편리 발견 한 몇 가지 멋진 기능을 가지고 있습니다 : 따라서 파일의 자동 다운로드는 최근 몇 년 동안 달성하기 어려웠지만 HTML5의 도입으로이 작업은 달성하기가 쉬워졌습니다.