Comments on: Saving files with Javascript?

Question: Saving files with Javascript?

gwint — Sun, 19 Mar 2006 08:31:07 -0800

Are there any tutorials out there that explains how to save/update files from a browser using only javascript as tiddlywiki does?

(I tried to figure it out from the tiddlywiki source code without luck...)

By: charmston

charmston — Sun, 19 Mar 2006 08:34:27 -0800

Google loves you.

By: scottreynen

scottreynen — Sun, 19 Mar 2006 08:58:20 -0800

charmston, are you sure tiddlywiki is using AJAX? I don't see any AJAX calls in a quick skim of the source.

By: charmston

charmston — Sun, 19 Mar 2006 09:00:20 -0800

I've never looked into the tiddlywiki source, but AJAX will do as he asked: "save/update files from a browser using only javascript"

By: cyrusdogstar

cyrusdogstar — Sun, 19 Mar 2006 09:32:35 -0800

Actually, to my knowledge, JS cannot manipulate client-side files/folders due to security constraints--I recall attempting to set up a script to cause the browser to access a local drive, and both Firefox and IE spat out security errors. I mean, think about what could happen if JS alone was capable of such things--you'd have websites that could erase your files!

Upon further examination, I appear to be correct--TiddlyWiki requires you to manually save it to your hard disk to get a local version, which you then may edit and save (and I'll note that the browsers still throw fits when this local version tries to save, although you may then opt to allow the action--which you cannot do for a remote script).

So if what you want is a JavaScript sitting on your Web server to manipulate files on the browser's machine, I think you're out of luck. I could be wrong, of course, but this is what I think I know :)

By: cyrusdogstar

cyrusdogstar — Sun, 19 Mar 2006 09:35:11 -0800

charmston: I think you might be confused, no offense intended if I'm wrong--AJAX is used to update server-side files via JS, not client-side files.

So I guess it all depends on what specifically you want, gwint--do you want JS that can save to your local machine, or to the Web server the JS is hosted on? If the former, see my first comment, and if the latter, then charmston is right and you want to be using AJAX (which is unfortunately not entirely JavaScript, but requires some server-side technology to pair with, although you can pick and choose various implementations in several languages).

By: cyrusdogstar

cyrusdogstar — Sun, 19 Mar 2006 09:35:59 -0800

Sorry for all the bolding and italics, I'm in a strongly emphasizing mood today, I guess =)

By: gwint

gwint — Sun, 19 Mar 2006 10:46:18 -0800

My understanding is that tiddlywiki allows both-- if the file is on a server, it updates the file on the server, if you have the file locally, it saves it locally, without ajax (i.e. without the use of XMLHttpRequest.) The "magic" of tiddlywiki is that all of the code to do this is within the file being changed-- and it's all javascript. (I think that's also how it gets around the security issues-- you can only manipulate the specific file you're triggering the code from?)

So anyway, it's clear that one can have a file updated/saved from a browser using only javascript because this is what tiddlywiki does. I'm just not sure how...

By: gwint

gwint — Sun, 19 Mar 2006 10:50:05 -0800

Also, cyrusdogstar, I'm not sure what "I'll note that the browsers still throw fits when this local version tries to save" means for you, but when I use tiddlywiki both locally or online, I can save (i.e. update the file) from within the browser and it just works-- I click the "done" button and the file is updated without a peep from the browser.

By: blag

blag — Sun, 19 Mar 2006 11:33:42 -0800

I get 2 or 3 security warnings when I use the "Save changes" function within a locally-installed TiddlyWiki (FF). However, there is a "Don't warn me about this again" checkbox - maybe you ticked this a while ago and forgot about it?

Also, are you sure about the saving on a server thing? I was under the impression that you needed a plugin for that.

By: evariste

evariste — Sun, 19 Mar 2006 11:55:24 -0800

To get TiddlyWiki working in Opera, you have to create a Java* security policy file that permits it to save locally. In IE, it uses some ActiveX method, and I'm not sure what it does in Firefox.

*not javascript, Java....

By: gwint

gwint — Sun, 19 Mar 2006 12:01:18 -0800

I'm using Firefox, and blag, I believe you're right-- I think the first time I used it I got an alert.

By: Rhomboid

Rhomboid — Sun, 19 Mar 2006 13:31:23 -0800

TiddlyWiki can in fact save to local files. It will only do this when it's saved already as a local file and loaded in the browser as a "file://" URL. AJAX is a complete red herring here, and has absolutely nothing to do with the question at all.

The main file reading/writing functions are saveFile() and loadFile(). These however are just glue around the browser-specific implementations of each of these functions: safariSaveFile(), safariLoadFile(), mozillaSaveFile(), mozillaLoadFile(), ieSaveFile(), ieLoadFile(), operaSaveFile(), operaLoadFile(). If you search for those functions you can see how each is implemented. Here is one:

// Returns null if it can't do it, false if there's an error, true if it saved OK
function mozillaSaveFile(filePath, content)
{
    if(window.Components)
        try
            {
            netscape.security.PrivilegeManager.enablePrivilege("UniversalXPConnect");
            var file = Components.classes["@mozilla.org/file/local;1"].createInstance(Components.interfaces.nsILocalFile);
            file.initWithPath(filePath);
            if (!file.exists())
                file.create(0, 0664);
            var out = Components.classes["@mozilla.org/network/file-output-stream;1"].createInstance(Components.interfaces.nsIFileOutputStream);
            out.init(file, 0x20 | 0x02, 00004,null);
            out.write(content, content.length);
            out.flush();
            out.close();
            return(true);
            }
        catch(e)
            {
            //alert("Exception while attempting to save\n\n" + e);
            return(false);
            }
    return(null);
}

By: charmston

charmston — Sun, 19 Mar 2006 23:06:59 -0800

cyrus: ajax is used to execute (not "write to") server-side scripts with given paramaters. If I'm not mistaken, most server-side languages can write to files

By: yerfatma

yerfatma — Mon, 20 Mar 2006 04:51:48 -0800

It looks like TW does it this way.