整合营销服务商

电脑端+手机端+微信端=数据同步管理

免费咨询热线:

java将html转为pdf


html转为pdf的组件有很多,但是还没有哪一款能达到这个效果,其只要原因是wkhtmltopdf使用webkit网页渲染引擎开发的用来将 html转成 pdf的工具,可以跟多种脚本语言进行集成来转换文档。但是就使用简便性来说还是itext等组件占据优势,如果你要转换格式有比较高的要求,那么wkhtmltopdf绝对是不二之选!

下载路径

官网地址 wkhtmltopdf.org/

github地址 github.com/wkhtmltopdf…

使用方法

  1. windows直接使用:只要在windows命令行中输入c:\wkhtmltopdf.exe my.oschina.net/papio/blog/… c:\blog.pdf 就可以把这篇文章转成pdf,并保存到C盘根目录。
  2. java调用:java中调用wkhtmltopdf的命令Runtime.getRuntime().exec("c:\wkhtmltopdf.exe my.oschina.net/papio/blog/… c:\blog.pdf")就可以实现转换。

java调用demo

public class HtmlToPdfInterceptor extends Thread { private InputStream is; public HtmlToPdfInterceptor(InputStream is){ this.is = is; } public void run(){ try{ InputStreamReader isr = new InputStreamReader(is, "utf-8"); BufferedReader br = new BufferedReader(isr); String line = null; while ((line = br.readLine()) != null) { System.out.println(line.toString()); //输出内容 } }catch (IOException e){ e.printStackTrace(); } }}public class HtmlToPdf { //wkhtmltopdf在系统中的路径 private static final String toPdfTool = "D:\wkhtmltopdf\bin\wkhtmltopdf.exe"; /** * html转pdf * @param srcPath html路径,可以是硬盘上的路径,也可以是网络路径 * @param destPath pdf保存路径 * @return 转换成功返回true */ public static boolean convert(String srcPath, String destPath){ File file = new File(destPath); File parent = file.getParentFile(); //如果pdf保存路径不存在,则创建路径 if(!parent.exists()){ parent.mkdirs(); } StringBuilder cmd = new StringBuilder(); cmd.append(toPdfTool); cmd.append(" "); cmd.append(" --header-line");//页眉下面的线 cmd.append(" --header-center 这里是页眉这里是页眉这里是页眉这里是页眉 ");//页眉中间内容 //cmd.append(" --margin-top 30mm ");//设置页面上边距 (default 10mm) cmd.append(" --header-spacing 10 ");//(设置页眉和内容的距离,默认0) cmd.append(srcPath); cmd.append(" "); cmd.append(destPath); boolean result = true; try{ Process proc = Runtime.getRuntime().exec(cmd.toString()); HtmlToPdfInterceptor error = new HtmlToPdfInterceptor(proc.getErrorStream()); HtmlToPdfInterceptor output = new HtmlToPdfInterceptor(proc.getInputStream()); error.start(); output.start(); proc.waitFor(); }catch(Exception e){ result = false; e.printStackTrace(); } return result; } public static void main(String[] args) { HtmlToPdf.convert("https://my.oschina.net/papio/blog/835645", "d:/wkhtmltopdf.pdf"); }}复制代码

wkhtmltopdf 参数详解

wkhtmltopdf [OPTIONS]... <input file> [More input files] <output file>常规选项 --allow <path> 允许加载从指定的文件夹中的文件或文件(可重复) --book* 设置一会打印一本书的时候,通常设置的选项 --collate 打印多份副本时整理 --cookie <name> <value> 设置一个额外的cookie(可重复) --cookie-jar <path> 读取和写入的Cookie,并在提供的cookie jar文件 --copies <number> 复印打印成pdf文件数(默认为1) --cover* <url> 使用HTML文件作为封面。它会带页眉和页脚的TOC之前插入 --custom-header <name> <value> 设置一个附加的HTTP头(可重复) --debug-javascript 显示的javascript调试输出 --default-header* 添加一个缺省的头部,与页面的左边的名称,页面数到右边,例如: --header-left '[webpage]' --header-right '[page]/[toPage]' --header-line --disable-external-links* 禁止生成链接到远程网页 --disable-internal-links* 禁止使用本地链接 --disable-javascript 禁止让网页执行JavaScript --disable-pdf-compression* 禁止在PDF对象使用无损压缩 --disable-smart-shrinking* 禁止使用WebKit的智能战略收缩,使像素/ DPI比没有不变 --disallow-local-file-access 禁止允许转换的本地文件读取其他本地文件,除非explecitily允许用 --allow --dpi <dpi> 显式更改DPI(这对基于X11的系统没有任何影响) --enable-plugins 启用已安装的插件(如Flash --encoding <encoding> 设置默认的文字编码 --extended-help 显示更广泛的帮助,详细介绍了不常见的命令开关 --forms* 打开HTML表单字段转换为PDF表单域 --grayscale PDF格式将在灰阶产生 --help Display help --htmldoc 输出程序HTML帮助 --ignore-load-errors 忽略claimes加载过程中已经遇到了一个错误页面 --lowquality 产生低品质的PDF/ PS。有用缩小结果文档的空间 --manpage 输出程序手册页 --margin-bottom <unitreal> 设置页面下边距 (default 10mm) --margin-left <unitreal> 将左边页边距 (default 10mm) --margin-right <unitreal> 设置页面右边距 (default 10mm) --margin-top <unitreal> 设置页面上边距 (default 10mm) --minimum-font-size <int> 最小字体大小 (default 5) --no-background 不打印背景 --orientation <orientation> 设置方向为横向或纵向 --page-height <unitreal> 页面高度 (default unit millimeter) --page-offset* <offset> 设置起始页码 (default 1) --page-size <size> 设置纸张大小: A4, Letter, etc. --page-width <unitreal> 页面宽度 (default unit millimeter) --password <password> HTTP验证密码 --post <name> <value> Add an additional post field (repeatable) --post-file <name> <path> Post an aditional file (repeatable) --print-media-type* 使用的打印介质类型,而不是屏幕 --proxy <proxy> 使用代理 --quiet Be less verbose --read-args-from-stdin 读取标准输入的命令行参数 --readme 输出程序自述 --redirect-delay <msec> 等待几毫秒为JS-重定向(default 200) --replace* <name> <value> 替换名称,值的页眉和页脚(可重复) --stop-slow-scripts 停止运行缓慢的JavaScripts --title <text> 生成的PDF文件的标题(第一个文档的标题使用,如果没有指定) --toc* 插入的内容的表中的文件的开头 --use-xserver* 使用X服务器(一些插件和其他的东西没有X11可能无法正常工作) --user-style-sheet <url> 指定用户的样式表,加载在每一页中 --username <username> HTTP认证的用户名 --version 输出版本信息退出 --zoom <float> 使用这个缩放因子 (default 1) 页眉和页脚选项--header-center* <text> (设置在中心位置的页眉内容) --header-font-name* <name> (default Arial) (设置页眉的字体名称)--header-font-size* <size> (设置页眉的字体大小)--header-html* <url> (添加一个HTML页眉,后面是网址)--header-left* <text> (左对齐的页眉文本)--header-line* (显示一条线在页眉下)--header-right* <text> (右对齐页眉文本)--header-spacing* <real> (设置页眉和内容的距离,默认0)--footer-center* <text> (设置在中心位置的页脚内容) --footer-font-name* <name> (设置页脚的字体名称) --footer-font-size* <size> (设置页脚的字体大小default 11)--footer-html* <url> (添加一个HTML页脚,后面是网址)--footer-left* <text> (左对齐的页脚文本)--footer-line* 显示一条线在页脚内容上)--footer-right* <text> (右对齐页脚文本)--footer-spacing* <real> (设置页脚和内容的距离)./wkhtmltopdf --footer-right '[page]/[topage]' http://www.baidu.com baidu.pdf./wkhtmltopdf --header-center '报表' --header-line --margin-top 2cm --header-line http://192.168.212.139/oma/ oma.pdf表内容选项中 --toc-depth* <level> Set the depth of the toc (default 3) --toc-disable-back-links* Do not link from section header to toc --toc-disable-links* Do not link from toc to sections --toc-font-name* <name> Set the font used for the toc (default Arial) --toc-header-font-name* <name> The font of the toc header (if unset use --toc-font-name) --toc-header-font-size* <size> The font size of the toc header (default 15) --toc-header-text* <text> The header text of the toc (default Table Of Contents) --toc-l1-font-size* <size> Set the font size on level 1 of the toc (default 12) --toc-l1-indentation* <num> Set indentation on level 1 of the toc (default 0) --toc-l2-font-size* <size> Set the font size on level 2 of the toc (default 10) --toc-l2-indentation* <num> Set indentation on level 2 of the toc (default 20) --toc-l3-font-size* <size> Set the font size on level 3 of the toc (default 8) --toc-l3-indentation* <num> Set indentation on level 3 of the toc (default 40) --toc-l4-font-size* <size> Set the font size on level 4 of the toc (default 6) --toc-l4-indentation* <num> Set indentation on level 4 of the toc (default 60) --toc-l5-font-size* <size> Set the font size on level 5 of the toc (default 4) --toc-l5-indentation* <num> Set indentation on level 5 of the toc (default 80) --toc-l6-font-size* <size> Set the font size on level 6 of the toc (default 2) --toc-l6-indentation* <num> Set indentation on level 6 of the toc (default 100) --toc-l7-font-size* <size> Set the font size on level 7 of the toc (default 0) --toc-l7-indentation* <num> Set indentation on level 7 of the toc (default 120) --toc-no-dots* Do not use dots, in the toc轮廓选项 --dump-outline <file> 转储目录到一个文件 --outline 显示目录(文章中h1,h2来定) --outline-depth <level> 设置目录的深度(默认为4)页脚和页眉 * [page] 由当前正在打印的页的数目代替 * [frompage] 由要打印的第一页的数量取代 * [topage] 由最后一页要打印的数量取代 * [webpage] 通过正在打印的页面的URL替换 * [section] 由当前节的名称替换 * [subsection] 由当前小节的名称替换 * [date] 由当前日期系统的本地格式取代 * [time] 由当前时间,系统的本地格式取代
作者:曹元
链接:https://juejin.im/post/6856547881873047559
来源:掘金
著作权归作者所有。商业转载请联系作者获得授权,非商业转载请注明出处。

HTML文件中,有些标签会被经常用到,可能有人觉得太基础,就不认真对待,但是我可以负责任的告诉你,越基础的往往越重要。这次重点学一学标题、段落和链接等基础标签。

为了不重复粘贴HTML代码,咱们来个约定,除了第一次出现完整的HTML文件的页面结构之外,之后只现新增的标签内容,你自己将新的内容,添加到HTML文件中,进行效果验证。

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>第3个HTML文件</title>
</head>
<body>
<!--这是一个完整的HTML页面结构,常用标签放在这个注释后面即可-->
</body>
</html>

3.1 标题<h1>~

在HTML中,标题从一级到六级,对应标签为<h1>到<h6>,字体逐步变小。属性为align(对齐方式),属性值为left(左对齐,默认)、right(右对齐)和center(居中对齐)。

<h1 align="center">一级标题</h1>
<h2 align="center">二级标题</h2>
<h3>三级标题</h3>
<h4 align="left">四级标题</h4>
<h5 align="right">五级标题</h5>
<h6 align="right">六级标题</h6>

输出结果


3.2 段落<p>

<p> 标签定义段落。浏览器解析到<p>标签时,会自动在其前后创建一些空白。<p>标签的属性也是align。其实为了HTML文件统一布局,很少会用align来指定位置,大多数是用CSS统一指定。

<p>老陈说编程,除了说编程,</p>
<p>还有程序员的爱情与友情,</p>
<p>那是不可能的。</p>

输出结果


3.3 水平线和换行

在网页发的文字多时,好多人习惯性会使用分割线。在HTML,用<hr/>单标签就可以实现分割线。而换行,则用<br/>标签。<hr>标签属性有表示位置的align、高度的的size和宽度width三个属性,其中size和width的单位是像素,但如果用到这些属性的话,推荐用CSS。

<hr size="1"/>
小舅子要结婚了,丈母娘跟我借了10万块钱做彩礼,结果婚事谈崩了。<br/>
今天公司急用钱,我向丈母娘要那10万块钱。<br/>
丈母娘说:借你这10万块钱是干啥用的?<br/>
我说:给小舅子结婚用啊!<br/>
丈母娘说:那婚结成了吗?<br/>
我说:没结成。<br/>
丈母娘大声骂道:婚都没结成你还有脸来要钱!<br/>
突然感觉丈母娘这话说的没什么毛病啊!
<hr size="1"/>

输出结果

3.4 列表<ul>和<ol>

无序列表<ul>标签,可用粗体圆点标记一个项目的列表;有序列表<ol>标签使用数字进行标记,而列表项用<li>标签实现。有关列表的属性,不是被H5抛弃,就是不被推荐,所以......。

<p>
    程序员最喜欢做的三件事
<ul>
    <li>编程</li>
    <li>开发</li>
    <li>敲代码</li>
</ul>
程序员最喜欢的三个美女
<ol>
    <li>潘金莲</li>
    <li>杨贵妃</li>
    <li>杨八妹</li>
</ol>
</p>

输出结果

3.5 超链接<a>

<a>标签定义超链接,用于从一个页面链接到另一个页面。最重要的属性是 href和target, href指定链接的目标(网页地址),target指定打开窗口的模式,_blank:打开新窗口,_parent:在父窗口中打开,_self:默认,当前页面跳转,_top:在当前窗体打开链接,并替换当前的整个窗体。

在没点击链接之前,你先看一下链接内容的字体颜色,点击链接之后,你再看一下,你就会发现,链接内容的颜色会有所变化。

(1) 未被访问的链接带有下划线而且是蓝色的;

(2) 已被访问的链接带有下划线而且是紫色的;

(3) 活动链接带有下划线而且是红色的。

<a href="demo1.html">去到老陈说HTML的第1个Demo中</a>

输出结果


好了,有关html基础标签的内容,老陈讲完了,如果觉得对你有所帮助,希望老铁能转发点赞,让更多的人看到这篇文章。你的转发和点赞,就是对老陈继续创作和分享最大的鼓励。

一个当了10年技术总监的老家伙,分享多年的编程经验。想学编程的朋友,可关注:老陈说编程。分享Python,前端(小程序)、App和嵌入式方面的干货。关注我,没错的。

#前端##HTML##程序员##编程##CSS#

TML基础


