วิธีการอ่านและเขียนไฟล์โดยใช้ JavaScript?

ใครสามารถให้ตัวอย่างโค้ดสำหรับการอ่านและเขียนไฟล์โดยใช้ JavaScript ได้บ้าง?

คำตอบ #1

เพื่อความสมบูรณ์ ผู้ตั้งกระทู้ไม่ได้ระบุว่าเขากำลังมองหาที่จะทำสิ่งนี้บนเบราว์เซอร์ (ถ้าเขากำลังทำ ตามที่ได้กล่าวไว้ โดยทั่วไปแล้วเป็นไปไม่ได้)

อย่างไรก็ตาม JavaScript โดยตัวมันเองอนุญาตสิ่งนี้; สามารถทำได้ด้วย JavaScript ฝั่งเซิร์ฟเวอร์

ดูเอกสารเกี่ยวกับคลาสไฟล์ของ Javascript นี้

แก้ไข: ลิงก์นั้นเป็นลิงก์ไปยังเอกสารของ Sun ที่ตอนนี้ถูก Oracle ย้ายไปแล้ว

เพื่อติดตามยุคสมัย นี่คือเอกสาร node.js สำหรับคลาส FileSystem: http://nodejs.org/docs/latest/api/fs.html

แก้ไข(2): ตอนนี้คุณสามารถอ่านไฟล์ฝั่งไคลเอนต์ด้วย HTML5 ได้แล้ว: http://www.html5rocks.com/en/tutorials/file/dndfiles/

คำตอบ #2

ไม่ใช่ JavaScript ฝั่งเบราว์เซอร์ไม่มีสิทธิ์ในการเขียนลงเครื่องลูกข่ายโดยไม่ต้องปิดการตั้งค่าด้านความปลอดภัยหลายอย่าง

คำตอบ #3

อนาคตมาถึงแล้ว! ข้อเสนอต่าง ๆ ใกล้ความสำเร็จมากขึ้น ไม่มี ActiveX หรือแฟลชหรือจาวาอีกต่อไป ตอนนี้เราสามารถใช้:

• API ของระบบแฟ้ม

• การเข้าถึงไฟล์แบบลากและวางพื้นเมือง

คุณสามารถใช้การลาก/วางเพื่อเอาไฟล์เข้ามาในเบราว์เซอร์ หรือใช้ตัวควบคุมการอัปโหลดแบบง่าย เมื่อผู้ใช้เลือกไฟล์แล้ว คุณสามารถอ่านไฟล์นั้นด้วย Javascript: http://www.html5rocks.com/en/tutorials/file/dndfiles/

คำตอบ #4

นี่คือข้อเสนอของมอซิลลา

http://www-archive.mozilla.org/js/js-file-object.html

นี่ถูกดำเนินการโดยใช้สวิตช์การคอมไพล์ใน spidermonkey และยังใน adobe's extendscript นอกจากนี้ (ผมคิดว่า) คุณจะได้วัตถุ File ในส่วนขยายของ firefox

rhino มีฟังก์ชัน readFile (ค่อนข้างพื้นฐาน) https://developer.mozilla.org/en/Rhino_Shell

สำหรับการดำเนินการไฟล์ที่ซับซ้อนมากขึ้นใน Rhino คุณสามารถใช้เมธอดของ java.io.File ได้

คุณจะไม่ได้รับสิ่งเหล่านี้ในเบราว์เซอร์ อย่างไรก็ตาม สำหรับฟังก์ชันที่คล้ายกันในเบราว์เซอร์ คุณสามารถใช้ฟังก์ชันฐานข้อมูล SQL จาก HTML5 การเก็บข้อมูลฝั่งลูกค้า คุกกี้ และวัตถุเก็บข้อมูลแฟลช

คำตอบ #5

ฟังก์ชัน Javascript นี้แสดงกล่องโต้ตอบ "บันทึกเป็น" แบบสมบูรณ์ให้กับผู้ใช้ที่เรียกใช้นี้ผ่านเบราว์เซอร์ ผู้ใช้กดตกลงและไฟล์จะถูกบันทึก

แก้ไข: โค้ดต่อไปนี้สามารถใช้งานได้เฉพาะกับเบราว์เซอร์ IE เนื่องจาก Firefox และ Chrome ถือว่าโค้ดนี้เป็นปัญหาด้านความปลอดภัยและได้บล็อกไม่ให้ทำงาน

// 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");

คำตอบ #6

