×

Take a Screenshot of a Webpage with Headless Chrome

Falcon 2020-06-24 views:
自动摘要

正在生成中……

In this post we will look at leveraging Chrome’s debug protocol to load up a webpage and take a screenshot. This is all made possible from a package called chromedp which allows us to control a Chrome instance through our Go code. You will also need Chrome installed or to be using something akin to the chrome/headless-shell docker image.

We’ve split the process in code up into:

  • Start Chrome
  • Run tasks: like loading the webpage and taking a screenshot
  • Saving the screenshot to file

package main

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

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

func main() {

	// Start Chrome
	// Remove the 2nd param if you don't need debug information logged
	ctx, cancel := chromedp.NewContext(context.Background(), chromedp.WithDebugf(log.Printf))
	defer cancel()

	url := "https://golangcode.com/"
	filename := "golangcode.png"

	// Run Tasks
	// List of actions to run in sequence (which also fills our image buffer)
	var imageBuf []byte
	if err := chromedp.Run(ctx, ScreenshotTasks(url, &imageBuf)); err != nil {
		log.Fatal(err)
	}

	// Write our image to file
	if err := ioutil.WriteFile(filename, imageBuf, 0644); err != nil {
		log.Fatal(err)
	}
}

func ScreenshotTasks(url string, imageBuf *[]byte) chromedp.Tasks {
	return chromedp.Tasks{
		chromedp.Navigate(url),
		chromedp.ActionFunc(func(ctx context.Context) (err error) {
			*imageBuf, err = page.CaptureScreenshot().WithQuality(90).Do(ctx)
			return err
		}),
	}
}

take screenshot with headless chrome

As an added bonus, if you wanted to save the page as a pdf instead of an image, you can replace the CaptureScreenshot line with following:

1
*imageBuf, _, err = page.PrintToPDF().WithPrintBackground(false).Do(ctx)