快捷導(dǎo)航

wkhtmltopdf 最好用Html轉(zhuǎn)pdf的工具

更新時(shí)間：2017年09月18日 23:29:10 作者：七度空間

這篇文章主要介紹了wkhtmltopdf 最好用Html轉(zhuǎn)pdf的工具,需要的朋友可以參考下

實(shí)習(xí)時(shí)公司需要把一些html頁面中的部分內(nèi)容生成pdf文件，然后我就找一些用php把html頁面圍成pdf文件的類。方法是可謂是找了很多很多，什么html2pdf,pdflib,FPDF這些都試過了，但是都沒有達(dá)到我要的求（主要是不能解決中文亂碼的問題以及樣式排版的問題）。

pdflib,FPDF 這兩個(gè)方法是需要編寫程序去生成pdf的，就也是講不支持直接把html頁面轉(zhuǎn)換成pdf；html2pdf這個(gè)雖然可以把html頁面轉(zhuǎn)換成pdf文件，但是它只能轉(zhuǎn)換一般簡單的html代碼，如果你的html內(nèi)容要的是通過后臺(tái)新聞編輯器排版的那肯定不行的。

糾結(jié)了半天，什么百度，谷歌搜索都用了，搜索了半天，功夫不負(fù)有心人，終于找到一個(gè)非常好用的方法了，下面就隆重介紹。

它就是：wkhtmltopdf，wkhtmltopdf可以直接把任何一個(gè)可以在瀏覽器中瀏覽的網(wǎng)頁直接轉(zhuǎn)換成一個(gè)pdf，首先說明一下它不是一個(gè)php 類，而是一個(gè)把html頁面轉(zhuǎn)換成pdf的一個(gè)軟件（需要安裝在服務(wù)器上），但是它并不是一個(gè)簡單的桌面軟件，而且它直接cmd批處理的，使用php中的 shell_exec()函數(shù)就可以調(diào)用它。下面就介紹如何用php+js+html來讓它生成pdf文件的方法（不過有個(gè)缺陷就是他需要在服務(wù)器端生成一個(gè)緩存文件，如果你使用thinkphp框架的話就可以將其緩存文件放在runtime 文件夾中暫存就行）。

一，下載并安裝wkhtmltopdf

1、下載地址：http://wkhtmltopdf.org/downloads.html 如圖：

這里寫圖片描述

2、上面有各種平臺(tái)下安裝的安裝包，英文不好的直接谷歌翻譯一下。下面以 windows7平臺(tái)上使用舉例，我的下載的是stable(穩(wěn)定版)的wkhtmltopdf-0.12.3.2-installer.exe這個(gè)版本，我在win7、win8 32位和64位以及win-sever上安裝測試都沒有問題的，系統(tǒng)時(shí)幾位就下載幾位的安裝包。下載好以后直接安裝就可以了，注意安裝路徑要知道，下面會(huì)用到的。

這里寫圖片描述
3、安裝好以后需要在系統(tǒng)環(huán)境變量變量名為”Path”的后添加：;D:\wkhtmltopdf\bin 也就是你安裝的目錄。安裝好以后重啟電腦。
下圖是如何設(shè)置環(huán)境變量：

打開我的電腦右鍵屬性

點(diǎn)擊高級(jí)系統(tǒng)設(shè)置

找到高級(jí)里面點(diǎn)擊環(huán)境變量

找到系統(tǒng)變量中的path，點(diǎn)擊編輯，將剛剛的安裝位置復(fù)制到最后，記得前面加一個(gè)分號(hào)哦！

找到系統(tǒng)變量中的path，點(diǎn)擊編輯，將剛剛的安裝位置復(fù)制到最后，記得前面加一個(gè)分號(hào)哦！
這里寫圖片描述

二，測試使用效果
直接在cmd里輸入：wkhtmltopdf http://www.baidu.com/ D:website1.pdf(注意中間有空格哈)
第一個(gè)是：運(yùn)行軟件名稱（這個(gè)是不變的）第二個(gè)是網(wǎng)址第三個(gè)是生成后的路徑及文件名?；剀嚭笫遣皇强瓷粋€(gè)生成進(jìn)度條的提示呢，恭喜您已經(jīng)成功了，到你的生成目錄里看看是不是有一個(gè)剛生成的pdf文件呢。
操作方法：1、windows鍵+r打開搜索框，輸入cmd,點(diǎn)擊確定

這里寫圖片描述

2、直接在cmd里輸入：wkhtmltopdf http://www.baidu.com/ D:website1.pdf(注意中間有空格哈)

這里寫圖片描述

3、點(diǎn)擊回車后，會(huì)看到一個(gè)進(jìn)度條，然后就提示轉(zhuǎn)換成功！

