網頁轉pdf，這個工具真好用

兩天有個客戶需要把網頁轉為pdf，之前也沒開發過類似的工具，就在百度搜索了一波，主要有下面三種

在線轉pdf
使用瀏覽器打印功能轉pdf
使用本地軟件工具轉pdf

在線轉pdf

在百度（我一般用必應）搜索“在線網頁轉pdf”就有很多可以做這個事的網站，免費的如

PDF24Tools

各種pdf的操作都有，免費使用，速度一般。

官網地址https://tools.pdf24.org/zh

PDF24 Tools

doctron

開源免費項目，使用golang寫的，提供在線轉

官網地址http://doctron.lampnick.com/

doctron在線體驗demo

還有挺多其他的，可以自己搜索，但是都不符合我的預期。

使用瀏覽器打印功能轉pdf

在瀏覽器右鍵，點擊打印或者ctrl+p
在彈出的打印對話框中找到目標打印機選擇“另存為PDF”
點擊“保存”按鈕即可下載pdf了

使用本地軟件工具轉pdf

Doctron，這是我今天要介紹的重頭戲。

Doctron是基于Docker、無狀態、簡單、快速、高質量的文檔轉換服務。目前支持將html轉為pdf、圖片(使用chrome(Chromium)瀏覽器內核，保證轉換質量)。支持PDF添加水印。

使用chrome內核保證高質量將HTML轉為pdf/圖片。
簡易部署(提供docker鏡像,Dockerfile以及k8s yaml配置文件)。支持豐富的轉換參數。轉為pdf和圖片支持自定義大小。
無狀態服務支持。

管他的，先把代碼下載下來再說

git clone https://gitcode.net/mirrors/lampnick/doctron.git

倉庫

運行

go build
./doctron --config conf/default.yaml

運行截圖

轉pdf，訪問http://127.0.0.1:8080/convert/html2pdf?u=doctron&p=lampnick&url=<url>，更換鏈接中的url為你需要轉換的url即可。

轉換效果

然后就可以寫程序去批量轉換需要的網頁了，但是我需要轉換的網頁有兩個需求

1、網站需要會員登錄，不然只能看得到一部分

2、需要把網站的頭和尾去掉的

這就為難我了，不會go語言啊，硬著頭皮搞了，肯定有個地方打開這個url的，就去代碼慢慢找，慢慢調試，功夫不負有心人，終于找到調用的地方了。

第一步：添加網站用戶登錄cookie

添加cookie之前

添加cookie之后

第二步：去掉網站頭尾

chromedp.Evaluate(`$('.header').css("display" , "none");
		$('.btn-group').css("display" , "none");
		$('.container .container:first').css("display" , "none");
		$('.breadcrumb').css("display" , "none");
		$('.footer').css("display" , "none")`, &ins.buf),

打開網頁后執行js代碼把頭尾隱藏掉

第三步：程序化，批量自動生成pdf

public static void createPDF(String folder , String cl ,  String pdfFile, String urlhref) {
        try {
            String fileName = pdfFile.replace("/", ":");
            String filePath = folder + fileName;
            File srcFile = new File(filePath);
            File newFolder = new File("/Volumes/disk2/myproject" + File.separator + cl);
            File destFile = new File(newFolder, fileName);
            if(destFile.exists()){
                return;
            }
            if(srcFile.exists()){
                //移動到對應目錄
                if(!newFolder.exists()){
                    newFolder.mkdirs();
                }
                FileUtils.moveFile(srcFile , destFile);
                return;
            }
            if(!newFolder.exists()){
                newFolder.mkdirs();
            }
            String url = "http://127.0.0.1:8888/convert/html2pdf?u=doctron&p=lampnick&url="+urlhref;
            HttpEntity<String> entity = new HttpEntity<String>(null, null);
            RestTemplate restTemplate = new RestTemplate();
            ResponseEntity<byte[]> bytes = restTemplate.exchange(url, HttpMethod.GET, entity, byte[].class);
            if (bytes.getBody().length <= 100) {
                if(urlList.containsKey(urlhref)){
                    Integer failCount = urlList.get(urlhref);
                    if(failCount > 3){
                        System.out.println("下載失敗：" + cl + " / " + pdfFile +"  " + urlhref);
                        return;
                    }
                    failCount++;
                    urlList.put(urlhref , failCount);
                }else{
                    urlList.put(urlhref , 1);
                }

                createPDF(folder , cl ,  pdfFile , urlhref);
            }else{
                if (!destFile.exists()) {
                    try {
                        destFile.createNewFile();
                    } catch (Exception e) {
                        e.printStackTrace();
                    }
                }
                try (FileOutputStream out = new FileOutputStream(destFile);) {
                    out.write(bytes.getBody(), 0, bytes.getBody().length);
                    out.flush();
                } catch (Exception e) {
                    e.printStackTrace();
                }
            }
        } catch (Exception e) {
            e.printStackTrace();
        }
    }

