使用Chrome和Selenium实现对Superset等私域网站的截图

最近遇到了一个问题,因为一些原因,我搭建的一个 Superset 的 Report 功能由于节假日期间不好控制邮件的发送,所以急需一个方案来替换掉 Superset 的 Report 功能

首先我们需要 Chrome 浏览器和 Chrome Driver,这是执行数据抓取的基石

Selenium 是一个用于自动化 Web 应用程序测试的工具,它可以帮助模拟用户在浏览器中的操作,如点击、输入文本、提交表单等

这样,我们就可以通过网页的验证,并进入 Superset 进行我们需要的截图了

1. 安装

1.1 在服务器安装Chrome

复制代码
wget https://dl.google.com/linux/direct/google-chrome-stable_current_amd64.deb
apt install -y google-chrome-stable_current_amd64.deb
google-chrome --version

1.2 在服务器端安装Chrome Drive

这里可以查看你安装的stable版与对应的驱动, 上面查看版本可以看到我安装了132.0.6834.83版本,所以对应地,我需要下图中的版本。

复制代码
wget https://storage.googleapis.com/chrome-for-testing-public/132.0.6834.83/linux64/chromedriver-linux64.zip
unzip chromedriver-linux64.zip
cp chromedriver-linux64/chromedriver /usr/bin/.

1.3 安装字体(针对中文网站)

这里 下载微软雅黑ttf格式字体。

将字体上传到服务器上,接着执行

复制代码
mkdir -p /usr/share/fonts/chinese/
cp 微软雅黑.ttf /usr/share/fonts/chinese/
cd /usr/share/fonts/chinese/
fc-cache -fv
fc-list :lang=zh

也可只针对单用户

复制代码
mkdir -p ~/.fonts
cp 微软雅黑.ttf ~/.fonts
fc-cache -fv
fc-list :lang=zh

2. 使用Selenium

没有安装 Selenium 的话,先使用pip安装

然后加载 driver

复制代码
from selenium import webdriver
from selenium.webdriver.common.by import By
from selenium.webdriver.chrome.options import Options
from selenium.webdriver.common.keys import Keys

如果是按照上面的流程安装的最新版的驱动的情况下, 使用下面一行即可加载驱动

python 复制代码
driver = webdriver.Chrome()

如果安装的 Chrome 或者驱动较老,则可以尝试使用如下方式加载驱动

python 复制代码
options = Options()
options.add_argument("--no-sandbox")  # Avoid using the sandbox mode
options.add_argument("--headless")  # Run Chrome in headless mode
options.add_argument("--single-process")
options.add_argument("--window-size=1920,1080")
driver = webdriver.Chrome(options=options)

2.1 确定登录所需信息

由于我们需要对私域网站截图,所以第一步需要先使用账号密码登录网站

Selenium 可以帮我们模拟输入文本和点击,但是前提需要我们找到输入框的所在位置,以及登录按钮所在的位置

由于在这里的id和class是唯一的, 所以我们可以使用 By.IDBy.CSS_SELECTOR 选择器直接选择

python 复制代码
username_field = driver.find_element(By.ID, 'username')
password_field = driver.find_element(By.ID, 'password')
button = driver.find_element(By.CSS_SELECTOR, "input.btn.btn-primary.btn-block")

2.2 输入信息并点击登录

python 复制代码
# 输入账户密码登录
import time

username_field.send_keys(username)
password_field.send_keys(password)
button.click()
time.sleep(3)  # 等待登陆,等待时间视实际响应时间为准

2.3 根据需求截图并保存

在输入想截图的网站的网址后,我们可以选择只登录,或者登录并跳转。以某dashboard为例子,下面演示登录并跳转到某dashboard截图的例子

python 复制代码
# 加载我们想加载的页面
driver.get(url)
time.sleep(15) # 等待页面加载完全,可以根据网页加载速度调整等待时间
width = driver.execute_script("return document.documentElement.scrollWidth")
height = driver.execute_script("return document.documentElement.scrollHeight")
driver.set_window_size(width, height)
driver.save_screenshot(save_path)
driver.quit()

上面的例子会动态根据长宽进行长截图,如果页面的长宽是确定的话,可以像下面一样执行

python 复制代码
driver.set_window_size(1920, 1080)

3. 结语

最后,使用Selenium截图的效果还是非常不错的,当然前提是要保证对网站的访问是顺畅的,建议同服务器通过 127.0.0.1 访问会更加顺畅和稳定,否则可能会丢失信息或者干脆无响应

上面的实现思路对公域网站明显是可以直接适用的,其它私域网站参考 [2.1 跳转到确定登录所需信息](#2.1 跳转到确定登录所需信息) 修改后也仍适用

相关推荐
某公司摸鱼前端9 分钟前
uniapp socket 封装 (可拿去直接用)
前端·javascript·websocket·uni-app
要加油哦~10 分钟前
vue | 插件 | 移动文件的插件 —— move-file-cli 插件 的安装与使用
前端·javascript·vue.js
小林学习编程16 分钟前
Springboot + vue + uni-app小程序web端全套家具商场
前端·vue.js·spring boot
柳鲲鹏17 分钟前
WINDOWS最快布署WEB服务器:apache2
服务器·前端·windows
weixin-a153003083161 小时前
【playwright篇】教程(十七)[html元素知识]
java·前端·html
ai小鬼头2 小时前
AIStarter最新版怎么卸载AI项目?一键删除操作指南(附路径设置技巧)
前端·后端·github
一只叫煤球的猫2 小时前
普通程序员,从开发到管理岗,为什么我越升职越痛苦?
前端·后端·全栈
vvilkim3 小时前
Electron 自动更新机制详解:实现无缝应用升级
前端·javascript·electron
vvilkim3 小时前
Electron 应用中的内容安全策略 (CSP) 全面指南
前端·javascript·electron
aha-凯心3 小时前
vben 之 axios 封装
前端·javascript·学习