快捷導(dǎo)航

通過(guò)Golang實(shí)現(xiàn)無(wú)頭瀏覽器截圖

更新時(shí)間：2023年05月18日 09:33:24 作者：王中陽(yáng)Go

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

前言

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

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

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

什么是無(wú)頭瀏覽器

無(wú)頭瀏覽器（Headless Browser）是一種沒(méi)有圖形用戶界面的瀏覽器，它可以在后臺(tái)運(yùn)行，并通過(guò)編程接口來(lái)控制和操作瀏覽器。

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

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

在Golang中，可以使用chromedp和rod等庫(kù)來(lái)實(shí)現(xiàn)無(wú)頭瀏覽器截圖的功能。

使用chromedp

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

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

package?main

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

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

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

???//?設(shè)置瀏覽器選項(xiàng)
???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)建一個(gè)瀏覽器實(shí)例
???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?{
??????//?獲取頁(yè)面截圖
??????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庫(kù)創(chuàng)建了一個(gè)無(wú)頭瀏覽器實(shí)例，并導(dǎo)航到百度首頁(yè)。

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

運(yùn)行演示

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

go mod tidy
go run main.go

執(zhí)行效果如下：

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

使用rod庫(kù)

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

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

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()

?//簡(jiǎn)單模式，默認(rèn)截圖設(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庫(kù)創(chuàng)建了一個(gè)無(wú)頭瀏覽器實(shí)例，并導(dǎo)航到百度首頁(yè)。

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