使用Python，将网页动画转为GIF

前言

最近给网站加入了懒加载动画，避免懒加载的时候图片“鬼跳”，遂在网上寻找免费的个人使用素材，但是这个时候又出现了一个问题：如何捕获使用HTML5+CSS前端实现的动画，将其转换为GIF？

最开始我想到了的是开源ScreenToGif，但是一番体验下来，结果有点不尽人意，主要是帧率感觉太卡了，抓取下来动画不连贯，而且文件比较大，对于一个站点来说，尤其是加载动画，如果过大到时候加载动画比图片加载还慢半拍那就没有意义了。

遂使用搜索引擎+AI相结合完成了Python+Webdriver实现相关效果。

代码使用

执行后会先让你输入网址，随后它会自动根据你设置的休眠时间与帧率进行捕获。

综合下来比使用ScreenToGif抓取更加高效占用空间低。

以下为代码执行时示例图：

自动化执行过程

以下为代码实现

开始之前请通过pip安装相关依赖（我这里使用的是谷歌的Chrome webdriver，请根据你的实际情况调整），这里默认给你们配置了临时使用清华源下载相关依赖。

pip install selenium webdriver-manager Pillow imageio -i https://pypi.tuna.tsinghua.edu.cn/simple

依赖安装完成后即可通过以下代码自行调整然后进行动画抓取啦！

import time
from selenium import webdriver
from selenium.webdriver.chrome.service import Service
from webdriver_manager.chrome import ChromeDriverManager
from PIL import Image
import imageio
from io import BytesIO

def main():
    # 从终端获取URL
    url = input("请输入目标网页的URL: ")

    try:
        # 配置WebDriver，自动获取最新的ChromeDriver
        service = Service(ChromeDriverManager().install())
        options = webdriver.ChromeOptions()
        options.add_argument('--headless')  # 如果不需要显示浏览器窗口，可以启用无头模式
        options.add_argument('--window-size=800,600')

        # 启动WebDriver
        print("启动WebDriver...")
        driver = webdriver.Chrome(service=service, options=options)

        # 打开目标网页
        print(f"打开目标网页: {url}")
        driver.get(url)

        # 等待动画加载（根据需要调整时间）
        print("等待动画加载...")
        time.sleep(5)

        # 截取帧并保存到列表
        frames = []
        num_frames = 30  # 需要的帧数
        print("开始捕获帧...")
        for i in range(num_frames):
            screenshot = driver.get_screenshot_as_png()
            img = Image.open(BytesIO(screenshot))
            frames.append(img)
            print(f"捕获帧 {i + 1}/{num_frames}")
            time.sleep(0.1)  # 间隔时间，根据动画速度调整

        # 关闭浏览器
        print("关闭浏览器...")
        driver.quit()

        # 保存帧为GIF
        output_file = 'web_animation.gif'
        print(f"保存帧为GIF文件: {output_file}")
        frames[0].save(
            output_file,
            save_all=True,
            append_images=frames[1:],
            duration=100,
            loop=0
        )
        print("GIF文件已保存。")

    except Exception as e:
        print(f"发生错误: {e}")

    finally:
        driver.quit()

if __name__ == "__main__":
    main()

最后附上我的GIF加载动画

loading