JavaScript로 데이터 URL을 다운로드하는 방법: Chrome 및 Firefox 솔루션?

JavaScript에서 데이터 URL 다운로드

JavaScript 기반 zip/unzip 유틸리티를 만들려고 할 때 다음 문제가 발생했습니다. 데이터 URL로 인코딩된 파일을 다운로드합니다. 이 접근 방식은 Firefox에서는 작동하지만 Chrome에서는 작동하지 않습니다.

Chrome의 딜레마

Chrome은 데이터 URL 직접 다운로드를 지원하지 않습니다. 대신 img 태그를 사용하여 참조할 때 이미지로 포함합니다. 이는 이미지가 아닌 파일 형식에 문제가 됩니다.

해결 방법

다행히 Chrome과 Firefox 모두에서 데이터 URL 다운로드를 활성화하는 해결 방법이 있습니다. 해결 방법에는 임시 요소를 생성하고 다운로드 속성을 원하는 파일 이름으로 설정하고 데이터 URL을 href 속성에 할당하는 작업이 포함됩니다.

코드 예

다음 JavaScript 함수인 downloadURI가 이를 구현합니다. 해결 방법:

function downloadURI(uri, name) {
  var link = document.createElement("a");
  link.download = name;
  link.href = uri;
  document.body.appendChild(link);
  link.click();
  document.body.removeChild(link);
  delete link;
}

사용

이 기능을 사용하려면 데이터 URL과 원하는 다운로드 파일 이름을 인수로 제공하세요.

downloadURI("data:text/html,HelloWorld!", "helloWorld.txt");

이 접근 방식을 사용하면 Chrome과 Firefox 모두에서 다운로드 대화 상자가 표시되어 사용자가 지정된 파일 이름으로 파일을 저장할 수 있습니다.

위 내용은 JavaScript로 데이터 URL을 다운로드하는 방법: Chrome 및 Firefox 솔루션?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!