CODEWITHSUNDEEP
javascriptjqueryajaxgoogle-chrome
FatUglyProud
FatUglyProud

Reputation: 137

JavaScript/Ajax Write to File

I understand this question is asked a lot but the distinction here is I HAVE WEB SECURITY DISABLED. I am creating a webapp that will never be hosted anywhere, to access the user runs chrome --disable-web-security --user-data-dir [webappdirectoryhere] I understand how unorthodox this is but it's just for a small project.

I am using this ajax to access a local file (this wouldn't work in chrome unless you have a server running or you just disable web security like I have):

function loadDoc(){
    $.ajax({url: "ajax_info.txt", success: function(result){
        var variablesArray = result.split(" ");
}});
}

So my question is this - can I do something like this but for writing instead of reading?

EDIT: So what I really want is a function that does the inverse of that ajax. And to write something like (variable1 + " " + variable2) Note: I want to overwrite, not append.

Upvotes: 1

Views: 2302

Answers (1)

Patrick Evans
Patrick Evans

Reputation: 42736

Since you said you do not plan to host it anywhere you could just move your code into a Packaged app. From there you can use the chrome.fileSystem api.

Use chooseEntry() to ask the user which directory they want the app to be able to read/write to. In the callback check that the returned entry is valid, and then store it for later use.

var userDir = null;
chrome.fileSystem.chooseEntry({type: 'openDirectory'}, function(theEntry) {
   //do sanity check(s) and store it
   if(!theEntry.isDirectory) {
      //report error
      return;
   }
   userDir = theEntry;
});

Once you have a directory entry reference than you can use getFile() to get a reference to a file, creating it if it doesn't already exist, same goes for creating subdirectories just substitute getFile with getDirectory. Then use createWriter() get a FileWriter instance to write to that file.

function saveData(filename,data){
   if(!userDir) {
      //report error
      return;
   }

   userDir.getFile(filename, {create: true}, function(fileEntry) {
      if(!fileEntry || !fileEntry.isFile){
         //report error
         return;
      }

      fileEntry.createWriter(function(fileWriter) {
         fileWriter.onwriteend = function(e) {
            //report success
         };
         fileWriter.onerror = function(e) {
            //report error: e.toString()
         };

         //Create a Blob from the data and write it.
         var blob = new Blob([data], {type: 'text/plain'});
         fileWriter.write(blob);
      });
   });
}

//at some point after user has selected directory
saveData("log.txt","Some data");

Check the various documentations for error reporting and other necessities.

If you want to only ask the user once for the directory use retainEntry() to save an id of the directory entry. And use restoreEntry() to get the reference back of the directory. From there its just a matter of doing the steps in the saveData function. Check the documentation for other processes like reading the file.

Upvotes: 2

Related Questions