ปัจจุบัน ไฟล์สามารถเขียนและอ่านจากบริบทของแท็บ/หน้าต่างเบราว์เซอร์ด้วย API ของ File, FileWriter และ FileSystem ได้ แม้ว่าจะมีข้อควรระวังในการใช้งานของพวกมัน (ดูส่วนท้ายของคำตอบนี้)

แต่เพื่อตอบคำถามของคุณ:

การใช้ขนมอบ*

เขียนไฟล์:

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){}
});

การใช้ API ของไฟล์ดิบ, FileWriter, และ FileSystem

เขียนไฟล์:

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:

• ปัจจุบันสามารถใช้งานได้เฉพาะในเบราว์เซอร์ที่ใช้ Chromium (Chrome & Opera)
• ได้ถูกนำออกจากเส้นทางมาตรฐานของ W3C และ ณ ตอนนี้เป็น API ที่เป็นกรรมสิทธิ์
• อาจถูกลบออกจากเบราว์เซอร์ที่ใช้งานในอนาคต
• จำกัดการสร้างไฟล์ให้อยู่ใน sandbox (ตำแหน่งที่อยู่นอกนั้นไฟล์จะไม่สามารถสร้างผลใด ๆ ได้) บนดิสก์

นอกจากนี้ สเปกของ FileSystem ไม่ได้กำหนดแนวทางใด ๆ เกี่ยวกับการปรากฏตัวของโครงสร้างไดเรกทอรีบนดิสก์ ตัวอย่างเช่น ในเบราว์เซอร์ที่ใช้ Chromium sandbox จะมี ระบบไฟล์เสมือน (โครงสร้างไดเรกทอรีที่อาจไม่ปรากฏอยู่บนดิสก์ในรูปแบบเดียวกับที่เห็นเมื่อต้องเข้าถึงจากภายในเบราว์เซอร์) ซึ่งภายในนั้น ไดเรกทอรีและไฟล์ที่สร้างขึ้นด้วย API จะถูกวางไว้

ดังนั้นแม้ว่าคุณอาจสามารถเขียนไฟล์ไปยังระบบด้วย API เหล่านี้ การหาตำแหน่งไฟล์โดยไม่มี API (เอ่อ โดยไม่ใช้ FileSystem API) อาจเป็นเรื่องที่ไม่ง่าย

ถ้าคุณสามารถจัดการกับปัญหา/ข้อจำกัดเหล่านี้ได้ APIs เหล่านี้ก็แทบจะเป็นวิธีดั้งเดิมเพียงวิธีเดียวในการทำสิ่งที่คุณขอ

หากคุณเปิดรับวิธีแก้ปัญหาแบบไม่ใช่เนทีฟ Silverlight ยังอนุญาตให้ทำการอ่าน/เขียนไฟล์จากแท็บ/หน้าต่างผ่าน IsolatedStorage อย่างไรก็ตาม จำเป็นต้องใช้โค้ดที่จัดการเพื่อใช้ฟังก์ชันนี้; วิธีแก้ปัญหาที่ต้องเขียนโค้ดเช่นนี้อยู่นอกเหนือขอบเขตของคำถามนี้

แน่นอน วิธีแก้ปัญหาที่ใช้โค้ดจัดการเสริม ทำให้เหลือเพียงแค่การเขียน Javascript นั้น อยู่ในขอบเขตของคำถามนี้ได้อย่างแน่นอน ;) :

//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 ที่สร้างอินเทอร์เฟซแบบเดียวกันซึ่งสามารถใช้ดำเนินการเก็บข้อมูลทั่วไปในทุกพื้นที่เก็บข้อมูลพื้นเมือง และบางพื้นที่เก็บข้อมูลที่ไม่ใช่พื้นเมือง มันได้รับการดูแลโดยผู้ชายคนนี้ที่นี่ : ) .

คำตอบ #7

หากคุณกำลังใช้ JScript (Javascript ของ Microsoft) เพื่อทำสคริปต์ในเครื่องโดยใช้ WSH (ไม่ใช่ในเบราว์เซอร์!) คุณสามารถใช้ Scripting.FileSystemObject เพื่อเข้าถึงระบบไฟล์ได้

ฉันคิดว่าคุณสามารถเข้าถึงวัตถุเดียวกันนั้นใน IE ได้ถ้าคุณปิดการตั้งค่าความปลอดภัยหลายอย่าง แต่สิ่งนั้นจะเป็นความคิดที่ไม่ดีมากๆ

MSDN ที่นี่