로컬 files_javascript 기술을 직접 작동하기 위한 JavaScript 구현 코드

최근 Mozilla는 JavaScript 스크립트가 로컬 파일을 직접 작동할 수 있도록 하는 JavaScript API 출시를 목표로 W3C에 초안을 제출했습니다. 그러나 최신 브라우저 버전의 Firefox에서는 이미 이 API에 대한 많은 지원을 제공하고 있습니다. API 로컬 파일에 대한 제한된 액세스만 제공됩니다.
이 API는 로컬 파일 시스템에서 파일을 비동기적으로 로드할 수 있는 FileReader 개체를 도입하고 개발자가 로드 실패, 진행률, 로드 완료 등과 같은 이벤트에 대한 콜백 함수를 할당할 수 있도록 합니다. 로컬 파일에서 읽을 수 있는 메서드를 제공합니다. 텍스트 가져오기 또는 바이너리 데이터를 저장하고 중단 메소드를 통해 언제든지 작업을 중단합니다.
FileReader 개체는 특별한 권한이 필요하지 않지만, 명백한 보안상의 이유로 파일 경로를 사용한 직접 액세스는 허용되지 않습니다. 사용자가 탐색을 위해 클릭한 후 선택해야 합니다. 로컬 파일을 가져오려면 JavaScript가 DOM을 통해 파일을 참조하고 이를 작동시킵니다. 로컬 파일을 얻으려면 사용자가 수동으로 참여해야 하기 때문에 이 메커니즘은 API를 비교적 안전하게 만듭니다.

다음 예제에서는 이 API를 사용하여 로컬 파일을 열고 div 컨테이너에 파일 내용을 표시합니다. 사용자가 파일 내용을 직접 편집할 수 있도록 div에 contentEditable 속성을 추가할 수도 있습니다. 하지만 이 API는 파일 내용을 로컬 파일에 다시 쓸 수 있는 방법을 제공하지 않으므로 편집한 내용을 저장할 수 없습니다.


JavaScript에 API를 추가하는 것은 큰 기술 혁명은 아니지만 웹 애플리케이션의 지평을 확장하고 웹 플랫폼이 점점 더 많은 기능을 구현할 수 있게 해줄 것입니다.