  1. HTML基本知识与结构
  2. HTML常见标签
  3. 标签写法与嵌套的讨论

HTML、CSS、javascript三者的关系


  1. HTML是网页内容的载体。内容就是网页制作者放在页面上想要让用户浏览的信息,可以包含文字、图片、视频等。
  2. CSS样式是表现。就像网页的外衣。比如,标题字体、颜色变化,或为标题加入背景图片、边框等。所有这些用来改变内容外观的东西称之为表现。
  3. JavaScript是用来实现网页上的特效效果。如:鼠标滑过弹出下拉菜单。或鼠标滑过表格的背景颜色改变。还有焦点新闻(新闻图片)的轮换。可以这么理解,有动画的,有交互的一般都是用JavaScript来实现的。

<!DOCTYPE HTML>

指示 web 浏览器关于页面使用哪个 HTML 版本进行编写,必须写在所有代码的第一行!

如果你的页面添加了<!DOCTYPE html>,那么就等同于开启了标准模式,那么浏览器就得老老实实的按照W3C的标准解析渲染页面,这样一来,你的页面在所有的浏览器里显示的就都是一个样子了。

这个属性会被浏览器识别并使用,但是如果你的页面没有DOCTYPE的声明,浏览器按照自己的方式解析渲染页面,那么,在不同的浏览器就会显示不同的样式。

这就是<!DOCTYPE html>的作用。

固定结构


结构如下:

<html>
 <head>...</head>
 <body>...</body>
</html>

代码讲解:

