답변:
사용자가 파일을 통해 선택하면 <input type="file">, 당신은 수 읽기 와 과정 파일이 사용하여 해당 파일 API를 .
의도적으로 임의의 파일을 읽거나 쓰는 것은 허용되지 않습니다. 샌드 박스를 위반 한 것입니다. 에서 위키 백과 -> 자바 스크립트 -> 보안 :
JavaScript와 DOM은 악의적 인 작성자가 웹을 통해 클라이언트 컴퓨터에서 실행할 스크립트를 제공 할 수있는 가능성을 제공합니다. 브라우저 작성자는 두 가지 제한 사항을 사용하여이 위험을 포함합니다. 먼저 스크립트는 샌드 박스에서 실행되며 파일 작성 과 같은 범용 프로그래밍 작업이 아니라 웹 관련 작업 만 수행 할 수 있습니다 .
2016 UPDATE : 직접 파일 시스템을 액세스하는 것은 통해 가능하다 파일 시스템 API 되고, 단지 크롬과 오페라에서 지원 하고 다른 브라우저에 의해 구현되고 있지 끝낼 수 있습니다 합니다 (와 에지의 예외 ). 자세한 내용은 Kevin의 답변을 참조하십시오 .
HTML5 기능의 업데이트는 http://www.html5rocks.com/en/tutorials/file/dndfiles/에 있습니다. 이 훌륭한 기사는 JavaScript에서 로컬 파일 액세스에 대해 자세히 설명합니다. 언급 된 기사의 요약 :
이 사양은 'local'파일 시스템에서 파일 에 액세스하기 위한 몇 가지 인터페이스를 제공합니다 .
<input type="file" multiple>데스크탑에서 파일 디렉토리를 생각 하거나 드래그 하십시오 .아래의 Paul D. Waite의 의견을 참조하십시오.
업데이트이 기능은 Firefox 17부터 제거되었습니다 ( https://bugzilla.mozilla.org/show_bug.cgi?id=546848 참조 ).
Firefox에서는 (프로그래머) JavaScript 파일 내에서이를 수행 할 수 있습니다.
netscape.security.PrivilegeManager.enablePrivilege("UniversalBrowserRead");
netscape.security.PrivilegeManager.enablePrivilege("UniversalBrowserWrite");
그리고 귀하 (브라우저 사용자)에게 액세스를 허용하라는 메시지가 표시됩니다. (Firefox의 경우 브라우저를 시작할 때마다이 작업을 수행하면됩니다.)
브라우저 사용자가 다른 사람인 경우 권한을 부여해야합니다.
앞에서 언급 한 것처럼 FileWriter API 와 함께 FileSystem 및 File API를 사용하여 브라우저 탭 / 창의 컨텍스트에서 클라이언트 시스템으로 파일을 읽고 쓸 수 있습니다.
FileSystem 및 FileWriter API와 관련하여 몇 가지 알아야 할 사항이 있지만 그중 일부는 언급되었지만 반복 할 가치가 있습니다.
다음은 이러한 작업을 수행하기 위해 API가 직간접 적으로 사용되는 방법에 대한 간단한 예입니다.
구운 상품 *
파일 쓰기 :
bakedGoods.set({
data: [{key: "testFile", value: "Hello world!", dataFormat: "text/plain"}],
storageTypes: ["fileSystem"],
options: {fileSystem:{storageType: Window.PERSISTENT}},
complete: function(byStorageTypeStoredItemRangeDataObj, byStorageTypeErrorObj){}
});
파일 읽기 :
bakedGoods.get({
data: ["testFile"],
storageTypes: ["fileSystem"],
options: {fileSystem:{storageType: Window.PERSISTENT}},
complete: function(resultDataObj, byStorageTypeErrorObj){}
});
원시 파일, FileWriter 및 FileSystem API 사용
파일 쓰기 :
function onQuotaRequestSuccess(grantedQuota)
{
function saveFile(directoryEntry)
{
function createFileWriter(fileEntry)
{
function write(fileWriter)
{
var dataBlob = new Blob(["Hello world!"], {type: "text/plain"});
fileWriter.write(dataBlob);
}
fileEntry.createWriter(write);
}
directoryEntry.getFile(
"testFile",
{create: true, exclusive: true},
createFileWriter
);
}
requestFileSystem(Window.PERSISTENT, grantedQuota, saveFile);
}
var desiredQuota = 1024 * 1024 * 1024;
var quotaManagementObj = navigator.webkitPersistentStorage;
quotaManagementObj.requestQuota(desiredQuota, onQuotaRequestSuccess);
파일 읽기 :
function onQuotaRequestSuccess(grantedQuota)
{
function getfile(directoryEntry)
{
function readFile(fileEntry)
{
function read(file)
{
var fileReader = new FileReader();
fileReader.onload = function(){var fileData = fileReader.result};
fileReader.readAsText(file);
}
fileEntry.file(read);
}
directoryEntry.getFile(
"testFile",
{create: false},
readFile
);
}
requestFileSystem(Window.PERSISTENT, grantedQuota, getFile);
}
var desiredQuota = 1024 * 1024 * 1024;
var quotaManagementObj = navigator.webkitPersistentStorage;
quotaManagementObj.requestQuota(desiredQuota, onQuotaRequestSuccess);
FileSystem 및 FileWriter API는 더 이상 표준 트랙에 있지 않지만 다음과 같은 이유로 일부 경우에 사용이 정당화 될 수 있습니다.
그러나 "일부 사례"가 자신의 사례를 포함하는지 여부는 귀하가 결정하는 것입니다.
* BakedGoods는이 사람 이외의 다른 사람에 의해 유지됩니다 :)
NW.js를 사용하면 일반적으로 브라우저에 적용되는 모든 보안 제한없이 Javascript를 사용하여 데스크탑 응용 프로그램을 만들 수 있습니다. 따라서 함수로 실행 파일을 실행하거나 파일을 작성 / 편집 / 읽기 / 쓰기 / 삭제할 수 있습니다. 현재 CPU 사용량 또는 사용중인 총 램 등과 같은 하드웨어에 액세스 할 수 있습니다.
설치가 필요없는 Windows, Linux 또는 Mac 데스크탑 응용 프로그램을 만들 수 있습니다.
다음은 Universal GUI 인 NW.js의 프레임 워크입니다.
Windows에 배포하는 경우 Windows 스크립트 호스트 는 파일 시스템 및 기타 로컬 리소스에 매우 유용한 JScript API를 제공합니다. 그러나 WSH 스크립트를 로컬 웹 응용 프로그램에 통합하는 것은 원하는만큼 우아하지 않을 수 있습니다.
FSO.js 는 W3C에서 표준화하고있는 새로운 HTML5 FileSystem API를 감싸고 로컬 샌드 박스 파일 시스템에서 읽고 쓰거나 통과 하는 매우 쉬운 방법을 제공합니다 . 비동기식이므로 파일 I / O가 사용자 경험을 방해하지 않습니다. :)
클라이언트의 전체 파일 시스템에 액세스하거나, 파일을 읽고 / 쓰거나, 폴더의 변경 사항을 감시하고, 응용 프로그램을 시작하고, 문서를 암호화 또는 서명하는 등 JSFS를 살펴보십시오.
AcitveX 또는 Java Applet과 같은 브라우저 플러그인 기술을 사용하지 않고도 웹 페이지에서 클라이언트의 컴퓨터 리소스로 안전하고 무제한으로 액세스 할 수 있습니다. 그러나 소프트웨어의 평화도 설치해야합니다.
JSFS를 사용하려면 Java 및 Java EE 개발 (서블릿)에 대한 기본 지식이 있어야합니다.
https://github.com/jsfsproject/jsfs에서 JSFS를 찾으십시오 . 무료이며 GPL에 따라 라이센스가 부여됩니다
JavaScript 코드가 필요할 수있는 파일을 사용자가 직접 허용해야한다고 가정합니다. 유명한 브라우저 제작자는 JavaScript가 파일에 액세스 할 수 없습니다.
솔루션의 주요 아이디어는 다음과 같습니다. JavaScript 코드는 로컬 URL을 사용하여 파일에 액세스 할 수 없습니다. 그러나 DataURL을 사용하여 파일을 사용할 수 있습니다. 따라서 사용자가 파일을 찾아서 열면 JavaScript는 "URL"대신 HTML에서 "DataURL"을 직접 가져와야합니다.
그런 다음 readAsDataURL 함수와 FileReader 객체를 사용하여 DataURL을 파일로 변환합니다. 좋은 예를 가진 소스와 더 완벽한 가이드는 다음과 같습니다.
클라이언트 컴퓨터에서 전체 파일 시스템을 읽고 쓰는 데 사용할 수있는 "localFS"(상업용) 제품이 있습니다.
작은 Windows 앱이 설치되어 있고 페이지에 작은 .js 파일이 포함되어 있어야합니다.
보안 기능으로서 파일 시스템 액세스는 하나의 폴더로 제한되고 비밀 키로 보호 될 수 있습니다.