html + javascript: Browsing a folder using browse option - javascript

I need to have my user send the file path to the webserver. For this i'm trying to use input file type so that user can select the file. Please note that I don't want do uploading the file. I just need the location of some file. So user should be able to do that using browse option. I know that due to some security reasons in browsers, full path is not sent to server. But can we acheive this some way. I've observed that using input type=file after user selects some file using browse option (as it is not possible to select folder), the Firefox sends the server just the filename and IE sends fullpath of file including file name.
Please note that this website is used internally so it is not a security problem at all, so don't bother about security and all.
is there anyway we can acheive this?
Thanks in advance,
Sreed

You need to use something that has access to the filesystem. BY DESIGN javascript/html cannot do this. You need to use flash, java or a browser plug-in.

No, sadly I don't think there is.
All modern browsers will send a C:\Fakepath path. To my knowledge, this behaviour can not be changed for local networks in any browser.
I'm not sure what the state of things is for Flash-based uploaders like SWFUpload or Uploadify. Flash traditionally gives more control over such data than the native browser controls. (Edit: Uploadify seems to give you the file path. See this question: How can I get the uploaded file details from uploadify after completion however, this of course is after a completed upload, which is not what you want.)
A Java applet based solution will be able to do this, but I expect the effort to implement this is huge.
I would consider using a normal text file, and asking the user to just copy+paste the correct path.

Browsers do not let you save or even see the full file path to a selected file from the <input type="file" /> form element. I would recommend Flash or Java for your needs. You could also have the user manually type in the full path...just a thought.

Related

Safari method of getting full path to a desktop file that is dragged to a browser window [duplicate]

I am trying to allow users to upload pictures to the server.
I am trying to create a similar system to any website that has an 'attach' file or 'upload image' feature. All I need is to get the full path of the file select by the file dialog.
I tried using this for the file dialog with no success:
<input type="file">
This method does not provide the full file path, due to security reasons. My question is how can I create a similar input dialog to websites like tinypic, photobucket, etc.. that can help users input the full file path of a given image, into an input field?
I am aware that this cannot be done using the method above for security reasons, however, I have seen this done before on various websites without any problems, I was wondering what I had to do to implement a similar file dialog that helps fill in the text, which is a full file path, of an input field?
It is not possible to get the file full path on local machine using browser and javascript.
However, as you would like to upload the file to the server, the easy possibility I see is to use html form with input type file. You will receive the file on your http server when the form is submitted.
Here is a very good url http://www.cs.tut.fi/~jkorpela/forms/file.html that explains the whole process nicely.

how to know browser download location programatically

I have a webpage, that downloads a file,
now the requirement is to show a alert where the downloaded file has been stored.
Is it possible to get the download folder location of a browser through any of browser properties(navigator,window,location etc). Please help.
Thanks in advance
Nope, it is not possible.
Paths, and the whole HDD are beyond browser sandbox, you can't even got the choosen path from "Pick file to upload" (<input type="file"...) buttons.
If it's a normal webpage then forget about it as #ProblemFactory says. But if it's a webapp for closed group of users and you can enforce to use a specific browser then you can achieve this goal by creating a browser extension. At least I know it's possible in Firefox.
And here is the documentation of API https://developer.mozilla.org/en-US/docs/Mozilla/JavaScript_code_modules/Downloads.jsm/Download
The target property of the Download object holds the path to the file.
As you said that you are using IE9, I assume that the choice of the browser is up to you.

Javascript local file saving or onSave event to get saved filename

I'm developing a web app that needs some sort of filesystem access. Ideally I'd want to be able to "Open..." a file into the app and then "Save" the file back to local filesystem at the location that the user opened it from.
Currently, we use a java applet to achieve this functionality, but since java is going out of style, we're needing to do this with javascript and html5.
Obviously, this can't be done because of security reasons built into browsers, so I'm trying to somewhat emulate it.
I'm using the html5 file api to successfully import/open the files, so that's half the battle. The hard part is getting the saving feature. I'm getting close using an iframe and content-disposition, but problems arise when browsers are set to automatically download the files to a downloads folder... users may get confused and be unable to locate the file they just downloaded.
So, my question is this: is there some sort of onSave event or some kind of way for the browser's "Save As..." window to return at least the filename that the user saved the file under?
Also, I've looked into the filesystem/fileWriter html5 apis, but from my understanding they're limited to only a sandboxed area of the local filesystem and only available in chrome dev releases.
Any help would be appreciated!
No, there is no way to do that with pure JavaScript. You can manage to trigger a download with data URIs or an iframe with some headers but you can't circumvent the browsers' download managers.
You can either use a Flash or Java applet to handle the saving for you, or ask the user to right click on the link and do save as, then he might be able to choose the destination.
One popular option using Flash is Downloadify.

how to read a text file using Javascript

I am taking a text file from user and then posting that file back to the browser using ajax storing the content in db and then showing the content back to user page using Jquery post response.
Now i want to something like this..
Read the text file from the user computer using javascript. Display the content and when he submits the page I will save the values.
Can't be done in pure JS for security reasons. You would need to have the user upload the file to your server, and fetch the contents back through Ajax.
If you use Flash or Java, you should be able to gain direct access to the file. If you speak Flash/Actionsript, maybe SWFUpload's source code (especially the new client-side resizing functions) can serve as an inspiration.
Update: This blog entry should help. Read and write local files with Flash Player 10
Update: To elaborate on the "upload and fetch" thing, if you do the uploading in an IFRAME, you could even have the upload script simply output the text file's contents. Because the iframe belongs to your domain, you will be able to retrieve its contents via JavaScript when the upload has finished. As long as you send a content-type: application/text it should be fairly safe from any malicious attacks.
If you're ok with Firefox 3.6 support only check out https://developer.mozilla.org/en/Using_files_from_web_applications, otherwise you should use Flash, Java or silverlight for this.
You won't be able to read a file in user's computer due to security issues.
Reading client files in javascript is possible with the new File API available in modern browsers. Check this site and its code: http://www.readfileonline.com/
However, before reading file contents in javascript, the user must explicitly select the files it allows to read. This is a security feature of the standard.

Is it possible to intercept the file from a <input type=file> in javascript?

Is it possible to read the content of a file that has been selected with a file input control? I wish to do something like:
<input type="file" id="fileInput" onblur="readFile(this)"/>
<script language="javascript">
function readFile(file) {
document.write(file);
}
</script>
Is anything like this possible? or does the file upload just send the file to the server.
It is possible in Firefox, but it is not standardized, so it is not possible portably across browsers (for instance, WebKit does not support it). Your best bet would probably be to upload the file to the server, and then download it again using an XMLHTTPRequest.
You can if you use HTA (Hypertext Terminal Application, see http://msdn.microsoft.com/en-us/library/ms536496(VS.85).aspx). If you do, you're bound to Internet Explorer, but free to access files, the registry etc. There are (of course) security issues.
It is probably not possible in many browsers. What would happen if we gave arbitraty javascript the ability to read an arbitrary file in the filesystem, using the user's credentials? BAD THINGS. Malicious javascript could easily take the file data and post it back to the server, quietly snooping all your files in the background.
I doubt this is possible, and I strongly recommend against it.
If it needs to be exclusively client-side, why are you using a web application at all? The only files this could display are plain-text, for which there are many easier ways of viewing content.

Categories