這里寫圖片描述

4、之后在相應(yīng)位置（即剛剛設(shè)置的D盤）中會(huì)發(fā)現(xiàn)多了一個(gè)Pdf文件，就說明成功了

這里寫圖片描述

三，php里調(diào)用

php里調(diào)用是很簡單的，用shell_exec這個(gè)函數(shù)就可以了，如果shell_exec函數(shù)不能用看看php.ini里是否補(bǔ)禁用了（找到php.ini中的shell_exec函數(shù)，取消注釋就可以了，一般都是可以直接用的）。簡單舉例：

<?php shell_exec("wkhtmltopdf http://www.dbjr.com.cn/ 1.pdf") ?>

你會(huì)發(fā)現(xiàn)在你php文件的同級(jí)目錄中會(huì)生成一個(gè)1.pdf的文件

下面代碼舉例介紹如何在網(wǎng)站開發(fā)中使用它：主要功能是截取網(wǎng)頁的部分傳遞到php中處理成pdf文檔

html頁面代碼：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
 <script src="js/jquery-2.1.4.min.js"></script>
 <link rel="stylesheet" href="css/common.css" rel="external nofollow" rel="external nofollow" >
 <link rel="stylesheet" href="css/myCenter.css" rel="external nofollow" rel="external nofollow" >
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>霍蘭德職業(yè)測試</title>
</head>
<body>
<!--startprint-->
<div class="right5"> 
    <div class="right_top" style="background-image:url(images/right-di.png);">
      <h3>霍蘭德測試報(bào)告</h3>
    </div>
    <div class="print">
      <input type="button" value="下載報(bào)告" id="down" class="print_btn">
    </div> 
    <div class="Hollander">
        <h6>MBTI測試結(jié)果：ESTJ</h6>
        <div id="chart"></div>
        <p>約翰·霍蘭德（John Holland）是美國約翰·霍普金斯大學(xué)心理學(xué)教授，美國著名的職業(yè)指導(dǎo)專家。霍蘭德以職業(yè)興趣理論為基礎(chǔ)，先后編制了職業(yè)偏好量表(VocatIonaI Preference lnventory)和自我導(dǎo)向搜尋表(Self-directed Search)兩種職業(yè)興趣量表，霍蘭德力求為每種職業(yè)興趣找出兩種相匹配的職業(yè)能力。興趣測試和能力測試的結(jié)合在職業(yè)指導(dǎo)和職業(yè)咨詢的實(shí)際操作中起到了促進(jìn)作用。</p>
    </div>  
    <table class="tbl1">
     <tbody>
      <tr node-type="toolBar">
        <td class="tbl11">領(lǐng)導(dǎo)模式:</td>
        <td class="tbl12">
          <p>①直接領(lǐng)導(dǎo)，快速管理 ②運(yùn)用過去經(jīng)驗(yàn)解決問題 ③直接、明確地識(shí)別問題的核心 ④決策和執(zhí)行決策非常迅速 ⑤傳統(tǒng)型領(lǐng)導(dǎo)，尊重組織內(nèi)部的等級(jí)和組織獲得的成就</p>
        </td>
       </td>
      </tr>
      <tr node-type="toolBar">
        <td class="tbl11">領(lǐng)導(dǎo)模式:</td>
        <td class="tbl12">
          <p>①直接領(lǐng)導(dǎo)，快速管理 ②運(yùn)用過去經(jīng)驗(yàn)解決問題 ③直接、明確地識(shí)別問題的核心 ④決策和執(zhí)行決策非常迅速 ⑤傳統(tǒng)型領(lǐng)導(dǎo)，尊重組織內(nèi)部的等級(jí)和組織獲得的成就</p>
        </td>
       </td>
      </tr>
      <tr node-type="toolBar">
        <td class="tbl11">領(lǐng)導(dǎo)模式:</td>
        <td class="tbl12">
          <p>①直接領(lǐng)導(dǎo)，快速管理 ②運(yùn)用過去經(jīng)驗(yàn)解決問題 ③直接、明確地識(shí)別問題的核心 ④決策和執(zhí)行決策非常迅速 ⑤傳統(tǒng)型領(lǐng)導(dǎo)，尊重組織內(nèi)部的等級(jí)和組織獲得的成就</p>
        </td>
       </td>
      </tr>
      <tr node-type="toolBar">
        <td class="tbl11">領(lǐng)導(dǎo)模式:</td>
        <td class="tbl12">
          <p>①直接領(lǐng)導(dǎo)，快速管理 ②運(yùn)用過去經(jīng)驗(yàn)解決問題 ③直接、明確地識(shí)別問題的核心 ④決策和執(zhí)行決策非常迅速 ⑤傳統(tǒng)型領(lǐng)導(dǎo)，尊重組織內(nèi)部的等級(jí)和組織獲得的成就</p>
        </td>
       </td>
      </tr>
      <tr node-type="toolBar">
        <td class="tbl11">適合報(bào)考專業(yè):</td>
        <td class="tbl12">
          <a><span>專業(yè)定位卡介紹>></span></a>
        </td>
       </td>
     </tr>
    </tbody>
   </table>  
