Local filesystem & web browser - javascript

Please, does anyone know what are the possibilities for accessing local filesystem from a browser? The use case I'm looking for is whether it is even possible to create a really simple text editor which could save text files locally? If so, what technologies does it take to implement such thing?
I know, historically, that it was certainly not possible to this. But now that we have Ajax and co. it is sometimes possible to open local files. There is even some form of local database (ok, not a file), maybe the extensions for a certain browser are allowed to write a file into a certain (predefined) location and then there is the local web server which could as a kind of proxy. And I even saw [1], though I'm not sure how well is it supported. What else?
In other words, suppose you open Notepad, type same text. Now you click "Save", it asks for the path and saves it [2]. Next time you save the file it remembers the path and saves the new content immediately. Is this possible with browser?
[1] http://dev.w3.org/2009/dap/file-system/pub/FileSystem/
[2] see e.g. http://www.nihilogic.dk/labs/canvas2image/ ("Save PNG")

The are some new html5 javascript methods, called file api and filereader api. I only have experiences with the file api. Tried it some time ago and found it not consistent between FF and Chrome yet.
You can find further information on MDN:
https://developer.mozilla.org/en/DOM/FileReader
https://developer.mozilla.org/en/Using_files_from_web_applications

Back in 2020, you are probably after Electron JS, which offers an independant-OS platform to develop desktop programs with the use of JS, Html and CSS. It uses Chromium and NodeJs. Known apps are the GithubDesktop (Github is one of the founders of ElectronJS), WhatsApp and VSCode.

Related

Alternative for the ActiveX object for the other browsers excluding IE?

Can anyone help me as i am stuck in creating a file(temporary) with extension(say .csv) in the local disk, i tried using ActiveX object but it works fine only in internet explorer,got a error when i tried with other browsers. By googling i got to know ActiveX works only in IE so it produces error when its tried in different browser.
var fso, f1;
fso = new ActiveXObject("Scripting.FileSystemObject");
f1 = fso.GetFile("c:\\test.txt");
alert(f1);
Can anyone suggest me with the alternative which can be very useful to.
The problem you have is that browser implementations of ECMAScript (JavaScript) don't allow you to write to the clients' disk. Microsoft reverse-engineered JavaScript, and dubbed it JScript. Though the base is the same, MS added those ActiveX objects, and a compiler (JScript can be compiled, yes).
In short, JScript can be used for more than just browser tasks, so MS provided ActiveX objects to enable some form of I/O. The only thing you can do on browsers other than IE, is using HTML5's new DOM Storage objects. Teemu provided a link to the documentation for that
The other posts cover all the information about storing to the local machine using Html 5 so I won't go into any more detail about that but this is only going to work on Html 5 compatible browsers (although most browsers are Html 5 compatible now, I don't know your project requirements).
Another alternative would be to create / save the file using server side code (ASP.NET, PHP etc) and then provide a link to the user so they can download the file. You can still save this as a .csv file so that the user can open it in Excel after they have downloaded it.
Edit:
What I would do is change your web service so that it saves the file to disc (more info: here). Then instead of returning the file from the web service, return the Url to download it instead. You can then redirect the user to that link using JS.

how to start up a desktop application in client side

In my web page, I have to start a desktop application on the client's computer if it's installed. Any idea how I can do this?
If the application is MS Office or Adobe Reader, I know how to start them, but the application I want to start is a custom application. You can not find it on the internet.
How can I open the application?
Basically it's not possible to achieve unless an application registers a protocol that will trigger it. If it does that all you need to do is to provide a link using this protocol
yourcustomapp://some.parameters
Another way the 3rd party app can integrate with the browser is if it hooks to it as a plugin. This is how flash apps work etc.
If the app you are trying to launch does not support something like that it's going to be close to impossible to achieve what you want.
The browser sandbox prohibits you from executing local resources, for good reason - to thwart a website destroying your box with malicious code. I've been researching the same functionality.
The only solution I've found is to build an extension in Mozilla Firefox which can launch your app. Extensions live outside the sandbox so they can execute local resources. See this page for how to do that. You may be able to do it cross-browser using crossrider, though I haven't had success with that yet.
You could alternatively build a thick client populated from a web service, and launched from the browser through an extension as mentioned above. This is what I'm doing to get around the sandbox. I'm using local XUL for this.
See my question for additional discussion.
First off - you can't do it using javascript in any sort of a portable mechanism.
If the application is ms office or adobe reader,I know how to startup them
No you don't - you know how to send a document, which the browser associates with these applications and invokes them supplying the name of the local copy of the response. You can't just start the programs.
You just need to do the same for your app - invent a new mime type (the major type would be 'application' and by convention, non-standard minor types are prefixed with 'x-', so you might use application/x-hguser) then associate that mimetype with the relevant program browser side.
i.e: You need to explicitly configure each browser
I already encouter that problem in some complex production environnements.
I do the trick using the following code :
function launch(p_app_path)
{
var oShell = new ActiveXObject("WScript.Shell");
oShell.Run('"' + p_app_path + '"', 1);
}
In IE options > Security > Customize the level > ActiveX controls and plugins > Initialization and script ActiveX controls not marked as safe for scripting, set the value to Ask or Active.
It isn't a security problem when your website is enclosed into a specific security context.
And as they say, it's not worth it to build a gas plant.
JavaScript alone can't do this. (No, not even with MS Office or Adobe Reader.) Thankfully.
There are a number of old ways, including using ActiveX, which may work for your needs. As others have pointed out while typing this, you can customize responses based on the mime type or the protocol, etc.
Any way you look at it, you're going to need control over the end users' browser. If you're in a close environment where you can dictate policy (users must use a specific browser, with a specific configuration), then you're going to need to do that. For an open environment with no control over the end users, you're out of luck.
I'm actually having a lot of success right now with SiteFusion. It's a PHP client/server application framework that serves out XUL/JavaScript applications from a server deamon running in Apache. You access applications from a very thin client in XULRunner, or potentially off a web page using extensions. Clients can execute on any platform, and they're outside of the browser sandbox so you can access local resources such as executables. It'a a fairly elegant solution, their website provides great examples and documentation, and their forum is very responsive. I actually found a minor bug in passing arguments to local executables, posted a question about the forum, and it was fixed by the chief developer in under 15 minutes. Very impressive, overall!

