From the Page, user can browse and select a folder on their local drive. after selection it populate list of file names in listbox.
Then I will use these file paths randomly to upload to server.
Is this possible?
I am asking because what i know due to security browser prevent to access client files.
The HTML5 File API might contain something you can use to accomplish your goal, but then your application will only work with browsers that implement that API.
Related
I have a requirement where I want to show the file preview to the users.
There are various file types which are supported like; .pdf, .xlsx, .doc, .rar, .jpeg, .png and many more.
When user clicks on the preview it should open the file in popup where preview of the file is shown to him. User can Zoom-in, Zoom-out, Download the file. Just as you can see into gmail for attachment preview.
Please, can anyone guide me to any relevant library or helpful resource for the same.
Thanks in advance
There are two main ways you can do this.
1) Server-side: Render previews once server-side (on file upload) into jpg/png images, and store the previews on the server. This is the easiest to implement on the client side, but requires extra storage on the server.
2) Client-side: Render the previews 'live' with javascript in browser, this reduces the amount the server has to do/store, but does require the client to fully download the file in-memory before it can render the preview, which for large files could be an issue. Also, you would need javascript libraries included for likely each individual file type, since most libraries will target one specific file format.
Server-Side is probably the recommended way to go. What are you using for your web server?
You are looking at creating document viewer.
Belive me its big work as browser does not understand these formats. Browser can render images directly on canvas but it does not know how to render the other files. So, any file other than image formats, one need to save them temporarily on server and then stream on the browser and show them using the respective file viewer.
You can convert doc and xlsx files to pdf and show these files using pdf viewer (http://ngmodules.org/modules/ng-pdfviewer). There are plenty of document converters available on internet (however you will need to check the licensing terms as most of them are GPL licensed, hense can not be used in commercial projects).
If you want to save this work then go for third party server those take all paint to convert documents in html5 such as https://crocodoc.com/why-crocodoc/
You can also try using google doc viewer google doc veiwer
This question is fairly broad. I'm not going through all the steps of how to implement an attachment viewer directive, but here are some pointers you might find useful.
To allow the user to download the file, you simply put a download link somewhere. If you are hosting the attachment on Amazon S3, Google Cloud Storage or some other cloud storage service, check their documentation. If you're downloading the files from your own server, make sure to set the Content-Disposition HTTP response header to attachment; filename="ORIGINAL_FILENAME", where ORIGINAL_FILENAME is the file name you want to user to see in the save dialog that appears when they click the download link.
Now on to the viewer.
For PDF files, I'd use pdfJS. There's an angular directive for it here.
You could look at something like CloudConvert for other files, to convert ehm to a PDF, and then displaying them in pdfJS, but then you probably want to store the PDF on your server as well, in addition to the original files, which requires extra storage. You might also be able to use the Google Docs viewer, or Office 365 viewer, as described in this answer.
Is there anyway I could javascript or just modify the html5 file input tag to select files from my web server? this is a content management kind of problem so security is not an issue, and if possible i would like to restrict it to a particular directory in the web server. Am not trying to upload or download anything, I already have a way of uploading the files to the web server, am just looking for a way to point to them if you will.
Thanks in advance
The new version of Linux Mint allows HTML 5 login window themes -- I'm trying to write one that will grab each user's wallpaper. These wallpapers are located in the folder /home/#USER#/.cache/wallpaper/, however the file name is not consistent and I need a programmatic way of determining it. Once I know the filename, the login screen will display the image correctly using the file:///.. format.
I don't have any tools other than client-side HTML/CSS/JavaScript[/jQuery/etc] available to me. Is there any way I can grab the file names in that directory, so that I can grab the wallpaper image?
EDIT: Figured it out! The browsers won't allow access to the file:/// resources at all, the mdm-theme-emulator will.
It looks like these files are located on the client machine, in which case you would not be able to access them using jQuery. Javascript does not have access to the local file system.
If you are sending the request through a server, you'd be able to use the server-side code (ASP.NET, PHP, etc.) to loop through the filenames
In an html page I have input type='text' and a button
filename: [ ]
[PUSH]
The user goes and fills the filename with "C:\test.txt"
When the button is pushed, (onclick), I want to write some javascript to upload the file
(e.g.: c:\test.txt) and submit to the server.
Obviously the input type file would be hidden and programmatically edited.
is this doable or are there any limitations ?
The idea is that the user does not have to go and use the input type file and always go to the open dialog
You cannot manipulate the filename before upload. You must do this on the server. This is a security measure to prevent the browser from being able to upload arbitrary files.
Your run of the mill javascript does not have access to the client's file system, and this is a good thing. Use the type="file" input that interfaces with the user's OS instead.
As far as I understand your question you want to enable to select filename from local disk and upload it without user selecting it first?
Then the answer is no. You cannot do that for security reasons, JS have no access to your local disks.
Also, you can't upload files via JavaScript, you need to have some server-side code to do that as well.
For security reason you can not do this with JavaScript. But there exists a number of other upload tools (ex Java Applets, ActiveX or Flash) web components that could "theoretically" do this.
I suggest that your search around for "File transfer java applet".
There is a Blog article that explains and compares some of those web upload components. Take a look at http://www.filecatalyst.com/comparison-of-web-based-file-transfer-methodologies
In our intranet environment I am trying to have a way of (like file upload / telerik file explorer) selecting a file using a browser and then returning the path only. I need to save the path in database and users need to select the file from network shared drive.
For telerik explorer u need to implement custom provider to do that and I am unable to do it using file upload control.
Tips regarding a user friendly solution will be highly appreciated.
That can't be done because it would posses a security issue.
Please read these:
http://forums.asp.net/t/1077850.aspx/1
https://stackoverflow.com/a/4176605/290343