最終成果：

文件夾分類存放

pdf文件

排提示：本期內容所用軟件為“Adobe Acrobat Pro DC 2019”

寫在前面

再看到喜歡的網頁時，我們可能會想要收藏，也可能使用OneNote或者印象筆記轉存這些網頁。

而在碰到Acrobat之后，我們又多了另外一個選擇。

將網頁直接轉存為PDF。

Acrobat將網頁轉存為PDF有兩種方法。

下面我們來逐一介紹。

方法一：根據網頁地址創建PDF

功能位置：工具 >> 創建PDF >> 網頁

點擊“創建PDF”工具，切換頁面后，點擊左側的“網頁”選項。

根據網頁創建PDF

Acrobat提示我們輸入一個URL地址，將某個網頁鏈接復制到這里。

可以勾選“捕捉多層”，軟件會展開更多選項。

“獲取N層”和“獲取整個網站”只能二選一。因為某個網站會包含多個超鏈接，前者可限制轉換的超鏈接數量，后者會獲取全部網站的超鏈接。（毫無疑問，網頁在轉換PDF時，后者會花費更多的時間）
勾選“停留在同一路徑”的話，軟件僅轉換“隸屬于所填URL的網頁”；
勾選“停留在同一服務器”的話，軟件僅轉換“同一服務器上的網頁”；
“高級設置”可以對轉換后的PDF，進行頁面大小，縮放等等參數的設置，不再贅述。

轉換網頁參數

參數設置完畢，點擊“創建”即可。

等待數秒，Acrobat會自動打開轉換成功的PDF。

軟件在識別網頁CSS樣式時，會存在一定的缺陷，但網頁主體內容可以被完美轉換。

轉換效果

方法二：使用瀏覽器插件轉換PDF

安裝Acrobat DC時，會自動為IE、Google Chrome 和Firefox這三款瀏覽器添加“Adoba Arcobat”這款插件。（限Windows系統）

下面以Firefox瀏覽器為例，利用插件將某個網頁轉存為PDF。

首先在右上角的選項菜單中找到“附件組件”。

附件組件

確保“Adoba Arcobat”插件為啟用狀態。

啟用Adobe Acrobat

這時在工具欄就可以看到插件圖標了。

通過瀏覽器隨便訪問一個網站，在右鍵菜單中就會發現“Adobe Acrobat” >> “將網頁轉換為Adobe PDF”選項。

點擊后，只需要選擇一個存儲路徑，等待數秒轉換即可完成。

不需要人為再次介入，要比第一種方法更加高效。

這種方式有點類似于“網頁內容轉存至云筆記”。

一冊君在測試知乎的網頁時，有的內容可以轉存成功，而有的不可以。

希望大家留意到這一點。

總結

今天，我們介紹了使用“Acrobat”轉存網頁為PDF文件的方法。

通過“工具 >> 創建PDF >> 網頁”，在軟件內部通過網頁鏈接直接轉存；
安裝“Acrobat”后，IE，Chrome，Firefox三款瀏覽器會安裝“Acrobat插件”，插件提供了“將網頁轉換為Adobe PDF”功能。此方式更加簡單直觀，但支持的瀏覽器有限；

以上。

如果你喜歡“一冊筆記”，請記得分享，點贊和關注。

未完待續。。。

TML即超文本標記語言是一種用于創建網頁的標準標記語言。對于初學者來說一般可以使用工具來生成html，如：DW，HB等，這些都是所見即所得的工具，在設計視圖將需要展現的文字、段落、圖片等內容通過軟件排好版，在代碼視圖將由軟件自動生成對應的HTML代碼，這些代碼由客戶電腦上的瀏覽來解析執行。

HTML語言是一種優美的語言，幾乎所有的標記都是成對出現的，配合CSS樣式和JS腳本來控制頁面顯示的樣式及效果。有一定開發經驗的高手往往可以直接用代碼視圖來編寫網頁，不管是軟件生成html還是手寫HTML代碼最終顯示的效果都是一致的。如下圖是由DW設計的網頁，下方代碼對應的就是HTML代碼，視圖效果和代碼是一一對應的。

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

在線咨詢

上一篇：深入淺出超好用的 CSS 陰影技巧
下一篇：HTML5廢除的元素

您的項目需求

*請認真填寫需求信息，我們會在24小時內與您取得聯系。

整合營銷服務商