  • <html></html>称为根标签,所有的网页标签都在<html></html>中。
  • <head> 标签用于定义文档的头部,它是所有头部元素的容器。头部元素有<title>、<script>、 <style>、<link>、 <meta>等标签,头部标签在下一小节中会有详细介绍。
  • 在<body>和</body>标签之间的内容是网页的主要内容,如<h1>、<p>、<a>、<img>等网页内容标签,在这里的标签中的内容会在浏览器中显示出来。
  • 为 html 文档加上使用的语言类型说明

在很多国际化的网站中会使用到!<html lang="zh-CN"> </html>告诉浏览器等设备,语言使用以中文为显示和阅读基础!英文使用 en

head标签


下面我们来了解一下<head>标签的作用。文档的头部描述了文档的各种属性和信息,包括文档的标题等。绝大多数文档头部包含的数据都不会真正作为内容显示给读者。

下面这些标签可用在 head 部分:

<head>
 <title>...</title>
 <meta>
 <link>
 <style>...</style>
 <script>...</script>
</head>

<title>标签:

  • 在<title>和</title>标签之间的文字内容是网页的标题信息,它会出现在浏览器的标题栏中。网页的title标签用于告诉用户和搜索引擎这个网页的主要内容是什么,搜索引擎可以通过网页标题,迅速的判断出网页的主题。每个网页的内容都是不同的,每个网页都应该有一个独一无二的title。

meta标签

