I'm creating an application whose purpose is to fill out a long form, the details of which are saved to a remote database so they can be recalled/edited later. When the form is ready to send out, I need to convert it into a PDF and email it out. Preferably, I would like to do this without using the user's filesystem, but if that's not doable I can work with it.
I've been looking into solutions for converting to PDF such as jsPDF, and for the email functionality it looks like the standard is to use nodemailer. However, I'm not sure how to hook one into the other, especially if I'm going to be avoiding the filesystem.
This is a web app that will be primarily accessed with iPads and phones. My app is built in React, using Apollo/GraphQL for queries and an Express server, obviously all sitting on Node.
Are there any good solutions to this problem? This is a bit of a crunch time problem at this point, and any help would be greatly appreciated. I've been tearing my hair out on this.
I do all of the stuff you need, though it's not the same process, it's essentially the same.
First of all, you will be doing all of this in the backend. The user will submit the form, you will get the data there and work from here. Once you have the data, you will want to create a pdf file. To do so, I use this: https://www.npmjs.com/package/html-pdf It does what it says, works like a charm. In order to use it, you need to have some HTML. I get the HTML using ejs, more specifically, the render function. (you pass your data to the ejs file you want to render, get the html).
Once you have the html, convert it to pdf with that module (save it to some tmp folder, overwriting whatever was there or whatever you want to do), you can use the nodemailer to send the file (check the doc, sending attachments is just a matter of adding the data).
This is what I do. Surely there must be other ways to do the same.
Related
I would like to convert a C# API I wrote, and that generates (static) html pages (mostly for rendering tables of data), into using angularjs. The goal is to better decouple the data and the html, allowing interactivity (for instance, sorting by a column) / re-use of the data, that go beyond what a static html page could ever offer.
Now the issue is that as soon as I use JS to generate part of my page, I cannot anymore send the html document as-is via email, because the JS will not execute from an email client. Yet, this is a useful feature of my API.
Is there a way around that?
I think I heard once a mention of a virtual browser (in node?), that could execute all the javascript (without GUI), and then dump the html into a file.
Otherwise, the only solution I could think of is to have C# generate the tables, hardcoding the values in the html (as is currently the case), and have angularjs still do all the json post-processing to allow the user to interact with the data. The annoying thing with that is that it will require duplicating some of the table construction logic in C# and JS, which is not great.
If you want to send email, then implement a service in Angular that calls some server side function to send the email. The data should be passed as some sort of view model. In ASP.NET, this server side function is often exposed via Web API or a generic handler (.ashx).
If you want the user to be able to download a file directly from the page, have a look at How to trigger a file download when clicking an html button or javascript.
It should be noted that directly using HTML intended for a webpage is often not a good idea to include in an email. The HTML parser in email clients vary widely, and you should likely use only a small subset of HTML features to ensure compatibility. HTML intended for a browser also often contain extra stuff (such as navigation menus) that isn't appropriate for an email.
Would using a Mailing API be something to consider? In that case you could just grab the contents and use angular to send it to e. g. Sendgrid.
I am using AngularJS in a MEAN stack based on DaftMonk’s generator (https://github.com/DaftMonk/generator-angular-fullstack). I am fairly new to pretty much everything Angular/JS/Node (and stackoverflow so please feel free to point out if I need to reword my question!).
I am aiming to produce a multipage PDF report for a user from an Angular page that contains six graphs, images and text.
There are a number of questions on stackoverflow and Google that relate to potential solutions to this, but having checked these exhaustively, they do not help with what I need to achieve (or I do not understand how I can use them in my scenario..).
Currently, when the user navigates to the ‘report page’, an http request is sent to Node/Express from the Angular controller, which checks the user role/group ID, queries the database, anaylses the data and sends it back to the browser for rendering into graphs (currently using angular-chartjs and flot).
The user selects graph type and can choose a maximum of six graphs to display from a possible list of 20+. These six graphs are what need to be exported to a PDF report (with other information). I need to make this (within reason) as browser compatible as possible (at least IE8+) although my current solution is IE10+ with PDF export disabled for older browsers using Modernizr.
From stackoverflow and Google, possible solutions include using PhantomJS in Node to capture the screen or using a client-side PDF renderer (e.g. jsPDF). Out of these, my feeling is that PhantomJS would provide the most flexibility/browser compatibility. Also, I need to produce several different reports depending on the user role, so having all the code to produce the reports within the browser is not desirable. But I am totally stuck as to how to access ‘what the client sees’ using the MEAN stack. PhantomJS would need to effectively be logged in as the client, and have access to the six choices for graphs that the client has made.
From my research, using PhantomJS would require creating an html page, somehow transferring what the client sees/data/graph choices to it, and then capturing that to render to a PDF, before sending back to the browser. One way might be to pass the required information back to Express (with a POST?) and then rendering a server-side html page which PhantomJS could be pointed to, but I have no idea how to achieve this (or if it's possible). Another possibility would be to store the client report data, choices, etc in the database and set off a task to render the PDF and send it back to the browser when done, but again, I have no idea how to achieve this.
I have read about cookies in PhantomJS or navigating through the login page using code, but this seems to be a cumbersome way to achieve this. Can an html file be created server-side, with chart.js (or another charting library) injected (and angular?) and all the required user data/chart choices for PhantomJS to render to a PDF? I guess in some ways I need to be able to use a PDF generator, charting library, etc server-side to create a PDF.
Any advice (with possible code examples) on how to achieve this would be appreciated.
I guess I had the same problem as you (only I was using Laravel in server side).
The idea I came up with was to convert the canvas generated by angular-chartjs to images (using toDataURL() on the canvas elements)
$('.theCanvas').each(function () {
var canvas=this;
img=JSON.stringify(canvas.toDataURL());
});
http://plnkr.co/edit/PkZiqYynzQXehbe6p1eH?p=preview
and then sending the images to the server to create the pdf , and finally sending the user the link to the created PDF.
In my case, they are plenty of packages to generate a PDF from an html in server side, and I don't know if a tool exists for Node.
I hope this helps.
I have some text stored in a POST variable that I need to append to an HTML file. I want to do within my PHP webpage, but it could use HTML, JQuery, Javascript, or anything else that will run natively. I've tried the PHP approach, but it hasn't worked despite my numerous attempts. Always a 500 internal server error. And I can't find anything on writing to files using JQuery, so if anyone out there knows something I don't, it would be appreciated. Thanks :)
Writing directly to you html/php documents is extremely bad practice. As your comment said you need to validate the input and if you make a mistake you could screw up your whole website.
There are a couple of options you could use:
localstorage: This saves the changes to the browser of the user. This means that the changes wont be on the server. Very easy solution.
Add a database: With PHP it is very easy to add a SQL databse. Write some functions that write the data to the database and read the data from there. Safer than writing directly to HTML/PHP but still needs validation
Do some extreme reading into all the PHP IO functions. You need some extreme good handling if you want this site live.
I think that with the DB you`ll manage, just be safe and build in some security
I created a command line tool to help expedite HTML form filling. It uses a brute force approach in that it sends TAB keys to a window and writes info from a config file. This is unstable so I want to refactor it to set form fields using javascript.
I've looked into writing a Firefox addon to do this. I was able to hard-code each field id and write to it from a config file. My issue is I need this functionality in IE.
Is there a way an external application (ie cmd line tool) can write to HTML fields using javascript? I've tried recreating the entire html page with form fields filled in Java. I then try to send this to the normal destination using an HTTP POST. I ran into authentication issues because the forms require a log in.
My other idea is looking into web service tricks. It may be unrelated, I have no idea.
Why not try something like Selenium?
It will stop your reliance on hard coding everything as you have pretty much free reign over the DOM.
Correct me if I'm wrong, though.
You can open an CwebBrowser2 in your C++/C# application and use it as an HTML browser and get all the HTML programatically. You can then parse the HTML with a XML parses and call certain Javascript hooks.
The HTTP Post idea still seems best, if you have trouble with authenticating you just need to mimic that part as well or get the session ID (if a given session is enough for you).
I am creating a product that as end result will/can create e.g. 10 .sql files, each being a table. The tables will contain various pre-calculated data related to each other.
My users will need to upload these to their website (php, asp, whatever) and will need to make something useful. Only problem, the users may have next to zero understanding of databases, server-side code etc. This means it must be very easy to configure.
So I think thinking upload these .sql (or CSV files, whatever) tables to server, so they are publicly available (i.e. can be retrieved like any other public URL). And then find a Javascript in-memory database engine that can load .sql database files. Does this exist?
I imagine a Javascript solution could work well if amount of data could be kept somewhat down... Otherwise I may need to look for a PHP/ASP solution as well. (Any ideas for libraries that can init in-memory databases from .sql or similar files?)
Preferably I should be able to re-distribute this Javascript library. (So users can get a complete "directory" of .sql files + example page + Javascript database engine to upload)
So to make the question clear: Anyone knows a Javascript-based in-memory database engine that can run inside browser?
If you wish to use javascript and need some 'userfriendly' bridge database, you could use json or xml, because the format are simple text files (like csv as well) for wich you can find smart small editors for your users.
More json is made for javascript parsing and has an understanding tree format, but you should load only some part of sql datas in memory, saying data buffers in xml or json, with php requested with some javascript ajax call. Php do the sql database access work and then you can output json, and with javascript, it is for user's interface, you'll be able to display them.
You can use mysql to store a database in memory:
http://dev.mysql.com/doc/refman/5.0/en/memory-storage-engine.html
Here's a pure JS SQL engine that stores everything in memory, https://github.com/moxley/sqittle
It flatly denies being useful for anything though, and has a limited set of supported commands (see readme on above link.
http://diveintohtml5.ep.io/storage.html might be what you are looking for.
That question seems very old. You might want to look at LokiJS now.