>웹 프론트엔드 >JS 튜토리얼 >HTML5 및 JavaScript를 사용하여 브라우저에 직접 파일을 저장하려면 어떻게 해야 합니까?

HTML5 및 JavaScript를 사용하여 브라우저에 직접 파일을 저장하려면 어떻게 해야 합니까?

Mary-Kate Olsen
Mary-Kate Olsen원래의
2024-12-13 02:00:14496검색

How Can I Save Files Directly in the Browser Using HTML5 and JavaScript?

HTML5/JavaScript로 파일 저장

웹 개발 기능을 향상시키기 위해 HTML5와 JavaScript는 다음을 포함한 다양한 작업에 강력한 기능을 제공합니다. 파일 저장. 기존 접근 방식에는 서버 상호 작용이 포함되지만 이러한 기술을 사용하면 브라우저에서 직접 파일을 생성하고 다운로드할 수 있습니다.

JavaScript 솔루션

효율적인 JavaScript 솔루션 중 하나는 다음을 사용하여 다운로드 가능한 링크 함수:

function download(filename, text) {
  var pom = document.createElement('a');
  pom.setAttribute('href', 'data:text/plain;charset=utf-8,' + encodeURIComponent(text));
  pom.setAttribute('download', filename);

  if (document.createEvent) {
    var event = document.createEvent('MouseEvents');
    event.initEvent('click', true, true);
    pom.dispatchEvent(event);
  } else {
    pom.click();
  }
}

사용법

파일을 다운로드하려면 원하는 파일 이름과 내용을 인수로 사용하여 download() 함수를 호출하면 됩니다.

download('test.txt', 'Hello world!');

이 접근 방식을 사용하면 파일을 메모리에 저장할 수 있으므로 서버 요청이나 파일 시스템 액세스가 필요하지 않으며 원활하고 안전한 다운로드 환경을 제공할 수 있습니다. 사용자입니다.

위 내용은 HTML5 및 JavaScript를 사용하여 브라우저에 직접 파일을 저장하려면 어떻게 해야 합니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.