  • meta是html中的元标签,其中包含了对应html的相关信息,客户端浏览器或服务器端的程序会根据这些信息进行处理。
  • HTTP-EQUIV类似于HTTP的头部协议,它回应给浏览器一些有用的信息,以帮助正确和精确地显示网页内容。
  • content(内容类型):重要!!这个网页的格式是文本的,网页模式
  • charset(编码):特别重要!!!这个网页的编码是utf-8,中文编码,需要注意的是这个是网页内容的编码,而不是文件本身的,其他类型的编码中文可能会出现乱码。
  • http-equiv="Content-Type" 表示描述文档类型

content="text/HTML; 文档类型,这里为html,如果JS就是text/javascript,

charset=utf-8 页面字符集,编码,eg:gb2312,iso-8859-1,utf-8

  • meta标签

meta是html语言head区的一个辅助性标签。几乎所有的网页里,我们可以看到类似下 面这段的html代码:

<head> 
 <meta http-equiv="content-Type" content="text/html; charset=gb2312"> 
</head>

也许你认为这些代码可有可无。其实如果你能够用好meta标签,会给你带来意想不到的效果,例如加入关键字会自动被大型搜索网站自动搜集;可以设定页面格式及刷新等等。

  • meta标签的组成

meta标签共有两个属性,它们分别是http-equiv属性和name属性,不同的属性又有不同的参数值,这些不同的参数值就实现了不同的网页功能。

1、name属性

name属性主要用于描述网页,与之对应的属性值为content,content中的内容主要是便于搜索引擎机器人查找信息和分类信息用的。

meta标签的name属性语法格式是:

<meta name="参数" content="具体的参数值"> 

其中name属性主要有以下几种参数:

1)Keywords(关键字)
  说明:keywords用来告诉搜索引擎你网页的关键字是什么。
  举例:
 <meta name ="keywords" content="science, education,culture,politics,ecnomics,relationships, entertaiment, human">
2)description(网站内容描述)
  说明:description用来告诉搜索引擎你的网站主要内容。
  举例:
 <meta name="description" content="This page is about the meaning of science, education,culture.">
3)robots(机器人向导)
  说明:robots用来告诉搜索机器人哪些页面需要索引,哪些页面不需要索引。
  content的参数有all,none,index,noindex,follow,nofollow。默认是all。
  举例:
 <meta name="robots" content="none">
4)author(作者)
  说明:标注网页的作者
  举例:
 <meta name="author" content="root,root@21cn.com">

