无界面 Ubuntu 服务器搭建 selenium + chromedriver 实现 Python 自动网页截图

之前我们记录了 Windows 桌面系统下 selenium 的网页截图，在无界面的 Ubuntu 系统稍微麻烦一点点，本文记录实现过程。

简介

• selenium + chromedrive 在 Windows 或者说有界面的操作系统下比较容易,对于服务器来说他没有界面,还让他截图确实有点强人所难，但是活还是可以想办法干的

实现思路

• 安装 xvfb 工具虚拟化图像输出设备，假装有个显示器
• 使用 webdriver 的无沙盒模式
• 过程中需要谷歌浏览器、浏览器驱动、selenium 版本配套

有用的小操作

卸载 Chrome

• 如果需要卸载现有的 Chrome，可以使用 apt-get 命令

  sudo apt-get remove google-chrome-stable 

查看 Ubuntu 版本

• 通过若干命令可以查看 Ubuntu 版本
  • cat /etc/issue
  • cat /proc/version
  • uname -a
  • lsb_release -a
  • cat /etc/lsb-release

查看当前 Chrome 浏览器版本

• 安装好 Chrome 浏览器后

  google-chrome --version

• 如果有界面的话可以用 Chrome 访问 ：chrome://version

  

查看当前 Chrome 浏览器对应的驱动版本

• 假设我已知自己的浏览器版本为 ： 109.0.5414.75

• 用浏览器访问链接：

  https://chromedriver.storage.googleapis.com/LATEST_RELEASE_ + 浏览器版本的前三部分数字

• 例如我的链接就是 ：

  https://chromedriver.storage.googleapis.com/LATEST_RELEASE_109.0.5414

• 访问这个链接，可以看到对应的驱动版本：

  

查看下载好的 Chromedriver 的版本

• 如果已经下载好了 chromedriver 文件，由于文件名称上不带版本号，直接读不出来

• 想要知道版本号，可以直接运行该文件，在输出的日志信息中可以看到版本号：

  

最新版 Chrome 搭建流程

安装 Chrome

• 访问 Chrome 官网：https://www.google.cn/intl/zh-CN/chrome/

• Linux 版本在最下面的 其他平台 里

  

• 选择 Linux，可以下载 deb 的 Chrome 安装包

  

• 安装 deb 包

  sudo dpkg -i google-chrome-stable_current_amd64.deb

• 依赖如果报错，安装依赖：

  sudo apt-get -f install

下载、配置 chromedriver

• 查看当前 chrome 版本

  google-chrome -version
  Google Chrome 110.0.5481.100

• 通过链接： https://chromedriver.storage.googleapis.com/LATEST_RELEASE_110.0.5481 查看得到对应的驱动版本：

  110.0.5481.77

• Chromedriver 下载链接：http://chromedriver.storage.googleapis.com/index.html

• 在其中找到自己 Chrome 浏览器对应的驱动版本下载 Linux64 文件包

• 解压数据：

  unzip chromedriver_linux64.zip

• 会得到 chromedriver 文件

• 可以运行验证一下是否是正确的版本

• 添加到系统路径或拷贝到 /usr/bin

  sudo cp chromedriver /usr/bin

安装 selenium

• 当前 selenium 版本最高为 4.8.0，如果安装了最新的 Chrome 和 driver，可以直接安装最高版本的 selenium

  pip install selenium

旧版本 Chrome 搭建流程

• 对操作系统版本要求不高，需要安装旧版本的 Chrome 可以参考此流程

安装 Chrome

如果不完全清楚那个版本的浏览器才能正常运行，可以参考这个可用的版本：69.0.3497.100

• 下载 google-chrome-stable deb 包 :

wget https://raw.githubusercontent.com/wycm/md-image/master/2019-03-14/google-chrome-stable_69.0.3497.100-1_amd64.deb

• 安装

sudo dpkg -i google-chrome-stable_69.0.3497.100-1_amd64.deb

• 可能有依赖报错，安装所需的依赖

  sudo apt-get -f install

下载、配置 chromedriver

• 下载上述 Chrome 对应的 chromedriver

wget https://raw.githubusercontent.com/wycm/md-image/master/2019-03-14/chromedriver_linux64.zip

• 解压

unzip chromedriver_linux64.zip

• 配置环境变量，将解压出来的 chromedriver 文件添加到系统路径中

• 或者拷贝到 /usr/bin 目录下

  sudo cp chromedriver /usr/bin

安装 selenium

• 当前 selenium 版本最高为 4.8.0，但是该版本对于上述 Chrome 版本过高，如果你安装了上述 Chrome需要安装 4.1.3 版本的 selenium

  pip install selenium==4.1.3

其他环境

安装 xvfb

• 安装虚拟输出设备：

  sudo apt-get install xvfb

启动 Xvfb

• 启动虚拟化输出设备，设置分辨率

Xvfb :99 -ac -screen 0 1280x1024x24 &

• 设置输出设备

  export DISPLAY=:99

Python 调用 selenium 保存截图

• 至此核心环境已经配置完成了

• 创建 Python 脚本文件 test.py，内容为：

  from selenium import webdriver
  import time
  if __name__ == '__main__':
      options = webdriver.ChromeOptions()
      options.add_argument("--no-sandbox")
      driver = webdriver.Chrome(chrome_options=options)
      driver.get('https://www.baidu.com')
      print(driver.title)
      time.sleep(3)
      driver.get_screenshot_as_file('screenshot.png')
      driver.close()

• 执行脚本：

  python test.py

• 等了半天，如果没报错而且输出：

  百度一下，你就知道

  说明是没啥毛病了

• 过程中我保存了截图

  

• 图是截了，中文显示不了，这是系统中文字体库没有安装的问题

安装中文字体库

• 执行命令：

  sudo apt-get install ttf-wqy-microhei ttf-wqy-zenhei xfonts-wqy

最终效果

参考资料

• https://www.zywvvd.com/notes/tools/selenium-screenshot/selenium-screenshot/
• https://www.shuzhiduo.com/A/Ae5RqBM8JQ/
• https://www.selenium.dev/documentation/
• https://blog.csdn.net/xds2ml/article/details/52982748/
• https://blog.csdn.net/fengltxx/article/details/79622854?spm=1001.2101.3001.6661.1&utm_medium=distribute.pc_relevant_t0.none-task-blog-2~default~CTRLIST~Rate-1-79622854-blog-89203697.pc_relevant_recovery_v2&depth_1-utm_source=distribute.pc_relevant_t0.none-task-blog-2~default~CTRLIST~Rate-1-79622854-blog-89203697.pc_relevant_recovery_v2&utm_relevant_index=1
• https://blog.csdn.net/weixin_44144647/article/details/113129148
• https://blog.csdn.net/weixin_53044798/article/details/126258334
• https://blog.csdn.net/weixin_48262500/article/details/127266070
• https://blog.csdn.net/mlzboy/article/details/83559641
• https://blog.51cto.com/wangshiyu/5171189
• https://zhuanlan.zhihu.com/p/322607528

文章链接：
https://www.zywvvd.com/notes/tools/selenium-screenshot/ubuntu-selenium-chrome/ubuntu-selenium-chrome/