[C#] PuppeteerSharp - 快照網頁並產出 PDF + 設定 PDF 格式

2023-02-15

Puppeteer-Sharp 是一個可以在.NET環境下運行的工具,它可以讓開發人員使用C#程式碼控制Headless Chrome或Chromium瀏覽器。

甚至你可以用自己的瀏覽器 ex.firefox

你可以透過這個工具來模擬人類使用瀏覽器的行為,像是瀏覽網頁、填寫表單、截圖或是生成PDF檔案。這篇文章將會介紹Puppeteer-Sharp 來將蝦皮某一個搜尋網頁

快照成 PDF,這套件有一個好處他自建瀏覽器核心,所以理論上應該是可以 Linux 運行,看一下網路上文件應該是沒啥問題。



之前參考過黑大之前寫的文章 C# 整合 Headless Chrome 的好工具 - Puppeteer Sharp 

但是我主要目的是要快拍成 PDF,如果你有這需求你也可以參考我另一篇文章  [C#] .NET 6 - 把網頁轉成 PDF 存為靜態檔案下載

說明一下這篇目的 我是要快照這個網址( https://shopee.tw/search?keyword=瓦蒙古 ),並且輸出成 PDF 留檔,順帶一提我這執行環境是 ASP.NET 6


1.引入  PuppeteerSharp 


2. 接下來就是程式碼的部分

var url = "https://shopee.tw/search?keyword=瓦蒙古"; using var browserFetcher = new BrowserFetcher(); await browserFetcher.DownloadAsync(BrowserFetcher.DefaultChromiumRevision); var browser = await Puppeteer.LaunchAsync(new LaunchOptions { Headless = true, IgnoreHTTPSErrors = true, //忽略 https 錯誤 DefaultViewport = ViewPortOptions.Default, }); var page = await browser.NewPageAsync(); await page.SetViewportAsync(new ViewPortOptions { Width = 1920, Height = 1280 }); //page.DefaultTimeout = 0; await page.GoToAsync(url); //稍微等一下,讓圖片 Load 完 Thread.Sleep(3 * 1000); var pdfOptions = new PuppeteerSharp.PdfOptions { DisplayHeaderFooter = true, Landscape = true, //畫面打橫 PrintBackground = true, Format = PaperFormat.A4, //A4 尺寸作底 MarginOptions = new MarginOptions { Top = "1cm", Bottom = "1cm", Left = "1cm", Right = "1cm" }, //處理 margin }; await page.PdfAsync(downloadPath + Path.DirectorySeparatorChar + "test91.pdf", pdfOptions); await browser.CloseAsync();


Result:


其實不難,不過中間很多地方測試了許久一些小細節要調整,測試花了我比較多時間,因為 蝦皮是一個大量透過 前端存取資料的網站

所以要花點時間讓他 render 所以也比較麻煩點

reference:

https://github.com/hardkoded/puppeteer-sharp

https://blog.csdn.net/weixin_35795357/article/details/118284770

https://blog.darkthread.net/blog/puppeteer-sharp/




當麻許的碎念筆記 2014 | Donma Hsu Design.