通過Golang實現(xiàn)無頭瀏覽器截圖

更新時間：2023年05月18日 09:33:24 作者：王中陽Go

在Web開發(fā)中，有時需要對網(wǎng)頁進行截圖，以便進行頁面預(yù)覽、測試等操作，本文為大家整理了Golang實現(xiàn)無頭瀏覽器的截圖的方法，感興趣的可以了解一下

前言

在Web開發(fā)中，有時需要對網(wǎng)頁進行截圖，以便進行頁面預(yù)覽、測試等操作。

而使用無頭瀏覽器來實現(xiàn)截圖功能，可以避免手動操作的繁瑣和不穩(wěn)定性。

這篇文章將介紹：使用Golang進行無頭瀏覽器的截圖，輕松實現(xiàn)頁面預(yù)覽、測試和模擬用戶操作。

什么是無頭瀏覽器

無頭瀏覽器（Headless Browser）是一種沒有圖形用戶界面的瀏覽器，它可以在后臺運行，并通過編程接口來控制和操作瀏覽器。

無頭瀏覽器通常用于自動化測試、網(wǎng)頁截圖、爬蟲等場景，可以幫助我們更方便地進行網(wǎng)頁操作和數(shù)據(jù)采集。

常見的無頭瀏覽器包括Chrome Headless、PhantomJS、Puppeteer等。

在Golang中，可以使用chromedp和rod等庫來實現(xiàn)無頭瀏覽器截圖的功能。

使用chromedp

chromedp是一個基于Chrome或Chromium瀏覽器的DevTools協(xié)議的庫，可以方便地控制瀏覽器進行截圖、模擬用戶操作等功能。

以下是使用chromedp庫實現(xiàn)無頭瀏覽器截圖的示例代碼：

package?main

import?(
???"context"
???"io/ioutil"
???"log"
???"time"

???"github.com/chromedp/cdproto/page"
???"github.com/chromedp/chromedp"
)

func?main()?{
???//?創(chuàng)建一個上下文
???ctx,?cancel?:=?chromedp.NewContext(context.Background())
???defer?cancel()

???//?設(shè)置瀏覽器選項
???opts?:=?append(chromedp.DefaultExecAllocatorOptions[:],
??????chromedp.Flag("headless",?true),
??????chromedp.Flag("disable-gpu",?true),
??????chromedp.Flag("no-sandbox",?true),
??????chromedp.Flag("disable-dev-shm-usage",?true),
??????chromedp.Flag("remote-debugging-port",?"9222"),
???)
???allocCtx,?cancel?:=?chromedp.NewExecAllocator(ctx,?opts...)
???defer?cancel()

???//?創(chuàng)建一個瀏覽器實例
???ctx,?cancel?=?chromedp.NewContext(allocCtx)
???defer?cancel()

???//?導(dǎo)航到指定的URL
???var?buf?[]byte
???err?:=?chromedp.Run(ctx,?chromedp.Navigate("https://www.baidu.com"),?chromedp.Sleep(2*time.Second),?chromedp.ActionFunc(func(ctx?context.Context)?error?{
??????//?獲取頁面截圖
??????var?err?error
??????buf,?err?=?page.CaptureScreenshot().WithQuality(90).WithClip(&page.Viewport{X:?0,?Y:?0,?Width:?1920,?Height:?1080,?Scale:?1}).Do(ctx)
??????if?err?!=?nil?{
?????????return?err
??????}
??????return?nil
???}))
???if?err?!=?nil?{
??????log.Fatal(err)
???}
???//?將截圖保存到文件
???err?=?ioutil.WriteFile("screenshot.png",?buf,?0644)
???if?err?!=?nil?{
??????log.Fatal(err)
???}
}

這段代碼使用chromedp庫創(chuàng)建了一個無頭瀏覽器實例，并導(dǎo)航到百度首頁。

然后使用page.CaptureScreenshot()函數(shù)獲取頁面截圖，并將截圖保存到screenshot.png文件中。

運行演示

把我上面的代碼復(fù)制到main.go文件中，安裝依賴直接運行即可：

go mod tidy
go run main.go

執(zhí)行效果如下：

需要注意的是，使用chromedp庫需要先安裝Chrome或Chromium瀏覽器，并將其添加到系統(tǒng)的環(huán)境變量中。

使用rod庫

rod是另一個基于Chrome或Chromium瀏覽器的DevTools協(xié)議的庫，可以方便地控制瀏覽器進行截圖、模擬用戶操作等功能。

以下是使用rod庫實現(xiàn)無頭瀏覽器截圖的示例代碼：

package?main

import?(
?"github.com/go-rod/rod"
?"github.com/go-rod/rod/lib/proto"
?"github.com/go-rod/rod/lib/utils"
?"github.com/ysmood/gson"
)

func?main()?{
?page?:=?rod.New().MustConnect().MustPage("https://baidu.com").MustWaitLoad()

?//簡單模式，默認截圖設(shè)置
?page.MustScreenshot("my.png")

?//自定義截圖設(shè)置
?img,?_?:=?page.Screenshot(true,?&proto.PageCaptureScreenshot{
??Format:??proto.PageCaptureScreenshotFormatJpeg,
??Quality:?gson.Int(90),
??Clip:?&proto.PageViewport{
???X:??????0,
???Y:??????0,
???Width:??300,
???Height:?200,
???Scale:??1,
??},
??FromSurface:?true,
?})
?_?=?utils.OutputFile("my.jpg",?img)
}

這段代碼使用rod庫創(chuàng)建了一個無頭瀏覽器實例，并導(dǎo)航到百度首頁。

然后使用page.MustScreenshot()函數(shù)獲取頁面截圖，并將截圖保存到my.png文件中。