Linuxwindows下，使用 selenium+ python + chromediver 实现网页自动登录，截屏报表

文章目录

• • • 一、背景
    • 二、如何实现？
    • • 1.安装chrome无头浏览器（Linux环境）
      • 2. 下载 chrome-driver
      • 3. 编写python脚本测试截图
      • 4. 模拟登陆，定点裁剪
      • 4. 嵌入邮件
    • 三、 结论

一、背景

有这么一个需求，公司每日邮件中推送一个echart报表，最简单的方法就是附上截屏图片，嵌入到邮件html中。报表是现成的网页，所以想到了后台自动截图存到服务器，再推送到邮件中。

二、如何实现？ 1.安装chrome无头浏览器（Linux环境）

// 1. 添加yum源
sudo vim /etc/yum.repos.d/google.repo

// 在repo文件中添加以下内容
[google]
name=Google-x86_64
baseurl=http://dl.google.com/linux/rpm/stable/x86_64
enabled=1
gpgcheck=0
gpgkey=https://dl-ssl.google.com/linux/linux_signing_key.pub

// 2. yum 安装chrome
[root@VM-0-13-centos]#  yum install goole-chrome-stable --nogpgcheck

// 查看chrome版本
[root@VM-0-13-centos]# google-chrome --version
[root@VM-0-13-centos]# Google Chrome 101.0.4951.64

2. 下载 chrome-driver

下载驱动要注意一点 chrome 版本要和driver版本对上，不然会出现不兼容的问题，如上我们安装的chrome版本是101.0.4951.64,我们去网站找到大版本相匹配的diver；

点击–>chrome-driver下载网址 查看版本，我们安装最接近的版本，如图：

下载压缩包解压

// 下载压缩包
[root@VM-0-13-centos local]# wget http://chromedriver.storage.googleapis.com/101.0.4951.41/chromedriver_linux64.zip

// 解压文件到指定目录
[root@VM-0-13-centos local]# unzip chromedriver_linux64.zip -d /usr/local/chrome-driver/

// 添加软链接
[root@VM-0-13-centos ~]# ln -s /usr/local/chrome-driver/chromedriver  /usr/bin/chromedriver

ok，到这里无头浏览器就差不多装好了，接下来就是安装selenium包，用pip安装就行

[root@VM-0-13-centos ~]# pip3 install selenium

如图

3. 编写python脚本测试截图

'''
Author: Alan
Date: 2022-05-13 15:41:49
Description: 网页截屏
'''
from selenium.webdriver import Chrome
from selenium.webdriver.chrome.options import Options
import time
import os


# chrome-driver 安装路径
DRIVER_PATH = '/usr/bin/chromedriver'
# 若是windows环境下
# DRIVER_PATH = 'C:\Program Files (x86)\Google\Chrome\Application\chromedriver'

img_path = '/data/script/py/img'  # 存放截图的位置

if __name__ == "__main__":
    # 浏览器基础配置
    options = Options()
    options.add_argument('--no-sandbox')
    # options.add_argument('--headless')  # 无头参数
    options.add_argument('--disable-gpu')  # 禁用gpu 防止占用资源出现bug
    options.add_argument('window-size=1920x1080')  # 设置分窗口辨率
    options.add_argument('--start-maximized')  # 最大化运行（全屏窗口）,不设置，取元素可能会报错
    options.add_argument('--hide-scrollbars')
    
    # 启动浏览器
    driver = Chrome(executable_path=DRIVER_PATH, options=options)
    try:
        # 访问页面
        driver.get('https://blog.csdn.net/littleWhiteSan')

        # 截屏
        img_name = time.strftime(
            '%Y-%m-%d', time.localtime(time.time()))  # 截屏名称 时间表示
        img = "%s.png" % os.path.join(img_path, img_name)  # 图片
        driver.get_screenshot_as_file(img)  # 保存截图

    except Exception as e:
      print(e)
      driver.close()  # 关闭浏览器
      driver.quit()

脚本写好了，我们把脚本放在在服务器上面运行一下

img 文件夹存放截图

python3 screenshoot.py

效果如下：

问题来了，乱码，原因是服务器没有中文字体包，复制一份中文字体到服务器上面即可解决

1.找到免费的中文字体包
2.上传到服务器上
3.刷新字体缓存

将下面字体包放到服务器/usr/share/fonts/

安装字体管理刷新缓存

yum install fontconfig mkfontscale