</div>
<!--endprint-->
  <form action="pdf.php" method="post" name="hld_res" id="hideform">
   <input type="hidden" id="hide_content" name="html"/>
  </form> 
</body>
 <script>
  $(function () {
   //獲取需要傳遞的Html代碼 通過<!--startprint--><!--endprint-->截取
   bdhtml=window.document.body.innerHTML; 
   sprnstr="<!--startprint-->"; 
   eprnstr="<!--endprint-->"; 
   prnhtml=bdhtml.substr(bdhtml.indexOf(sprnstr)+17); 
   prnhtml=prnhtml.substring(0,prnhtml.indexOf(eprnstr)); 
   //將獲取的html代碼添加到隱藏域中傳給php文件處理
   $("#hide_content").val(""+prnhtml+"");
  } );  

  $("#down").click(function(){
   $("#hideform").submit();
  }); 

 </script>
</html>

php頁面：

<?php
  //轉(zhuǎn)成pdf
    $html=$_POST['html'];
    //Turn on output buffering
    ob_start();
    $html='
    <link rel="stylesheet" href="css/common.css" rel="external nofollow" rel="external nofollow" >
    <link rel="stylesheet" href="css/myCenter.css" rel="external nofollow" rel="external nofollow" >
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />'.$html;
    //這兒可以引入生成的Html的樣式表 路徑可以是絕對(duì)路徑也可以是相對(duì)路徑，也可以把樣式表文件復(fù)制到臨時(shí)html文件的目錄下 即這兒的demo文件目錄下（默認(rèn)） 也可以直接把樣式寫在html頁面中直接傳遞過來
    //$html = ob_get_contents();
    //$html=$html1.$html;
    $filename = "hld";

    //save the html page in tmp folder 保存的html臨時(shí)文件位置 可以是相對(duì)路徑也是可以是絕對(duì)路徑 下面用相對(duì)路徑
    file_put_contents("{$filename}.html", $html);

    //Clean the output buffer and turn off output buffering
    ob_end_clean();

    //convert HTML to PDF
    shell_exec("wkhtmltopdf -q {$filename}.html {$filename}.pdf");
    if(file_exists("{$filename}.pdf")){
      header("Content-type:application/pdf");
      header("Content-Disposition:attachment;filename={$filename}.pdf");
      echo file_get_contents("{$filename}.pdf");
      //echo "{$filename}.pdf";
    }else{
      exit;
    }
   ?>

點(diǎn)擊頁面中的下載按鈕，

這里寫圖片描述

是不是彈出一個(gè)下載提示，打開下載的pdf,是不是和網(wǎng)頁上的樣式一模一樣呢，

這里寫圖片描述

再打開Php文件中的文件保存位置，看看是不是多了兩個(gè)臨時(shí)文件呢？

這兩個(gè)臨時(shí)文件在哪兒，你的css就得在哪兒，或者你直接使用相對(duì)路徑，引用其他文件中的css樣式也可以的，最簡單的就是把css樣式直接寫在要轉(zhuǎn)成pdf的html頁面中。

這里寫圖片描述

如果存在樣式?jīng)]有，那就是你的樣式路徑?jīng)]有寫對(duì)，在檢查一下就可以了！

四，解決分頁問題

wkhtmltopdf 很好用，但也有些不盡人意。就是當(dāng)一個(gè)html頁面很長我需要在指定的地方分頁那怎么辦呢？ wkhtmltopdf 開發(fā)者在開發(fā)的時(shí)候并不是沒有考慮到這一點(diǎn)，wkhtmltopdf 有個(gè)很好的方法，就是在那個(gè)div的樣式后添加一個(gè)：page-break-inside:avoid;就ok了。

例如

div{ width:800px; min-height:1362px;margin:auto;page-break-inside:avoid;}

以上就是個(gè)人總結(jié)的轉(zhuǎn)pdf的方法，很多地方還可以擴(kuò)展，小伙伴們開動(dòng)腦筋動(dòng)起來吧，不過目前一直沒有解決就是沒法用中文名稱命名文件，如果有能解決的伙伴，麻煩在下面留言告知，謝謝么么噠了！