javascript jquery file opener

i was wondering if anyone knew a quick solution to my problem. I want to be able to open a folder on users screen pretty much the same as but just opening up the my computer folder so a user can drag a file onto the browser screen. anyone know how?
You can't. They even gave this bug a name: "security".
The closest you can get without using Flash, proprietary browser stuff or Java is something like this.
You have to use a java applet.
Javascript has no access to the file system for security reason.
Every page would be able to see the files on your local machine and might display: "According to the files on your disk you might be interested in some of our special movies ;)"
Incidentally, there are custom extensions in IE and Firefox that let you load and save files; it's the reason TiddlyWiki can work as it does. It does degrade a Java applet for other browsers.
A new jQuery plugin has been extracted out of TiddlyWiki to give Javascript authors the ability to load and save, and it's portable across all browsers:
twFile - http://jquery.tiddlywiki.org/twFile.html
It's quite possibly not what you're after as it will only work off a file:/// URL.

Saving a file with Javascript in S60v3 mobile browser

I'm busy experimenting with TiddlyWiki and trying to get it to run on my Nokia E51, which uses S60v3. The browser is based on webkit, which should mean that I'd be able to get it to work, but no luck so far.
Does anyone have any experience with saving files locally on this platform?
I skimmed through the source of TiddlyWiki. For its file operations it is using the jQuery.twFile plugin which in turn uses a custom Java applet on Webkit-based browsers. The S60 browser does not support java applets so I'm afraid you're out of luck.
I may be wrong here but a quick look at the widget training course on forum Nokia makes it seem like file system access from JavaScript isn't available on S60.
http://www.forum.nokia.com/Tools_Docs_and_Code/Documentation/Web_Technologies/
It really look like you're supposed to retrieve persistent data from the network.
I would hope the web browser cache allows you to query remote data several times while only transfering it once.
On my E51 I am able do download files the old-fashion way: A simple link to a file with a fitting mimetype.

Can you use the JavaScript engine in web browsers to process local files?

I have a number of users with multi-megabyte files that need to be processed before they can be uploaded. I am trying to find a way to do this without having to install any executable software on their machines.
If every machine shipped with, say, Python it would be easy. I could have a Python script do everything. The only scripting language I can think of that's on every machine is JavaScript. However I know there are security restrictions that prevent reading and writing local files from web browsers.
Is there any way to use this extremely pervasive scripting language for general purpose computing tasks?
EDIT: To clarify the requirements, this needs to be a cross platform, cross browser solution. I believe that HTA is an Internet Explorer only technology (or that the Firefox equivalent is broken).
Would Google Gears work here? Yes, users have to install something, but I think the experience is fairly frictionless. And once it's installed, no more worries.
The application that I maintain and develop for work is an HTML Application or HTA, linked with a SQL Server 2005 backend. This allows various security restrictions to be "avoided". All the client-side components in the application are done with javascript, including writing files to locally mapped network drives and loading data into screens/pages in an AJAXy way.
Perhaps HTA could be helpful for your situation.
For an example of javascript accessing a local file, you might try taking a look at the source of TiddlyWiki, specifically the saveFile, mozillaSaveFile, and ieSaveFile functions. Just click the download link, open the html file it sends you, and search for those functions.
Of course, tiddlywiki is supposed to be used as a local file, not served over the web, so the methods it uses may only work locally.. But it might be a start.
Why not use a flash uploader? http://swfupload.org/
Adobe Flex 4 lets you to open and process a file on a local machine:
http://livedocs.adobe.com/flex/3/langref/flash/net/FileReference.html#load()
It's not exactly JavaScript, but hope that helps.
I believe you can accomplish this using the HTML5 File API.
It is supported in Opera, IE, Safari, Firefox, and Chrome.
you can use fs module from nodeJS to manipulate with filesystem nowadays!

Categories