Is there a good alternative for embedding a PDF with HTML next to using a local file path, online file path or data source as base64-string? - html

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.

Related

How to load a text file in HTML

Is it possible to load a text file via HTML using somthing like the link tag?
I’m sure I have seen this before but couldn’t find any thing.
I am creating a local app and I want to load a CSV data file and don’t want to have to rely on the user choosing the file with a file input.
If you mean like a file on the user's computer...only if the file's contents are saved in a cookie or using localstorage when the file is saved. But if you mean from a website, you can use XMLHttpRequest.
See https://www.w3schools.com/xml/dom_httprequest.asp

How to store variables on local HTML file?

Recently I've found that I can use pure HTML, CSS and JS to build Android app (and iOS also maybe), by using PhoneGap. I guess it converts HTML pages to Android web views. So basically I'll have ~10 HTML files, calling each other, get data from Server (it's Java and Tomcat) via Ajax and JSONP.
And my problem is about storing user data with these static local HTML files.
As they are local files, I can't use Cookie. But somehow Session's still working, so with each HTML page, I can set an onload event that sends an Ajax request, then get data. But it's very inconvenient, I have to do that for the same data each time I switch to another HTML file. So, is there any solution I can load all data when the first HTML file is loaded, store data somewhere, then reuse these data in others HTML files ? Thank you so much for reading my question.

Using filepath as a hyperlink in HTML

I Wonder whether I can use pdf Source[as hyperlink] as a file path in system related to script's running directory.
part of code is.
pdf
I am generating this HTML using CGI Scripting in C. and my pdfs are located in ../pdfs/sample.pdf related to my running directory of script. And by pdf source means I want to show the pdf sample.pdf upon clicking pdf as in above sample code.
A browser does not care or know how a resource is generated. You can generate it with C via CGI, you can have the server just hand over a static file. There is no difference as far as the browser is concerned, it made an HTTP request and received an HTTP response.
The rules for resolving a relative URI in an HTML document are the same. The browser compares it to the base URI (which is either specified in <base> or is the URI of the document containing the link).
If that resolves to a URI that the server will serve a PDF up for, then it will work.
Since URIs don't always map directly onto file systems, it isn't possible to say if this will work in your situation (as your question only talks about file systems). If this was on one of the servers that I have CGI programmes executing on then it wouldn't work — since I keep them in a cgi-bin that isn't a subdirectory of the webroot, so the pdfs wouldn't be accessible over HTTP at all. Your server may be configured differently.

HTML 5 - load text from text files

I am facing problem in HTML 5. I need to statically load data into web page from local saved files. Up to now, I have been only able to load data via < input type="file" id="fileinput" / > but I want to load data from static location, which never changes. How to do that? And is there any way how to determine, whether some local file was changed from previous version?
Thanks
no, this isn't possible if by 'local', you mean a file at /home/waypoint/somefile.txt. You can make a 'link' with the filesystem api (if you selected it in an input field, for instance), which is valid to do computations with it (to read it, write to it, display it in img,etc). But it is deleted/unvalid, as soon as the window closes. If you could just magically "read" any local file via javascript which resides on the file system, who would stop google to read out your /etc/passwd file?
if your local computer is also your server and therefor your server-side code has access to the local file /home/waypoint/somefile.txt, your app can get it via ajax. Checking if the file exists, would be done the same way.

Output reformatted text within a file included in a JSP

I have a few HTML files that I'd like to include via tags in my webapp.
Within some of the files, I have pseudo-dynamic code - specially formatted bits of text that, at runtime, I'd like to be resolved to their respective bits of data in a MySQL table.
For instance, the HTML file might include a line that says:
Welcome, [username].
I want this resolved to (via a logged-in user's data):
Welcome, user#domain.com.
This would be simple to do in a JSP file, but requirements dictate that the files will be created by people who know basic HTML, but not JSP. Simple text-tags like this should be easy enough for me to explain to them, however.
I have the code set up to do resolutions like that for strings, but can anyone think of a way to do it across files? I don't actually need to modify the file on disk - just load the content, modify it, and output it w/in the containing JSP file.
I've been playing around with trying to load the files into strings via the apache readFileToString, but I can't figure out how to load files from a specific folder within the webapp's content directory without hardcoding it in and having to worry about it breaking if I deploy to a different system in the future.
but I can't figure out how to load files from a specific folder within the webapp's content directory without hardcoding it in and having to worry about it breaking if I deploy to a different system in the future.
If those files are located in the webcontent, use ServletContext#getRealPath() to convert a relative web path to an absolute disk file system path. This works if the WAR is exploded in the appserver (most does it by default, only Weblogic doesn't do that by default, but this is configureable IIRC). Inside servlets you can obtain the ServletContext by the inherited getServletContext() method.
String relativeWebappURL = "/html/file.html";
String absoluteFilePath = getServletContext().getRealPath(relativeWebappURL);
File file = new File(absoluteFilePath);
// ...
Alternatively, you can put it in the classpath of the webapplication and make use of ClassLoader#getResource():
String relativeClasspathURL = "/html/file.html";
URL absoluteClasspathURL = Thread.currentThread().getContextClassLoader().getResource(relativeClasspathURL);
File file = new File(absoluteClasspathURL.toURI());
// ...
As to the complete picture, I question if you have ever considered an existing templating framework like Freemarker or Velocity to ease all the job?