2、http-equiv属性

http-equiv顾名思义,相当于http的文件头作用,它可以向浏览器传回一些有用的信息,以帮助正确和精确地显示网页内容,与之对应的属性值为content,content中的内容其实就是各个参数的变量值。

meta标签的http-equiv属性语法格式是:

 <meta http-equiv="参数" content="参数变量值">

其中http-equiv属性主要有以下几种参数:

1)Expires(期限)
  说明:可以用于设定网页的到期时间。一旦网页过期,必须到服务器上重新传输。
  用法:
 <meta http-equiv="expires" content="Fri, 12 Jan 2001 18:18:18 GMT">
  注意:必须使用GMT的时间格式。
2)Pragma(cache模式)
  说明:禁止浏览器从本地计算机的缓存中访问页面内容。
  用法:
 <meta http-equiv="Pragma" content="no-cache">
  注意:这样设定,访问者将无法脱机浏览。
3)Refresh(刷新)
  说明:自动刷新并指向新页面。
  用法:
 <meta http-equiv="Refresh" content="2;URL=http://www.root.net">(注意后面的引号,分别在秒数的前面和网址的后面)
  注意:其中的2是指停留2秒钟后自动刷新到URL网址。
4)Set-Cookie(cookie设定)
  说明:如果网页过期,那么存盘的cookie将被删除。
  用法:
 <meta http-equiv="Set-Cookie" content="cookievalue=xxx; expires=Friday, 12-Jan-2001 18:18:18 GMT; path=/">
  注意:必须使用GMT的时间格式。
