Как читать и записывать в файл с помощью JavaScript?

Нет. JavaScript на стороне браузера не имеет разрешения на запись на клиентский компьютер без необходимости отключения множества параметров безопасности.

Будущее здесь! Предложения близки к завершению, никаких больше ActiveX, flash или java. Теперь мы можем использовать:

• API файловой системы

• Встроенный доступ к файлам методом перетаскивания

Вы можете использовать перетаскивание, чтобы получить файл в браузере, или простое управление загрузкой. После того, как пользователь выбрал файл, вы можете прочитать его с помощью Javascript: http://www.html5rocks.com/en/tutorials/file/dndfiles/

вот предложение мозиллы

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

это реализовано с помощью переключателя компиляции в spidermonkey, а также в расширенном скрипте Adobe. Кроме того (я думаю), вы получаете объект File в расширениях firefox.

rhino имеет (довольно примитивную) функцию readFile https://developer.mozilla.org/en/Rhino_Shell

для более сложных операций с файлами в rhino можно использовать методы java.io.File.

вы не получите ничего из этого в браузере. Для аналогичной функциональности в браузере вы можете использовать функции базы данных SQL из HTML5, постоянство на стороне клиента, файлы cookie и объекты флэш-памяти.

Эта функция Javascript представляет полное диалоговое окно "Сохранить как" для пользователя, который запускает его через браузер. Пользователь нажимает OK, и файл сохраняется.

Изменить: следующий код работает только с браузером 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");

Если вы используете JScript (Microsoft Javascript) для создания локальных сценариев с использованием WSH (НЕ в браузере!), вы можете использовать Scripting.FileSystemObject для доступа к файловой системе.

Я думаю, что вы можете получить доступ к тому же объекту в IE, если отключите множество настроек безопасности, но это было бы очень, очень плохой идеей.

MSDN здесь

В настоящее время файлы можно записывать и читать из контекста вкладки/окна браузера с помощью Файла. , FileWriter и FileSystem API, хотя есть оговорки по их использованию (см. конец этого ответа ).

Но чтобы ответить на ваш вопрос:

Использование BakedGoods*

Записать файл:

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 File, 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.
• Может быть удален из реализующих браузеров в будущем.
• Ограничить создание файлов песочницей (местом, за пределами которого файлы не могут иметь никакого эффекта) на диске.

Кроме того, спецификация файловой системы не определяет никаких указаний относительно того, как структуры каталогов должны отображаться на диске. Например, в браузерах на основе Chromium песочница имеет виртуальную файловую систему (структуру каталогов, которая не обязательно существует на диске в той же форме, что и при доступе из браузера), внутри которой размещаются каталоги и файлы, созданные с помощью API.

Таким образом, хотя вы можете записывать файлы в систему с помощью API, поиск файлов без API (ну, без API FileSystem) может быть нетривиальной задачей.

Если вы можете справиться с этими проблемами/ограничениями, эти API-интерфейсы — практически единственный собственный способ сделать то, что вы просили.

Если вы открыты для неродных решений, 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, которая устанавливает единый интерфейс, который можно использовать для выполнения общих операций хранения во всех собственных и некоторых нестандартных хранилищах. Его поддерживает вот этот парень :) .

Для Фаерфокса:

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

Другие пользователи могут проверить приложение TiddlyWiki, чтобы узнать, как оно это делает.

В контексте браузера Javascript может ПРОЧИТАТЬ указанный пользователем файл. Подробнее о чтении файла с помощью File API см. в блоге Эрика Бидельмана. Однако Javascript на основе браузера не может ЗАПИСАТЬ файловую систему локального компьютера без отключения некоторых параметров безопасности, поскольку произвольное изменение вашей локальной файловой системы считается угрозой безопасности для любого веб-сайта.

Сказав это, есть несколько способов обойти это в зависимости от того, что вы пытаетесь сделать:

1. Если это ваш собственный сайт, вы можете встроить Java-апплет на веб-страницу. Однако посетитель должен установить Java на локальный компьютер и будет предупрежден об угрозе безопасности. Посетитель должен разрешить загрузку апплета. Java-апплет похож на исполняемое программное обеспечение, которое имеет полный доступ к локальному компьютеру.

2. Chrome поддерживает файловую систему, которая представляет собой изолированную часть локальной файловой системы. Подробнее см. на этой странице. Это позволяет вам временно сохранять данные локально. Однако это не поддерживается другими браузерами.

3. Если вы не ограничены браузером, Node.js имеет полный интерфейс файловой системы. См. здесь его документацию по файловой системе. Обратите внимание, что Node.js может работать не только на серверах, но и на любом клиентском компьютере, включая Windows. Средство запуска тестов javascript Karma основано на Node.js. Если вам просто нравится программировать на javascript на локальном компьютере, это вариант.

Чтобы создать файл, попробуйте

function makefile(){
  var fso;
  var thefile;

    fso = new ActiveXObject("Scripting.FileSystemObject");
    thefile=fso.CreateTextFile("C:\\tmp\\MyFile.txt",true);

    thefile.close()
    }

Создайте свой каталог на диске C, потому что Windows имеет защиту от записи из Интернета, например, создайте папку с именем «tmp» на диске C.

Вам придется обратиться к Flash, Java или Silverlight. В случае с Silverlight вы увидите Isolated Хранение. Это позволит вам писать в файлы на вашей собственной игровой площадке на диске пользователя. Однако он не позволит вам писать за пределами вашей игровой площадки.

Вы не можете сделать это каким-либо кросс-браузерным способом. В IE есть методы, позволяющие «доверенным» приложениям использовать объекты ActiveX для чтения/записи файлов, но, к сожалению, это все.

Если вы хотите сохранить информацию о пользователе, вам, скорее всего, потребуется использовать файлы cookie.

Из теста ReactJS следующий код успешно записывает файл:

import writeJsonFile from 'write-json-file';

const ans = 42;
writeJsonFile('answer.txt', ans);

const json = {"answer": ans};
writeJsonFile('answer_json.txt', json);

Файл записывается в каталог, содержащий тесты, поэтому запись в реальный файл JSON «*.json» создает цикл!

Написание этого ответа для людей, которые хотят получить файл для загрузки с определенным содержимым из javascript. Я боролся с тем же самым.

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

Вы не можете выполнять файловый ввод-вывод на стороне клиента с помощью javascript, так как это может быть угрозой безопасности. Вам нужно либо заставить их загрузить и запустить исполняемый файл, либо, если файл находится на вашем сервере, использовать AJAX и язык на стороне сервера, такой как PHP, для выполнения ввода-вывода на стороне сервера.

Существует два способа чтения и записи файла с помощью JavaScript.

1. Использование расширений JavaScript

2. Использование веб-страницы и объектов Active X

Вот решение для записи для chrome v52+ (пользователю все еще нужно выбрать целевую доу...)
источник: 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-объектов/файлов