1

I was wondering if JavaScript has the ability to write to the file that is open in the browser. I'm developing a page of links to myself to some key websites that I use (for fun, not necessity). Currently I'm trying to develop something where the user can type a link and a name in textboxes and have the link be saved into the HTML file itself. It is obviously easy to add the link and the name to the page with JavaScript, but clearly once the session expires the link will not be added when the page is accessed again. I want to do it this way because I don't want to have to find and load the file every time I want to add a new link. This would be very easy to accomplish using PHP and MySQL, but this file is not running on a server.

So, in summary, is it possible to save the file once it has been modified by the current session?

My code is below:

<!DOCTYPE html>
<html>
<head>
    <script type = "text/javascript">
        function add(link,name)
        {
            htmlstring = "<a href='"+link+"'>"+name+"</a>";
            document.getElementById('urlsdiv').innerHTML += htmlstring;
        }
    </script>
</head>
<body>
    <input type = "button" onclick = "validate(document.getElementById('validbox').value)" value = "check">
    <div id = "urlsdiv">
        <input type = "text" id = "addbox">//Box to type new URL
        <input type = "text" id = "addname">//Box to type link name
        <input type = "button" onclick = "add(document.getElementById('addbox').value,document.getElementById('addname').value)" value = "Add">//Add new link to page
        <a href = "https://www.facebook.com">Facebook</a>//These three links
        <a href = "http://www.youtube.com">YouTube</a>//have already been hard-coded
        <a href = "https://mail.google.com">Gmail</a>//into the file
    </div>
</body>
</html>
KarelG
  • 5,176
  • 4
  • 33
  • 49
imulsion
  • 8,820
  • 20
  • 54
  • 84
  • @aoeu as far as I am aware (through Google), JavaScript file I/O is possible with HTML5 – imulsion Feb 17 '14 at 21:07
  • You can't update the HTML file from JavaScript. Any file IO is just in a sandbox. What you *can* do is save the users values in the browser, using LocalStorage, for example. – gen_Eric Feb 17 '14 at 21:08
  • Use [localstorage](https://developer.mozilla.org/en-US/Add-ons/Overlay_Extensions/XUL_School/Local_Storage). – Andy Feb 17 '14 at 21:09
  • @RocketHazmat Thanks for the help. As an alternative, would it be possible to write all the HTML code to a new file, then delete the old file? – imulsion Feb 17 '14 at 21:09
  • No. HTML file IO doesn't have access to the *real* file system. It just can create a sandboxed file system that you can use. See http://www.html5rocks.com/en/tutorials/file/filesystem/. A quote from that page: `With the FileSystem API, a web app can create, read, navigate, and write to a sandboxed section of the user's local file system.` – gen_Eric Feb 17 '14 at 21:10
  • @RocketHazmat Ah, I see. Thanks very much; I'll have to try something else. :) – imulsion Feb 17 '14 at 21:11
  • Well strictly speaking you *can* do this in Firefox - [TiddlyWiki has been doing it for years.](http://tiddlywiki.com/) – Pointy Feb 17 '14 at 21:11
  • @Pointy Well, damn, I use chrome >. – imulsion Feb 17 '14 at 21:12
  • possible duplicate of [How to read and write into file using JavaScript](http://stackoverflow.com/questions/585234/how-to-read-and-write-into-file-using-javascript) – Wayne Weibel Feb 17 '14 at 21:14
  • You know that browser has bookmarks, right? :) – Aleksei Zabrodskii Feb 17 '14 at 22:05

1 Answers1

2

JavaScript in the browser is in a security sandbox, and has no access to the filesystem, outside of contained areas that the HTML5 File API gives it access to. Currently, the support is very limited, even for those APIs.

Note that I made the distinction of JavaScript inside the browser, because of newer implementations of native JavaScript, such as NodeJS.

Alex W
  • 37,233
  • 13
  • 109
  • 109