5)Window-target(显示窗口的设定)
  说明:强制页面在当前窗口以独立页面显示。
  用法:
 <meta http-equiv="Window-target" content="_top">
  注意:用来防止别人在框架里调用自己的页面。
6)content-Type(显示字符集的设定)
  说明:设定页面使用的字符集。
  用法:
 <meta http-equiv="content-Type" content="text/html; charset=gb2312">
7)content-Language(显示语言的设定)
  用法:
 <meta http-equiv="Content-Language" content="zh-cn" />

meta标签的功能

  • 帮助主页被各大搜索引擎登录;
  • 定义页面的使用语言
  • 自动刷新并指向新的页面
  • 实现网页转换时的动画效果
  • 控制页面缓冲
  • 控制网页显示的窗口

3、style中的属性

  • font-size:数值px; 文字大小控制
  • color:#六进制的颜色值; 文字颜色控制
  • text-align:left/center/right; 文字的居左、居中、居右控制。

标题标签


文章的段落用<p>标签,那么文章的标题用什么标签呢?下面我们将使用<hx>标签来制作文章的标题。

标题标签一共有6个,h1、h2、h3、h4、h5、h6分别为一级标题、二级标题、三级标题、四级标题、五级标题、六级标题。并且依据重要性递减。<h1>是最高的等级。

语法:

<hx>标题文本</hx> (x为1-6)

文章的标题前面已经说过了,可以使用标题标签,另外网页上的各个栏目的标题也可使用它们。

例如:

<body>
 <h1>一级标题</h1>
 <h2>二级标题</h2>
 <h3>三级标题</h3>
 <h4>四级标题</h4>
 <h5>五级标题</h4>
</body>

HTML注释


代码注释的作用是帮助程序员标注代码的用途,过一段时间后再看你所编写的代码,就能很快想起这段代码的用途。代码注释不仅方便程序员自己回忆起以前代码的用途,还可以帮助其他程序员很快的读懂你的程序的功能,方便多人合作开发网页代码。

<!--注释文字 -->

语义化


标签的用途:我们学习网页制作时,常常会听到一个词,语义化。那么什么叫做语义化呢,说的通俗点就是:明白每个标签的用途(在什么情况下使用此标签合理)比如,网页上的文章的标题就可以用标题标签,网页上的各个栏目的栏目名称也可以使用标题标签。文章中内容的段落就得放在段落标签中,在文章中有想强调的文本,就可以使用 em 标签表示强调等等。

讲了这么多语义化,但是语义化可以给我们带来什么样的好处呢?

  1. 更容易被搜索引擎收录。
  2. 更容易让屏幕阅读器读出网页内容。

后面会带领大家学习了解html中每个标签的语义(用途)。

喜欢前端的小伙伴们可以在评论区留言,寻找和小冯童鞋一样热爱前端的友人,让我们一起玩转前端的世界!