最新消息:雨落星辰是一个专注网站SEO优化、网站SEO诊断、搜索引擎研究、网络营销推广、网站策划运营及站长类的自媒体原创博客

Javascript - Programmatically batch print HTML documents - Stack Overflow

programmeradmin0浏览0评论

tl;dr I'm looking for a good way of batch printing database-stored HTML documents from javascript

Our users generate rich text content via an open source WYSIWYG javascript-based text editor (CKEditor). The HTML content is saved to our database and can be printed directly from the editor via its inbuilt print functionality (basically just window.print()) . This is great and works perfectly.

Now, we have a need to batch print saved documents and I am looking for workable solutions. There are various options that I can see, but all have large tradeoffs:

  1. User selects documents to print. JS code loops through documents and calls print one-by-one. The issue here is that the user will see a bunch of print dialogs. Which is painful. (Aside: we are using Chrome but I do not have the option of setting it to kiosk mode)

  2. User selects documents to print. JS code bines all of these in a single (hidden) container and they are all printed as one 'document'. These can be fairly big documents with tables, images, etc. I worry about the performance involved here as we could be adding a significant amount to the DOM.

  3. Similar to #2 above, but at some point the documents are converted and saved to a single PDF. This would be OK, but there don't seem to be many good/cost-effective options for converting HTML to PDF.

  4. Generate some kind of a report that can handle HTML content. I took a look at SQL Server reporting services but it supports a very limited set of HTML tags and CSS properties.

Is there a better way to batch print HTML content from javascript? Any help is very much appreciated!

Edit As per @Paul, I need to clarify a few points:

The content is that which is created in your standard online text editor. In my case:

  • No iframes
  • No animations
  • No dynamic content

Now, were I to print straight from the editor a print stylesheet would be applied, so this may plicate things a bit.

tl;dr I'm looking for a good way of batch printing database-stored HTML documents from javascript

Our users generate rich text content via an open source WYSIWYG javascript-based text editor (CKEditor). The HTML content is saved to our database and can be printed directly from the editor via its inbuilt print functionality (basically just window.print()) . This is great and works perfectly.

Now, we have a need to batch print saved documents and I am looking for workable solutions. There are various options that I can see, but all have large tradeoffs:

  1. User selects documents to print. JS code loops through documents and calls print one-by-one. The issue here is that the user will see a bunch of print dialogs. Which is painful. (Aside: we are using Chrome but I do not have the option of setting it to kiosk mode)

  2. User selects documents to print. JS code bines all of these in a single (hidden) container and they are all printed as one 'document'. These can be fairly big documents with tables, images, etc. I worry about the performance involved here as we could be adding a significant amount to the DOM.

  3. Similar to #2 above, but at some point the documents are converted and saved to a single PDF. This would be OK, but there don't seem to be many good/cost-effective options for converting HTML to PDF.

  4. Generate some kind of a report that can handle HTML content. I took a look at SQL Server reporting services but it supports a very limited set of HTML tags and CSS properties.

Is there a better way to batch print HTML content from javascript? Any help is very much appreciated!

Edit As per @Paul, I need to clarify a few points:

The content is that which is created in your standard online text editor. In my case:

  • No iframes
  • No animations
  • No dynamic content

Now, were I to print straight from the editor a print stylesheet would be applied, so this may plicate things a bit.

Share Improve this question edited Feb 24, 2017 at 21:28 JP. asked Feb 16, 2017 at 18:45 JP.JP. 5,6167 gold badges60 silver badges101 bronze badges 11
  • something like this? stackoverflow./a/13724670/2418529 – Nico Commented Feb 16, 2017 at 18:51
  • @NicolòCozzani This will suffer from the large DOM issue in #2. My concern is not opening a new window or not, it's a new Chrome print dialog or not. Thanks! – JP. Commented Feb 16, 2017 at 19:16
  • 1 I'm fine with people down voting, but would appreciate feedback to improve future questions. This seems like a reasonable on-topic question to me. – JP. Commented Feb 16, 2017 at 19:51
  • 1 The question is not clear because HTML can include inserted content, like <iframe>, dynamic content, like CSS animation, or content loaded or generated via JavaScript from <script> tags. It is not specified whether the conversion must handle all of these elements of HTML or merely a subset. The question also doesn't specify what has been tried or what is wrong with the way it is currently done beyond stating that manual approaches or multiple print dialogues are painful. For instance, have you tried an automated browser like selenium or phantomJS ? – Paul Commented Feb 19, 2017 at 3:20
  • Is requirement to print single .pdf or multiple .pdf documents? – guest271314 Commented Feb 20, 2017 at 7:21
 |  Show 6 more ments

2 Answers 2

Reset to default 7 +200

Since content could be potentially large and consume a lot of memory I would do this on server side. Select docs on client and request server to render those to PDFs e.g. utilising PhantomJS. This would then allow you to even use mobile clients to fetch PDFs.

I pletely agree with the answer above, PhantomJS would probably be the best option. The only problem with this is in terms of reliability PhantomJS has been pretty touch and go over the last few versions. If the size of the documents bee too large it may bee too much for Phantom to handle (remember it was originally designed for web testing purposes, and morphed into web automation). When writing the script for this, I would suggest following the outline below (to break up the processes into more manageable steps)

    var steps = [
  function() {
    // step 1
  },
  function() {
    // step 2
  }
]

Again, it's not a perfect option overall, but it is the best one we have to work with for now. If you have any questions feel free to reach out, I'm working on web automation myself so this will all be fresh in my mind.

Download for PhantomJS Here

发布评论

评论列表(0)

  1. 暂无评论