Add barcode to PDF - javascript

How can I add PDF417 2-D barcode (as an image) to a Acroform PDF?
I have a process in place where I populate a PDF "templates" with data using a XFDF file that I build server side. Staying in the same workflow, I'd like to either use XFDF or FDF files to add a barcode to the PDF.
I'm using full-stack JavaScript environment, where the Nodejs environment runs server side. I'm using PDFTK Server (JavaScript on the server calling out to a PDFTK.exe).
I can use any tool/technique within my technology stack (Nodejs/Javascript). Also, this solution must work server side only.
The PDF "template" currently uses a Adobe Lifecycle "Paper Forms Barcode" control for the barcode. When we fill this PDF form out with data manually, the XFA script embedded within the PDF automatically populates the "Paper Forms Barcode" control with the PDF417 barcode.
When I run PDFTK Server's form fill command to populate the PDF with the XFDF data I build server side, I believe the XFA (and hence any intelligence behind the "Paper Forms Barcode" control) is automatically removed from the resulting output PDF.
I can optionally remove the "Paper Forms Barcode" control and use any other control available.
pdf417-js seems to get my close to building a PDF417 barcode, but it's client side. And also, I can't see a way to build an image output.
From my research it seems I might need to remove the existing "Paper Forms Barcode" control and add an image somehow to the PDF. Then possibly use PDFTK to somehow merge a PDF that I have filled with data from my existing process with another PDF that simply has the barcode.
I never seen an example of XFDF or FDF inserting an image into the PDF. I've read where one can dynamically add an image (icon) to a button control via FDF (I've found no hard example of this), but haven't been able to get anything working.

FDF does support inserting images as icons into Button fields. I am, however, not sure whether XFDF does it. You may have to convert the image into PDF format.
For an industrial-strength use, you might consider dedicated tools, such as FDFMerge by Appligent (which would also allow to selectively flatten the barcode field (and others too)).

Both FDF and XFDF support adding images to PDF pages. Some background first, Adobe Acrobat and Reader can submit form data as well as comment annotations. It can also import form data as well as comment annotations. Therefore, FDF and XFDF can represent both form data and comment annotations.
Images can be added to a PDF via FDF or XFDF by representing them as a stamp annotation. Acrobat can certainly import these but most server tools don't know about the <annots> element of the XFDF and even if they did, they generally can't create an annotation appearance based on the annotation properties. One can; the Datalogics PDF Java Toolkit is capable of importing XFDF with stamp annotations.

Related

How to edit pdf stored in a server by a webapp client?

