서버 상호 작용 없이 JavaScript를 사용하여 클라이언트측 파일을 다운로드하려면 어떻게 해야 합니까?

JavaScript를 사용하여 서버 상호작용 없이 파일을 다운로드하는 방법

사용자가 다운로드할 수 있는 파일을 생성할 때 일반적으로 보안 문제로 인해 컴퓨터에 직접 쓸 수 없습니다. 그러나 서버를 통하지 않고도 파일을 생성하고 사용자에게 이를 저장하라는 메시지를 표시하는 것은 가능합니다.

HTML5 솔루션

HTML5를 지원하는 브라우저의 경우 다음 코드를 사용할 수 있습니다.

function download(filename, text) {
  // Create an anchor element pointing to the file's content
  var element = document.createElement('a');
  element.setAttribute('href', 'data:text/plain;charset=utf-8,' + encodeURIComponent(text));
  element.setAttribute('download', filename);

  // Hide the anchor element
  element.style.display = 'none';

  // Append the element to the body to enable the download
  document.body.appendChild(element);

  // Simulate a click event to trigger the download
  element.click();

  // Remove the anchor element to prevent further interaction
  document.body.removeChild(element);
}

사용법

HTML 코드에서 이 기능을 다음과 같이 사용하세요.

<form onsubmit="download(this['name'].value, this['text'].value)">
  <input type="text" name="name" value="test.txt">
  <textarea name="text"></textarea>
  <input type="submit" value="Download">
</form>

사용자가 양식에 파일 이름과 파일 내용을 입력하고 "다운로드" 버튼을 클릭하면 서버와의 상호작용 없이 파일이 다운로드됩니다.

위 내용은 서버 상호 작용 없이 JavaScript를 사용하여 클라이언트측 파일을 다운로드하려면 어떻게 해야 합니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!