还有这种骚操作:使用Golang实现无头浏览器浏览和截图

简介: 还有这种骚操作:使用Golang实现无头浏览器浏览和截图

前言

在Web开发中,有时需要对网页进行截图,以便进行页面预览、测试等操作。

而使用无头浏览器来实现截图功能,可以避免手动操作的繁琐和不稳定性。

这篇文章将介绍:使用Golang进行无头浏览器的截图,轻松实现页面预览、测试和模拟用户操作。

有趣

这篇文章发完,有朋友在朋友圈留言说:没想到还有这种骚操作~

还有朋友思路打开了:问我能不能自动实现移动滑块识别验证、能不能实现自动登录?

什么是无头浏览器

无头浏览器(Headless Browser)是一种没有图形用户界面的浏览器,它可以在后台运行,并通过编程接口来控制和操作浏览器。

无头浏览器通常用于自动化测试、网页截图、爬虫等场景,可以帮助我们更方便地进行网页操作和数据采集。

常见的无头浏览器包括Chrome Headless、PhantomJS、Puppeteer等。

在Golang中,可以使用chromedprod等库来实现无头浏览器截图的功能。

更多场景

使用Golang实现无头浏览器截图可以在很多场景下发挥作用,以下是一些常见的场景:

  1. 网页截图:使用无头浏览器可以方便地对网页进行截图,可以用于生成网页快照、监控网页变化等。
  2. 自动化测试:使用无头浏览器可以模拟用户操作,可以用于自动化测试、自动化部署等。
  3. 网页爬虫:使用无头浏览器可以模拟浏览器行为,可以用于网页爬虫、数据采集等。
  4. 数据分析:使用无头浏览器可以获取网页数据,可以用于数据分析、机器学习等。

使用chromedp

chromedp是一个基于Chrome或Chromium浏览器的DevTools协议的库,可以方便地控制浏览器进行截图、模拟用户操作等功能。

以下是使用chromedp库实现无头浏览器截图的示例代码:

package main
import (
   "context"
   "io/ioutil"
   "log"
   "time"
   "github.com/chromedp/cdproto/page"
   "github.com/chromedp/chromedp"
)
func main() {
   // 创建一个上下文
   ctx, cancel := chromedp.NewContext(context.Background())
   defer cancel()
   // 设置浏览器选项
   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()
   // 创建一个浏览器实例
   ctx, cancel = chromedp.NewContext(allocCtx)
   defer cancel()
   // 导航到指定的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库创建了一个无头浏览器实例,并导航到百度首页。

然后使用page.CaptureScreenshot()函数获取页面截图,并将截图保存到screenshot.png文件中。

image.png

运行演示

把我上面的代码复制到main.go文件中,安装依赖直接运行即可:

go mod tidy
go run main.go

执行效果如下:

image.png

需要注意的是,使用chromedp库需要先安装Chrome或Chromium浏览器,并将其添加到系统的环境变量中。

使用rod

rod是另一个基于Chrome或Chromium浏览器的DevTools协议的库,可以方便地控制浏览器进行截图、模拟用户操作等功能。

以下是使用rod库实现无头浏览器截图的示例代码:

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()
  //简单模式,默认截图设置
  page.MustScreenshot("my.png")
  //自定义截图设置
  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库创建了一个无头浏览器实例,并导航到百度首页。

然后使用page.MustScreenshot()函数获取页面截图,并将截图保存到my.png文件中。

image.png

同样演示了使用page.Screenshot自定义截图,并将自定义截图保存到了my.jpg文件中。

image.png

需要注意的是,使用rod库需要先安装Chrome或Chromium浏览器,并将其添加到系统的环境变量中。

运行方式

rod库示例代码的运行方式和chromedp基本一致,略有区别的是我们需要根据提示,运行多次go run main.go安装需要的插件:

2acdbd4c083f0a395c5d1139b92a730.png

碰到上面提示不用慌,再执行一次go run main.go即可

c0237d13d6fa999a8a03c1309f64812.png

执行效果如下:

0e26f892a9be3200332246fcb31882a.png

注意

再强调一遍,不管是使用chromedp库还是rod库,都需要先安装Chrome或Chromium浏览器,并将其添加到系统的环境变量中。

我文章中的演示是基于Mac OS。

总结

本文介绍了如何使用Golang实现无头浏览器截图的功能。

通过使用chromedprod库,可以方便地控制浏览器进行截图、模拟用户操作等功能。

使用Golang实现无头浏览器截图的优势包括:

高效性:Golang是一种高效的编程语言,可以快速地处理大量数据和请求。

可扩展性:Golang具有良好的可扩展性,可以方便地扩展和修改代码。

跨平台性:Golang可以在多个平台上运行,可以方便地进行跨平台开发和部署。

安全性:Golang具有良好的安全性,可以有效地防止代码注入和攻击。

综上所述,使用Golang实现无头浏览器截图可以在很多场景下发挥作用,具有高效性、可扩展性、跨平台性和安全性等优势。

相关文章
|
7月前
|
Web App开发 数据采集 JavaScript
利用无头浏览器爬取JavaScript生成的网页
利用无头浏览器爬取JavaScript生成的网页
|
8月前
selenium--浏览器窗口截图
selenium--浏览器窗口截图
|
8月前
|
数据采集 JavaScript 前端开发
利用无头浏览器进行APP提取数据的技术与实践
利用无头浏览器进行APP提取数据的技术与实践
|
4月前
|
Web App开发
GOOGLE chrome浏览器 非插件截图方法
emm...不知道大家知不知道,反正不管怎么样,我就拿来水一下 打开chrome 哦~ 右键审查元素 or F12 or ctrl+shit+i or 你自己设置的快捷键... 然后再ctrl+shit+p
127 0
|
5月前
|
移动开发 资源调度 JavaScript
html2canvas 一个强大的使用js开发的浏览器网页截图工具
html2canvas 一个强大的使用js开发的浏览器网页截图工具
41 0
|
7月前
|
数据采集 Web App开发 JavaScript
Puppeteer无头浏览器:开启自动化之门,掌握浏览器世界的无限可能
大概还是入门期,我曾用Puppeteer做爬虫工具以此来绕过某网站的防爬机制。近期有需求要做任意链接网页截图,像这种场景非常适合用Puppeteer完成。无头浏览器我已知的还有Selenium。
157 2
Puppeteer无头浏览器:开启自动化之门,掌握浏览器世界的无限可能
|
10月前
|
Web App开发 数据采集 JavaScript
剑走偏锋,正经程序员都在用的无头浏览器到底有多神奇?
浏览器是再熟悉不过的东西了,几乎每个人用过,比如 Chrome、FireFox、Safari,尤其是我们程序员,可谓开发最强辅助,摸鱼最好的伴侣。 浏览器能干的事儿,无头浏览器都能干,而且很多时候比标准浏览器还要更好 用,而且能实现一些很好玩儿的功能,我们能借助无头浏览器比肩标准浏览器强大的功能,而且又能灵活的用程序控制的特性,做出一些很有意思的产品功能来,稍后我们细说。
|
Web App开发 异构计算 Python
|
Web App开发 监控 安全
浏览器原理 36 # 浏览上下文组:如何计算Chrome中渲染进程的个数?
浏览器原理 36 # 浏览上下文组:如何计算Chrome中渲染进程的个数?
88 0
浏览器原理 36 # 浏览上下文组:如何计算Chrome中渲染进程的个数?
|
Web App开发 存储 缓存
「web浏览器」从一张进程截图说起,总结了一波Chrome架构知识点
本文从一张进程截图说起,总结了一波Chrome架构知识点。
241 0

热门文章

最新文章