The use case of this problem is very simple but i struggle to find a good solution for it.
I want to allow my users (through a webapp) fill some pdf files stored in server (pdf with forms, which begin more and more popular).
Actually, app like chrome or acrobat reader are able to fill them perfectly whe its open locally.
I already allow this functionnality for docx and xlsx files, for that i use Webdav and the custom protocols ms-word ad ms-excel. It works perfectly.
For pdf, I didnt found equivalent. Its look the mains pdf reader/editor doesn't implement this protocol. Whe we open distant file with these tools, they failed for write permission when save or they try to save the file locally) .
Another option i take a look was the new file system access api (https://web.dev/file-system-access/). But again i wasn't able to make it working properly. The main problem here is how we can edit the file.? Im able with this api to dowload the file locally and keep the filehandler to retrieve the updates, but i blocked on how i can edit the file ? like an option on the fileHandler to say "Open this file with default editor on the OS". this would be perfect. But for now to edit the file i have to manually open it on the eplorer. i can't ask my end user to do that there is too many risk they edit the wrong file.
Another option on the table is the different javascript library for editing PDF, but these last one looks all very expensive, usually very heavy on the client side, with advanced features definitively i don't need. I just want to fill the forms and retrieve the pdf completed. So i would like to avoid this option.
Last option i take a look, i already use pdf.js (from mozilla) and pdf-lib.js in my app for some drawing features. I was thinking
rendering the pdf with pdf.js
retrieve all the forms fields (id, type, size, position) of the pdf with pdf-lib
generate html input write on the top of the pdf with the informations given by pdf-lib
i let the users fill the input and click on a save button whe he finished
on the save, i edit my pdf with pdf lib, i set the value of all my forms fields by taking value of the corresponding html input, and i retrieved the pdf updated.
This solution look for me the more "feasible". But im afraid of the volume of development, on how it will render, deal with zoom, rotation, etc. i would like to not have my custom solution.
I precise my webapp target chrome so it make me crazy to not be able to use the chrome pdf viewer/editor to do what i want.
PS : i struggle to post this question on stackoverflow. the previous one was deleted witout i had precise reasons. i try to be more specific on this one, but please if its such a dumb question, please answer it
I feel your pain, this is currently not possible. Adobe acrobat can open PDFs from webdav locations (simply call acrobat.exe and pass in the WebDAV UNC and it will work) but there is no way to trigger this from the browser.
If you are able to deploy software to your customers machines, you could create a custom URL scheme to do this...

Generating online PDF with Parameters from URL

I have a form PDF set up with one field for their name (it is essentially a certificate of a kind). We want this to be automated so for example, www.website.com/file.pdf?Name=Bob and it'll insert 'Bob' into the relevant field. I have tried Javascript at document level but it only works in IE and we need it to work across most browsers especially Chrome and Firefox.
Ideally, we'd like just one PDF to exist, to link that with a parameter in the URL to send to someone and they can download the PDF without filling it in. We're issuing quite a few a day,linking the URL in a separate email (but we're phasing into SQL Server and a 3rd party application to make these emails automated hence the need for this to be automated)
I've tried dozens of websites that fills PDF forms or the like but none result in a single PDF with a URL that can be parsed into the PDF form field. Am I missing any websites that does so or is there an easier way to allow a PDF to do this and host it on my own?
Thanks
You can create a server-side script that parses the URL and dynamically generates the PDF form fields with parsed URL parameters.
Here is an example of a ASP.NET generic handler that creates the PDF based on what is submitted in the form. You can instead create PDFs based on values obtained from the URL.
http://www.gnostice.com/nl_article.asp?id=315&t=An_ASP_NET_handler_to_create_a_personalized_PDF_form_that_it_that_will_mail_itself_to_an_e_mail_address
You can use any PDF library for this, not necessarily the one used in the article.
DISCLAIMER: I work for Gnostice.
You can get the URL parameters using this.path in the PDF. This property will return the file path of the document, but it will include any parameters that you pass along with it. You can use the path to extract the parameters that you need. So far, this method works on Chrome and IE. Firefox doesn't support filling PDF forms in the browser.

How to convert a single page webapp into an offline format

I created a single page application using AngularJS. Is there a way to automatically convert it to an offline format like pdf or chm? The website contains multimedia content such as webms and ideally those should be preserved. Although having a single file (like a chm), would be preferable it would be sufficient to be able to view the contents of the website locally without having to use a web server.
Solutions like saving webpage as MHTML, HTML Help Workshop and WEB to CHM don't generate useful output. Allowing users to download the website and open the files directly doesn't work because of this error.

Save HTML5 page as PDF

On click of a button, without doing a round trip to the server, can we save a HTML5 page on clients machine as PDF.
Check out PDF.js. This lib can create pdf in the browser (or serverside on node.js).
Using chrome you can print the page to a pdf file.
You need something like this, maybe server-side you can start a browser and print the content to a pdf file and send this to the client.
Disclaimer: i work for ByteScout
If you have simple HTML formatting and want to generate PDF on client side and if you have non-commercial project, check BytescoutPDF.js - it supports simple HTML formatting for text (font name, size, color) plus simple drawings and images, should be enough for simple reports

how to embed a live excel spreadsheet in html

hi i would like to know how i can embed a excel spreadsheet in a web page and change the excel numbers on the hosted file and this in turn automatically changes the webpage sheet?
would like to know if there is a jquery, javascript, css etc code to help me out
for example, book1.xls will be uploaded to the server and index.html will reflect book1.xls as a table in it. when i update book1.xls, it should automatically show in index.html the changed cells.
thanks in advance
The simple way to actually connect to an XLS is through VBScript, but your server will have to support it (which most do).
Another way would be add an ODBC to your servers connectors pointing to your XLS or MDB or whatever Microsoft data file you choose and use JavaScript or any number of languages to connect to it, retrieve data, make changes, etc. The downside is that you must have Administrative rights to the computer hosting the file. You can use a homecomputer to use as server for that file only for instance and link it to your website, but it will affect loading speeds. This will however require you to take a closer look at your home internet security...!!!...but will enable you to make 'live' changes without going to your website. This method is often used for webshops and online catalogues, places where data can change on a daily basis but a database server is undesirable.
The simplest and easiest way is as mentioned before the use of GoogleDocs, but that will require conversion of the document. You won't be using your XLS as datafile. The downside here is that if you make any changes offline (not through the website) the changes will also not be visible, because you'll be editing a completely different file. So you'll need to convert and upload it to GoogleDocs each and every time.
As you can see the method used greatly depends on how often you plan on updating the data, how much traffic you expect and how secure you want it to be.
A "live" spreadsheet can be shown in a web page via an iframe containing a Google Doc spreadsheet. You cut 'n paste the iframe markup from Google Docs and drop it into your web page. The spreadsheet is editable in GDocs. The iframe view can be set to automatically update when the ss is edited.
Perhaps, this is too bland a solution. But it works. I use it all the time.
I doubt you can do that directly from an .xls file, but if you save your Excel file as .csv, you can read a .csv file via jQuery.
There's a plugin here that displays data from a csv file as a table: http://plugins.jquery.com/project/csv2table
The same/similar question is also asked in these posts:
Read Excel data with JQuery
How to parse an excel file in JavaScript?

Categories