자바스크립트를 사용하여 파일을 읽고 쓰는 방법은 무엇입니까?
자바스크립트를 사용하여 파일을 읽고 쓸 수 있는 샘플 코드를 줄 수 있는 사람이 있습니까?
완전성을 위해 OP는 브라우저에서 이 작업을 수행할 것이라고 말하지 않습니다(만약 그가 언급한 것처럼 일반적으로 불가능하다면).
그러나 Javascript 자체는 이것을 허용합니다. 서버 측 Javascript로 수행할 수 있습니다.
이 항목 보기Javascript File 클래스에 대한 문서
편집: 이 링크는 Oracle에서 이동한 Sun 문서에 대한 링크입니다.
시대에 뒤떨어지지 않으려면 FileSystem 클래스에 대한 node.js 설명서를 참조하십시오. http://nodejs.org/docs/latest/api/fs.html
편집(2):이제 HTML5로 클라이언트 측 파일을 읽을 수 있습니다. http://www.html5rocks.com/en/tutorials/file/dndfiles/
아니요. 브라우저 측 Javascript에 많은 보안 옵션을 비활성화해야 하는 경우 클라이언트 시스템에 쓸 수 있는 권한이 없습니다.
미래는 여기에 있습니다!제안서는 더 이상 ActiveX, 플래시 또는 Java가 아닌 완성 단계에 가까워졌습니다.이제 다음을 사용할 수 있습니다.
드래그/드롭을 사용하여 파일을 브라우저로 가져오거나 간단한 업로드 컨트롤을 사용할 수 있습니다.사용자가 파일을 선택하면 Javascript로 읽을 수 있습니다. http://www.html5rocks.com/en/tutorials/file/dndfiles/
모질라 제안입니다.
http://www-archive.mozilla.org/js/js-file-object.html
이것은 컴파일 스위치를 사용하여 거미원숭이와 어도비의 확장 스크립트로 구현됩니다.또한 (내 생각에) 파이어폭스 확장자에서 File 객체를 참조하십시오.
Rhino에는 (약간 무례한) readFile 기능이 있습니다. https://developer.mozilla.org/en/Rhino_Shell
Rhino에서 보다 복잡한 파일 작업을 수행하려면 java.io 을 사용할 수 있습니다.파일 메서드.
하지만 브라우저에는 이런 것들이 전혀 없을 것입니다.브라우저의 유사한 기능을 위해 HTML5, 클라이언트 측 지속성, 쿠키 및 플래시 스토리지 개체의 SQL 데이터베이스 기능을 사용할 수 있습니다.
이 Javascript 함수는 브라우저를 통해 이를 실행하는 사용자에게 완전한 "다른 이름으로 저장" 대화 상자를 제공합니다.사용자가 확인을 누르면 파일이 저장됩니다.
편집: Firefox 및 Chrome에서 이 코드를 보안 문제로 간주하여 작동하지 못하도록 차단했기 때문에 다음 코드는 IE Browser에서만 작동합니다.
// content is the data you'll write to file<br/>
// filename is the filename<br/>
// what I did is use iFrame as a buffer, fill it up with text
function save_content_to_file(content, filename)
{
var dlg = false;
with(document){
ir=createElement('iframe');
ir.id='ifr';
ir.location='about.blank';
ir.style.display='none';
body.appendChild(ir);
with(getElementById('ifr').contentWindow.document){
open("text/plain", "replace");
charset = "utf-8";
write(content);
close();
document.charset = "utf-8";
dlg = execCommand('SaveAs', false, filename+'.txt');
}
body.removeChild(ir);
}
return dlg;
}
다음 함수를 호출합니다.
save_content_to_file("Hello", "C:\\test");
MSH를할때하면 MSH(Microsoft의 Javascript!)를 할 수 .Scripting.FileSystemObject파일 시스템에 액세스할 수 있습니다.
많은 보안 설정을 해제하면 IE에서 동일한 개체에 액세스할 수 있다고 생각합니다. 하지만 그것은 매우, 매우 나쁜 생각이 될 것입니다.
현재 파일은 File, FileWriter 및 FileSystem 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){}
});
원시 File, 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);
당신이 요구한 것만 맞습니까?그럴 수도, 아닐 수도.다음 두 API:
- 현재는 크롬 기반 브라우저(크롬 및 오페라)에서만 구현됩니다.
- W3C 표준 트랙에서 제외되었으며 현재는 독점 API입니다.
- 향후 구현 브라우저에서 제거될 수 있음
- 파일 생성을 Disk의 샌드박스(파일이 영향을 미치지 못하는 외부 위치)로 제한
또한 FileSystem 사양은 디렉토리 구조가 디스크에 나타나는 방법에 대한 지침을 정의하지 않습니다.예를 들어 Cromium 기반 브라우저에서 샌드박스는 가상 파일 시스템(브라우저 내에서 액세스할 때와 동일한 형태로 디스크에 존재할 필요가 없는 디렉토리 구조)을 가지고 있으며, 여기에 API로 생성된 디렉토리와 파일이 배치됩니다.
따라서 API를 사용하여 시스템에 파일을 쓸 수는 있지만 API를 사용하지 않고(FileSystem API를 사용하지 않고) 파일을 찾는 것은 쉬운 일이 아닙니다.
이러한 문제/제한 사항을 처리할 수 있다면 이러한 API가 요청한 작업을 수행할 수 있는 거의 유일한 기본 방법입니다.
네이티브가 아닌 솔루션을 사용할 수 있는 경우 Silverlight는 격리된 스토리지를 통해 탭/창 대결에서 파일 I/O를 허용합니다.그러나 이 기능을 사용하려면 관리 코드가 필요합니다. 이러한 코드를 작성해야 하는 솔루션은 이 질문의 범위를 벗어납니다.
물론, 보완적인 관리 코드를 사용하여 자바스크립트만 남겨둔 솔루션은 이 질문의 범위 내에 있습니다 ;):
//Write file to first of either FileSystem or IsolatedStorage
bakedGoods.set({
data: [{key: "testFile", value: "Hello world!", dataFormat: "text/plain"}],
storageTypes: ["fileSystem", "silverlight"],
options: {fileSystem:{storageType: Window.PERSISTENT}},
complete: function(byStorageTypeStoredItemRangeDataObj, byStorageTypeErrorObj){}
});
BakedGoods는 모든 네이티브 및 일부 비네이티브 스토리지 설비에서 공통 스토리지 작업을 수행하는 데 사용할 수 있는 균일한 인터페이스를 설정하는 Javascript 라이브러리입니다.바로 여기 이 사람이 유지합니다 : ).
Firefox의 경우:
var file = Components.classes["@mozilla.org/file/local;1"].
createInstance(Components.interfaces.nsILocalFile);
file.initWithPath("/home");
https://developer.mozilla.org/en-US/docs/Code_snippets/File_I_O 을 참조하십시오.
다른 사람들은 Tiddly를 확인하십시오.Wiki 앱을 통해 어떻게 작동하는지 확인할 수 있습니다.
브라우저의 경우 Javascript는 사용자가 지정한 파일을 읽을 수 있습니다.File API를 사용하여 파일을 읽는 방법에 대한 자세한 내용은 Eric Bidelman의 블로그를 참조하십시오.그러나 브라우저 기반 Javascript가 로컬 컴퓨터의 파일 시스템을 임의로 변경하는 것은 웹 사이트의 보안 위협으로 간주되기 때문에 일부 보안 설정을 해제하지 않고 로컬 컴퓨터의 파일 시스템을 쓰는 것은 불가능합니다.
따라서 무엇을 하려는 것인지에 따라 다음과 같은 방법으로 해결할 수 있습니다.
사용자의 사이트인 경우 웹 페이지에 Java 애플릿을 포함할 수 있습니다.그러나 방문자는 로컬 컴퓨터에 Java를 설치해야 하며 보안 위험에 대해 경고를 받게 됩니다.방문자는 애플릿이 로드되도록 허용해야 합니다.Java 애플릿은 로컬 컴퓨터에 대한 완전한 액세스 권한을 가진 실행 가능한 소프트웨어와 같습니다.
Chrome은 로컬 파일 시스템의 샌드박스 부분인 파일 시스템을 지원합니다.자세한 내용은 이 페이지를 참조하십시오.이렇게 하면 로컬로 일시적으로 저장할 수 있습니다.그러나 다른 브라우저에서는 지원되지 않습니다.
브라우저로 제한되지 않는 경우 Node.js에는 완전한 파일 시스템 인터페이스가 있습니다.파일 시스템 설명서는 여기를 참조하십시오.Node.js는 서버뿐만 아니라 윈도우즈를 포함한 모든 클라이언트 시스템에서도 실행될 수 있습니다.자바스크립트 테스트 실행자 카르마는 Node.js를 기반으로 합니다.만약 당신이 로컬 컴퓨터에서 자바스크립트로 프로그래밍하기를 원한다면, 이것은 옵션입니다.
파일 시도를 만드는 방법
function makefile(){
var fso;
var thefile;
fso = new ActiveXObject("Scripting.FileSystemObject");
thefile=fso.CreateTextFile("C:\\tmp\\MyFile.txt",true);
thefile.close()
}
C 드라이브에 "tmp"라는 이름의 폴더를 생성하는 것과 같이 web e-g에서 쓰는 것에 대한 보안이 있기 때문에 C 드라이브에 디렉터리를 생성합니다.
플래시, Java 또는 Silverlight로 전환해야 합니다.Silverlight의 경우 격리된 스토리지를 볼 수 있습니다.그러면 사용자 디스크의 자신의 놀이터에 있는 파일에 쓸 수 있습니다.하지만 운동장 밖에서는 글을 쓸 수 없습니다.
자바스크립트에서 특정 콘텐츠로 다운로드할 파일을 원하는 사람들을 위해 이 답변을 작성합니다.저도 같은 문제로 고민하고 있었습니다.
const data = {name: 'Ronn', age: 27}; //sample json
const a = document.createElement('a');
const blob = new Blob([JSON.stringify(data)]);
a.href = URL.createObjectURL(blob);
a.download = 'sample-profile'; //filename to download
a.click();
여기에서 Blob 설명서 확인 - Blob MDN
크로스 브라우저 방식으로는 이 작업을 수행할 수 없습니다.IE에는 "신뢰할 수 있는" 응용 프로그램이 ActiveX 개체를 사용하여 파일을 읽고 쓸 수 있도록 하는 방법이 있지만, 안타깝게도 그것뿐입니다.
사용자 정보를 저장하려는 경우 쿠키를 사용해야 할 가능성이 높습니다.
반응에서JS 테스트, 다음 코드가 성공적으로 파일을 씁니다.
import writeJsonFile from 'write-json-file';
const ans = 42;
writeJsonFile('answer.txt', ans);
const json = {"answer": ans};
writeJsonFile('answer_json.txt', json);
파일은 테스트가 포함된 디렉토리에 기록되므로 실제 JSON 파일 '*.json'에 기록하면 루프가 생성됩니다!
자바스크립트를 사용하여 클라이언트 측에서 파일 I/O를 수행할 수 없습니다. 이는 보안 위험이 되기 때문입니다.당신은 그들이 exe를 다운로드하고 실행하도록 해야 하거나, 파일이 당신의 서버에 있다면, AJAX와 PHP와 같은 서버 측 언어를 사용하여 서버 측에서 i/o를 수행하도록 해야 합니다.
JavaScript를 사용하여 파일을 읽고 쓰는 두 가지 방법이 있습니다.
JavaScript 확장 사용
웹 페이지 및 ActiveX 개체 사용
다음은 chrome v52+에 대한 쓰기 솔루션입니다(사용자가 여전히 대상 do를 선택해야 함...).
출처:StreamSaver.js
<!-- load StreamSaver.js before streams polyfill to detect support -->
<script src="StreamSaver.js"></script>
<script src="https://wzrd.in/standalone/web-streams-polyfill@latest"></script>
const writeStream = streamSaver.createWriteStream('filename.txt')
const encoder = new TextEncoder
let data = 'a'.repeat(1024)
let uint8array = encoder.encode(data + "\n\n")
writeStream.write(uint8array) // must be uInt8array
writeStream.close()
클라이언트 측에서 생성된 대용량 데이터를 작성하는 데 가장 적합합니다.
그렇지 않으면 FileSaver.js를 사용하여 Blob/Files를 저장하는 것이 좋습니다.
언급URL : https://stackoverflow.com/questions/585234/how-to-read-and-write-into-file-using-javascript
'programing' 카테고리의 다른 글
| 전화 번호가 표시된 상태에서 다이얼을 열려면 어떻게 해야 합니까? (0) | 2023.08.05 |
|---|---|
| Postgre를 마이그레이션하는 방법SQL 데이터베이스를 SQL Server 데이터베이스로 전환하시겠습니까? (0) | 2023.08.05 |
| CSS를 사용하여 어떻게 특정 번호의 아이를 얻을 수 있습니까? (0) | 2023.07.31 |
| -deloc가 아닌 -(void)viewDidUnload에서 개체를 언제 릴리스해야 합니까? (0) | 2023.07.31 |
| jQuery를 사용하여 리디렉션을 따르도록 Ajax 요청을 방지하는 방법 (0) | 2023.07.31 |