I am aware that the HTML5 Filesystem API gives you access to a sandboxed file system. Let's say I write a file to the filesystem. Is it possible to let the user save that file to their actual file system? I would like to be able to tell the user where the file is written so that they may access it but that does not seem to be possible.
My only idea is to read the file as a data url and make a hyperlink that the user can save, but that has scalability issues in terms of file size.
You can use the URL obtained from the toURL method as the value for a link's href attribute, which link in addition has a download attribute. Clicking on the link will then prompt the user to save the contents on her filesystem.
Quoting MDN - Basic Concepts About the Filesystem API:
You can, however, export a file from a web app to a desktop app. For example, you can use the File API, create a blob, redirect an iframe to the blob, and invoke the download manager.
Also, the very page I linked to before discusses FileEntry's toURL() method which returns a url in the form of filesystem:.
Here is another article on how to make the browser download a file from a url.
Related
I am going to build an educational site where users will not have access to the original video file and will only be able to watch it through the site. Is there a way that the file is not recognized by the IDM plugin?
According to the articles I read on the Internet, blob can be used, but there was no solution for local use of Azure Storage blob.
In terms of preventing downloads via browser plugins like IDM, you can use
streaming to send the video content in small chunks rather than as a single file. This can make it hard for plugins to intercept and download the entire file. Azure Blob Storage supports "pseudo streaming" of video content via the "Range" header in HTTP requests. This can be useful - https://stackoverflow.com/a/15166547/13105803
Or another option is to use Azure media service
I have a web application that receives a simple text file, but I need this file to be downloaded to a specific path. Meaning, when the application receives a text file, it will always be downloaded to a specific folder (for example, to C:\MyFolder). If it isn't possible, then I need to copy the file from where user has chosen to my folder.
This application is based on JavaScript.
JavaScript cannot exert any control over my (the visitor's) local filesystem. I remain in complete control of where my downloaded files go, what they are named, and indeed whether I even want to download them in the first place.
Sorry, but the best you can do is inform your users where to put the file you're offering for download. You cannot use JavaScript to choose the destination yourself.
You should be able to do this using a Java applet assuming that you have signed it. The user would be asked to allow your code to run and if allowed, you could do whatever you want: Including downloading a file to a specific location.
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.
Say I have a webapp which executes in its entirety on the client-side. Its purpose is to act as a file conversion utility, for example converting a user's local stored word document into a PDF.
So with the user's permission, the app can read a specified local file and process it, in memory, into PDF format.
How can I get the user to 'download' the result? since the data is held in the browser's memory anyway, I do not wish to upload it to some server.
[edit]
No flash based solutions
Expected file sizes to be up to 15mb
The solution for my case will be to use the HTML5 FileSaver API.
Perhaps this question should just be closed as it is effectively a duplicate of
Using HTML5/Javascript to generate and save a file
Thanks to aefxx
I'm writing a web application which allows a user to select a PNG file, write an iTXt chunk to it and then save it back to their local file system. I would use the new FileWriter API to do so but currently only Google Chrome has added support for it.
Since my file is represented in memory as a binary string I use data URIs to prompt the user to save the file as follows:
window.location.href = "data:application/octet-stream;base64," + btoa(blob);
Since the mime-type is application/octet-stream the browser prompts the user to open or save it. However the problem is that the user does not know which type of file it is. So the user has to add the file extension manually.
Currently I alert the user which extension the file needs to be saved with. However this seems like an inelegant solution. Is there a better way to achieve the same result?
If this were HTTP, then you'd either have to set the content disposition to attachment, to get the file saved even if its mime type is known, or to set the file name for an attachment of octet-stream type. Neither of these headers can be emulated using the data: URI, though, so I see no way to open a “Save as…” dialog using such a URI.
Others have asked how to open a save file dialog for a js variable, and judging from the answers there, there appears to be ready-to-use solutions which work as long as the client has Flash installed (and not blocked).
So perhaps you might try severl solutions, starting with the FileWriter you mention, trying a flash-based approach if that isn't available, and falling back to data: URI with an alert message about the file name extension. That way you could probably achieve the best result possible for each client.