cd /usr/share/fonts/
mkfontscale
mkfontdir
fc-cache -fv

相关博客 https://blog.csdn.net/a___lei/article/details/118113211

问题已解决。

4. 模拟登陆，定点裁剪

如果需要登录之后再去截屏那么该如何 *** 作？

1. 找到登录密码账号输入框和登录按钮
2. 打开开发着工具，复制xPath
3. py脚本写入账号密码，点击登录

准备：裁剪图片用到了PIL，未安装模块需要先安装

pip3 install pillow

脚本如下

'''
Author: Alan
Date: 2022-05-13 15:41:49
Description: 打开网页
'''
from selenium.webdriver import Chrome
from selenium.webdriver.chrome.options import Options
import time
import os.path
from PIL import Image


# chrome-driver 安装路径
DRIVER_PATH = '/usr/bin/chromedriver'
# DRIVER_PATH = 'C:/Program Files (x86)/Google/Chrome/Application/chromedriver' # windows下

img_path = '/data/script/py/img/'  # 存放截图的位置,要注意权限，确保脚本有权限访问和 *** 作文件

# img_path = "D:/work/screenshoot/" # windows下

if __name__ == "__main__":
    # 浏览器基础配置
    options = Options()
    options.add_argument('--no-sandbox')
    options.add_argument('--headless')  # 无头参数
    options.add_argument('--disable-gpu')  # 禁用gpu 防止占用资源出现bug
    options.add_argument('window-size=1920x1080')  # 设置分窗口辨率
    options.add_argument('--start-maximized')         # 最大化运行（全屏窗口）,不设置，取元素会报错
    options.add_argument('--hide-scrollbars')
    # 启动浏览器
    driver = Chrome(executable_path=DRIVER_PATH, options=options)

    try:
        # 访问页面
        driver.get('https://blog.csdn.net/littleWhiteSan')

        # 登陆博客 去定点截图
        driver.get('https://passport.csdn.net/login?code=applets')

        time.sleep(.5)
        driver.find_element_by_xpath(
            '/html/body/div[2]/div/div[2]/div[2]/div[1]/div/div[1]/span[4]').click()  # 点击密码登录

        # 输入账号密码
        driver.find_element_by_xpath(
            '/html/body/div[2]/div/div[2]/div[2]/div[1]/div/div[2]/div/div[1]/div/input').send_keys('*******')
        driver.find_element_by_xpath(
            '/html/body/div[2]/div/div[2]/div[2]/div[1]/div/div[2]/div/div[2]/div/input').send_keys('******')

        # 点击登录
        driver.find_element_by_xpath(
            '/html/body/div[2]/div/div[2]/div[2]/div[1]/div/div[2]/div/div[4]/button')

        # 等跳转
        time.sleep(1)
        # 跳转我的第一篇文章
        driver.get(
            'http://www.kaotop.com/file/tupian/20220517/124375478" % os.path.join(img_path, img_name)  # 图片

        driver.get_screenshot_as_file(img)  # 保存截图

        # 找到我们需要截图的元素的id 或者xpath 去裁剪图片
        shootElement = driver.find_element_by_xpath(
            '//*[@id="mainBox"]/main/div[1]')

        size = shootElement.size
        location = shootElement.location
        rangle = (int(location['x']), int(location['y']), int(
            location['x'] + size['width']), int(location['y'] + size['height']))  # 写成我们需要截取的位置坐标
        i = Image.open(img)  # 打开截图

        frame4 = i.crop(rangle)  # 使用Image的crop函数，从截图中再次截取我们需要的区域
        frame4.save(img_path+'crop_shoot.png') # 保存裁剪的图片
        driver.close()  # 关闭浏览器
        driver.quit()
        print('done')
    except Exception as e:
        print(e)
        driver.close()  # 关闭浏览器
        driver.quit()

测试一下：

python3 screenshoot.py

ok，执行没问题，我们来看下效果图

第一个图片是裁剪好的图片，第二个是截取的全屏图片，裁剪效果如下：

裁剪博客全文ok，脚本测试通过~

4. 嵌入邮件

若是要在outlook邮件中推送截图，只需要将截图作为附件插入到邮件中，在html中写入cid就行，如下：

Tips: 在windows下面就是改改驱动路径什么的，脚本内容大致一样，这里就不赘述了。

三、 结论

以上就是全部内容了，简单好用，如果对您有用的话请点个赞，有问题请留言指出，我会及时学习更正，谢谢各位大佬~