Is it possible to obtain file handles in HTML5 and store it as a blob in webDB for upload later?
(Upload selected images when the 3G network is available again, without re-selecting the files.)
The HTML5 will be loaded from the local client device and
action="http://.../insert.jsp"
be used to upload the files to the server.
Any help or ideas will be very useful.
C-:
Any File object can be converted to an URL.
It is simple to do by using object URLs as described by:
https://developer.mozilla.org/en-US/docs/Using_files_from_web_applications
(I still have to confirm that the URLs remain valid across sessions.)
And it does not remain valid across sessions in Chrome!
Related
I am building a web app and I would like to show PDF files to my users. My files are mainly stored as byte arrays in the database as they are generated in the backend. I am using the embed element and have found three ways to display a PDF:
Local file path in src attribute: Works, but I need to generate a file from the database byte array, which is not desirable as I have to manage routines to delete them once they are not needed anymore.
Online file path in src attribute: Not possible since my files may not be hosted anywhere but on the server. Also has the same issues as the previous method anyway.
Data as base64 string in src attribute: Current method, but I ran into a problem for larger files (>2MB). Edge and Chrome will not display a PDF when I covert a PDF of this size to a base64 string (no error but the docs reveal that there is a limit for the data in the src attribute). It works on Firefox but I cannot have my users be restricted to Firefox.
Is there any other way to transmit valid PDF data from a byte array out of the database without generating a file locally?
You have made the common mistake of thinking of URLs and file paths as the same thing; but a URL is just a string that's sent to the server, and some content is sent back. Just as you wouldn't save an HTML file to disk for every dynamic page on the site, you don't have to write to the file system to display a dynamic PDF.
So the solution to this is to have a script on your server that takes the identifier of a PDF in your system, maybe does some access checking, and outputs it to the browser.
For example, if you were using PHP, you might write the HTML with <embed src="/loadpdf.php?id=42"> and then in loadpdf.php would write something like this:
$pdfContent = load_pdf_from_database((int)$_GET['id']);
header('Content-Type: application/pdf');
echo $pdfContent;
Loading /loadpdf.php?id=42 directly in the browser would then render the PDF just the same as if it was a "real" file, and embedding it should work the same way too.
I am trying to figure out where and how does Chrome save local storage.
I found the following folder (in my home folder) that seems to contain the local storage:
\AppData\Local\Google\Chrome\User Data\Default\Local Storage
In this folder I see files that corresponds to different URLs (the files contain URLs in their names). For each URL I see two types of files:
LOCALSTORAGE file
LOCALSTORAGE-JOURNAL file
I am interested in local storage of one particular web site. For this web-site the LOCALSTORAGE file contains only 6KB and the LOCALSTORAGE-JOURNAL contains nothing (0 KB).
On the other hand, when I open the web site of interest in Chrome and then press F12 I see in the local storage 6 different URL and if I click on one of them I see key-value pairs.
So, what I see in the folder and in the Chrome development tool is not consistent. Why is that? How can one find content of local storage in the directories? Or is it impossible?
The file is in SQL Lite format. Install SQL Lite, then type the following commands:
cd %LocalAppData%\Google\Chrome\User Data\Default\Local Storage
sqlite3 *filename*
select * from ItemTable;
.quit
The ItemTable table contains key-value pairs, the semantics of which depend on the individual website.
see the description of localstorage file here
it says : The extension LOCALSTORAGE indicates an application support file created by the web browsers using WebKit, such as Google Chrome and Apple Safari. These files store browser settings or local data for a browser extension, and enables extensions to store a local cache of user data saved in an SQLite database format.
You can browse localstorage files by a sql-lite browser, such as the open source program called sql-lite database browser
I'm able to use HTML5 standard File API and IndexedDB to store large binary files in the browser.
However, when offline, I need to be able to open these files. Using data URLs works great for small files, but none of the browsers support 10Mb file opening through data URL. Is there any other solution, except for non-standard window.webkitRequestFileSystem?
I've actually found an answer here: https://developer.mozilla.org/en/docs/Web/API/Blob.
It is possible to save result of FileReader.readAsArrayBuffer in IndexedDB. When offline, it is possible to create a blob from this typed array and then create data URL to be passed to window.open function. Works with large files!
Is it possible to store HTML5 local storage data to some other .txt or .doc or excel file?
Because, i want to backup the local storage data to some other file.
If your question is asking whether it is possible to tell the browser to translate local storage to a .txt or .doc file, the answer is no. Local storage is implemented in the browser and stays in the browser (as defined by W3C).
If you want to have some mechanism that converts local storage data to a file system file, you probably want to use the File API instead.
You can create a client side file using HTML5. This link shows how to do that. Be careful though, not all browsers support this feature.
I am trying to write a mp3 player using HTML 5 benefits. Play local file, until now, seems ok. Im writing sample codes based on these example : http://antimatter15.github.com/player/player.html
Here's the thing : I have to get the reference of each mp3 file. I want to get all this reference and save on database for when the client access the website i show this playlists. The problem is : doing in that way I mentioned before every time that client close/open browser the blob reference to file is not valid anymore. Iam looking for FileSystem API, that allows to save data into sandbox section. So, data could be cleaned every time users wanted and im still cant save mp3 references on my server database. Could you guys give me sugestions? The real thing is just save a reference from mp3 local file to allow my user create a playlist and every time that he access the web page he could see that playlists.
Thanks in advance,
http://www.html5rocks.com/en/tutorials/file/filesystem/
I doubt this reference(or "object URLs") persistence thing is intentionally unsupported by the browsers. Otherwise you could access the user's filesystem without his awareness. This could be a security problem.
As quoted at here:
Each time you call window.URL.createObjectURL() , a unique object URL is created, even if you've created an object URL for that file already.