Problem:
User has N browsers installed. As an application I want to store a data shared between all installed browsers.
Requirements:
Support IE9
Possible solution for now: WebSQL using polyfill.
Any another suggestions?
With HTML5 and some of the new JS APIs, there might be a few options.
The newish File API supports everything but IE9. As discussed in this question, you can fill in IE9 support using ActiveX or Java, which ought to do the trick. Because of the sandboxing, this may not immediately allow the browsers to completely interoperate.
If taking user input is an option, I would suggest having the user select and load their preferences file when the app loads. By opening a native file browse dialog, you allow the user to select whatever file they desire, and can use the file API to load the contents and process them.
You can use a similar technique for saving the data, either saving to the file sandbox or opening a specially-formed link (the download attribute) to indicate the browser should save a file. Again, you'll run into IE9 issues that will require ActiveX or Java to fill in.
You can see an example of reading a file from an <input type="file">, which is likely your best option. There are also multiple libraries for file upload (note, I have not personally used any of these).
Related
I want to save a file with data input by the user on a website to the user's device using showSaveFilePicker() in Javascript (purely locally used).
This is currently not supported by all browsers, especially not on mobile devices.
I need a way to check, if the browser used is offering showSaveFilePicker(), so that I can offer a download to the standard folder if showSaveFilePicker() is not available.
How can I check for that?
Using try-catch does not work, as the error will also be thrown when the user aborts saving - which should of course not lead to a saving of the file.
I found the solution:
Check the availability with
if('showOpenFilePicker' in window){}
I have developed a script for myself to read and process local text and csv files on my computer using recent Chrome or Firefox browsers with the filereader api. The script will work on the computer, even though it is not connected to the internet or a local webserver.
The reasoning behind this is to have a standalone text file interrogator, which will work on almost any computer, requiring only a browser to execute and display reasonably formatted output. similar to an awk type application.
I use the filereader api and it works well.
I do not properly understand the workings of the browser, so my question may be very stupid.
Is it possible that my script can somehow pass the filename to the script filereader api, without having to choose a file from input type=file field.
eg I have a file called addresses.csv and it resides in the same directory as my html/js file with the filereader api code.
I want to simulate the choosing of a file, without accessing my local directory and without using a webserver, but a dropdown box of predefined filenames would be even better.
No, for security reasons its not possible, because otherwise people could open arbitrary files on the computers of their visitors which is definitely not intended.
This specification also assumes that the primary user interaction is with the element of HTML forms [HTML], and that all files that are being read by FileReader objects have first been selected by the user.
See http://www.w3.org/TR/FileAPI/#security-discussion
No you cannot. Javascript cannot read your local filesystem without the use of a file input or drag and drop files (html5) as it would be vulnerable to malicious use.
There was a start of a filesystem api which Chrome has included. But you cannot read/write to just any place you want on the filesystem, you can only do so to a sandboxed area on the filesystem. Wither or not they will continue to have this in future versions of Chrome though I do not know.
It also appears the W3C itself has discontinued the file system api
I would like to allow the user to directly download a file with a single click. There is however a problem when it comes to known MIME types like HTML, audio, video, etc. Ideally, I would like to trigger a download prompt for audio/video files. Ultimately, I would like to do it for HTML documents too. The main idea is to make it easy for users to download files without asking them to navigate into the context menu.
I think for example to people that are not really comfortable with a computer and its main functions. These people will surely prefer a better way than "save as".
The reason why I am looking for a JavaScript solution is that the PHP approach only works if you are in a web site context. Whenever you are inside a plugin or injected script context (i.e. developing a plugin for Firefox, Chrome or Safari), you may want to avoid asking for a server-side response.
I tried to achieve this with window.open() and document.execCommand("saveAs",.... It does work, although it is glitchy and fails for huge files.
Then, I tried Downloadify which does not work in every situations.
Is there a pure JavaScript, no Ajax way to trigger a download prompt so the user can directly download a file using a simple left click?
There is a new download attribute in HTML5 that you can annote links with. It indicates to the browser that the resource should be downloaded rather than navigated to. Right now, it only works in Chrome, but it is part of the HTML spec and will hopefully be adopted by other browser soon.
Demo: http://html5-demos.appspot.com/static/a.download.html
More info: http://updates.html5rocks.com/2011/08/Downloading-resources-in-HTML5-a-download
If someone reaches this question now the best solution is
<a href="example" download target="_blank">
If the browser supports the HTML5 attribute download will start the download of the file, otherwise (in case of Internet Explorer and old browsers) the link will open another tab window with the file to download.
You can use <a href="example" download>. This is HTML5 and it works with Chrome, Firefox and Edge (but not with Internet Explorer, not even modern versions).
Is it possible to edit a local file without uploading to the browser?
Let's say the client has an HTML file, I want him to be able to use my site's javascript to edit the file without uploading it. Would this be possible?
Thanks.
Yes, it is possible, but only in HTML5 (and only as browsers add support for it...not all do yet), you can find the HTML5 File API here.
Note that the user has to give permission to access the file, from Section 5.9:
Once a user has given permission, user agents should provide the ability to read and parse data directly from a local file programmatically.
Nope, that's not possible and shouldn't be either due to security concerns it may pose otherwise.
Note: This feature is there in HTML5 as pointed out by #Nick Craver, you may want to go for but you should be aware of the fact that HTML5 isn't yet supported by all browsers.
In my application I want to open some files with the correct default programmes, like .doc file should be open with WORD and .psd files should be opened with Photoshop if it is installed, and this should be done under html or java script.
Please tell me how to do it.
JavaScript cannot run programs, but if you have a file on your server you can simply link to it:
<a href='image.psd'>Download File</a>
Users will be promped to download the file or open it using the default program (for most files). Again - as others have said - this is determined by the browser. IE can open doc files on the browsers, and PDF documents can be opened that way too.
There is no way for you to choose which application will be used to open your files with javascript...It just doesn't have that power.
I don't think this is possible in JavaScript without using any activeX or something like that. Js has no access to locally installed applications.
Browsers typically don't have access to the computer's filesystem for security reasons. If you know the exact path to a file you can point the browser at it using a file: URI, e.g.
file:///C:/path/to/file.ext
You may also be able to do this with a plugin, eg ActiveX, however I am unsure as to what security measures that would have.
Invoke the system command 'open'. Works on Windows and Unix based clients.
Depending on where your script runs, you might not be able to invoke system commands though, for instance in a browser sandbox.
If you provide a link to a file on the local file system (eg: <a href="file:///C:/mydoc.doc">) then the browser will open it - however this is not a great way to do it since the browser will first show a dialog ("Do you wish to Save or Open") and then it will "download" it into temporary files as it would if the file were remote. In this case, if you edit and save the file, it'll be the version now in your temp folder. This might not be a problem if your files are read-only, but generally it's not a great user experience.
The only other method is to use ActiveX, which is actually rather easy (though I don't have the exact code on me now - write a comment if you're interested in a snippet and I'll update). Of course this comes with the giant flashing caveats of:
It only works in Internet Explorer.
You need the user to fiddle with their security settings for the ActiveX scripts to run.