Is it possible for a web application to read local files, and display them without having to upload them?
I know that when I upload something, web browser can show me the file picker and let me choose the file. Can someone enlighten me on this?
No. Modern browsers do not allow you to access local file or local file structure. It is a security vulnerability. Browser security is pretty tight, and getting tighter. Local file:// access is usually permitted if you run the browser App from the local file system, and not through an HTTP server.
It is possible. However, the user may be viewing the page from any OS or browser, making this almost impossible. The user would have to have the file you want to display in one directory as a specific filename and filetype. You would even have to have a specific user account name. It would only work in one OS - windows, in my example.
<embed src="file:///C:/users/user/filename.exe">
<img src="file:///C:/Users/User/photos/picture.jpg">
I don't know if you could add in variables in php like $path and $filetype set in a form using
echo("embed src='$path/$filename') I didn't add the html code blocks becuase It would't show up. Also, in php make sure html code blocks have ' instead of " because it will read as the end of code.
(I don't know much about php - if I made a mistake, sorry.)
Related
I am wondering if there is any method of reading file on the client side with javascript given the file name and path. I am aware of the method of reading through: input type="file".
What I mean is without opening up a file browser and selecting the file, just reading it with filename, like fopen.
If not an other method, how to instantiate a File object in javascript from filename and path?
Seeing the answers I thought of briefing a bit more on my purpose.
I am not really making a webpage. I am using browser just as a software that is available on any system. The html pages will all be local. I am doing this way be so that I have the advantage of the power of js. Given this situation is there any way to set permission flags that will let it read files?
Thank you.
There's the Drag 'n Drop API which would be the other option in reading files using JS
There will always be hurdles so that your code will not directly read from the client's filesystem. This is designed for privacy and security purposes.
Extensions/Plugins - sandboxing will be your enemy, limiting file system access
Java Applet - Needs a signed certificate to read the filesystem. A self-signed certificate will generate the "Will You Trust This Applet" prompt which would act as the security prompt.
Input type=file - gives the user the option to select the files or not
drag and drop - gives the user the option to drag in files or not
XHR - Same Origin Policy will block you, especially if you are executing the page locally and not on a server.
JSONP - Since this bypasses the SOP, however, your file should be in JSONP format.
I found solution to my problem, here it is...
It is true that we have restriction with javascript that whenever the user or the page requests for a file it has to go through that extra window that pops up,
but if all the files that you may request are inside a known folder then you can rather ask the user to point the zipped folder instead.
One can use tools like zip.js for opening a file that one needs in the zipped folder.
Thank you :)
I am trying to do a simple thing:
Let the user choose a txt file, and save its context to be used on the client side only.
no server side needed.
Is it possible ?
Thanks.
It is possible to do so with HTML5 Files API as explained in these resources:
https://developer.mozilla.org/en-US/docs/Using_files_from_web_applications
http://www.html5rocks.com/en/tutorials/file/dndfiles/
I guess you mean "save its content" and conclude you want to do anything with this content on the client side, e.g. extract some parts to fill a form. Anyway saving the whole file unchanged, on the same machine where it comes from, does not make sense.
So the problem is not how to upload, but how to open/read a file. You can do this with a Java Applet, Flash, Silverlight, ActiveX ... just to name a few.
JavaScript is not an option. It cannot access the file system.
If the html page, that is hosting your javascript, is from a remote server. This script is not trusted to do actions on your local filesystem.
<Obscure solution mode level = 1>
You can give more trust to a page, but this is something your user has to do. If this is an app/web only for use within an enterprise, you can probably do this centrally. And every browser handles this differently. So it is not something you can rely on, when you do not have a limited userbase.
<Obscure solution mode level = high>
If your (enterprise) users are using Internet Explorer, you could also create a HTML Application (simply give your html page an hta extension). These pages have full trust, but can only be started from a trusted location, or require confirmation from the user.
The only way you can acheive this successfully is to build an ActiveX type plugin/component (or java applet) you will have much more control of the client machine.
No. JavaScript cannot access the local filesystem.
However, you could install a webserver on your machine and e.g. run PHP on that one. Then you could do it without ever sending your data over a network connection. That would require you to do your data processing in PHP though.. probably not what you want. Or you could simply send back the data to your javascript.. but that'd be pretty awful to run an upload just to make the data available to JavaScript.
Is it possible to read the contents of an uploaded file (through <form><input type="file">) from inside javascript with no backend? I suppose it's possible with HTML5, but what about HTML4?
You can read (not upload - well, you can upload too, but that's like sending fan-mail to Edgar Allen Poe; nothing stops you but he won't be able to read it) from files if your script runs in a very trusted context.
If anyone on your network is browsing the web in a browser set to give that much trust, disconnect their machine from the network first, make their settings tighter second.
I don't know if I understand correctly. How about using something like uploadify together with jQuery. I guess you'll have to grant the webserver the privilege to write in the specified folders.
The security model will not let you unless you change the security to allow this.
http://www.mozilla.org/projects/security/components/signed-scripts.html
Can you elaborate on what you want to do?
I read the question as "How do I grab the contents from a file chosen using a file upload field and process it on the client without involving a backend/webserver".
I am thinking UniversalBrowserRead access for FF and HTA filesystem for IE for example
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.
I was wondering if there was any method to implement browser's download file prompt using JavaScript.
My reason - well users will be uploading files to a local fileserver which cannot be accessed from the webserver. In other words, both will be on different domains!
For example, let’s say websites hosted on www.xyz.com, but files would reside on local file server with address like \\10.10.10.01\Files\file.txt. How am I uploading/transferring file to local fileserver... using ActiveX and VBscript! (don’t ask :-)
So I am storing local file path in my database and binding that data to a grid. When the user clicks on that link, the file opens in a window (using JavaScript).
Problem is certain file types like text, jpg, pdf, etc. open inside browser window. How would I be able to implement content-type or content-disposition using client side scripting? Is that even possible?
EDIT:
the local file server has a window's shared folder on which the files are saved.
"content-disposition: attachment" is pretty much the only way to force that, and this MUST be set in the response header.
If the file is hosted on a web server like in your example, you can do:
window.location.replace(fileUrl);
.. and the browser will figure out what to do with the file. This works great for most files, such as .xls, .csv, etc, but keep in mind that this isn't full-proof because the user's MIME handler settings will determine what to do with the file... i.e. if it is a .txt file it will most likely just be displayed in the browser and will not be given a "file download" dialogue box.
As of August 2015, adding the "download" attribute to your tag enables the behavior you're looking for, at least in Chrome.
You could try using a plain hyperlink with type="application/octet-stream". Seems to work in FF, but IE and Opera ignore the attribute.