python+playwright+jinjia2渲染html并截图
2024-05-14 11:58:28
1.html原文件
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>{{title}}</title>
<style type="text/css">*{padding: 0;margin: 0;}.box{width: 640px;height: 480px;border: 1px solid #d8d8d8;margin: 50px auto;overflow: hidden;background: #dcf1f0;}.box .line{width:600px;height: 50px;margin: 0 auto;border-bottom: 1px solid #ddd;line-height: 50px;}.box span{font: bold 18px '楷体';color: #000;padding: 15px;border-bottom: 2px solid red;}.box #more{float: right;font-weight: bold;color: #9f9f9f;text-decoration: none;}.box #more:hover{color: red;}.box ul{list-style: none;width:600px;height: 480px;padding:0;margin: 7px auto 0;}.box ul li{height:36px;border-bottom: 1px solid #ddd;background: url(dot.gif) left center no-repeat;}.box ul a{float:left;height:36px;font: bold 14px/36px '楷体';text-decoration: none;text-indent: 30px;color: #000;background: url(icon.jpg) 5px center no-repeat;}.box ul a:hover{color: red;}.box ul p{float: right;height: 36px;font:bold 14px/36px '微软雅黑';color: #000;}
</style>
</head>
<body>
<div class="box" id="content">
<div class='line'><span id="name" align="center">{{name}}by 易安 <a href="https://jingblog.tech">https://jingblog.tech</a></span></div><ul id="list">{{news}}</ul>
</div>
</body>
</html>
页面效果
放在templates/list.html文件中
2.导入需要的包
from jinja2 import Environment, FileSystemLoader
import time
import json
import aiohttp
import asyncio
from playwright.sync_api import sync_playwright
import os
3.数据示例
Headers = {"user-agent": "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/92.0.4515.107 Safari/537.36"}def get_time() -> str:return time.strftime("%m{}%d{} %H:%M:%S").format('月', '日')def get_li() -> str:li = '''<li><a href="#">{}</a><p>{}</p></li>'''return liasync def get_weibo(amount: int) -> str:title = "微博热搜"name = "微博热搜-" + get_time()li = get_li()try:async with aiohttp.ClientSession() as session:async with session.get("https://weibo.com/ajax/statuses/hot_band", headers=Headers, timeout=5) as response:RawData = await response.json()Result = RawData["data"]["band_list"]news = ""Top = f'{RawData["data"]["hotgov"]["name"]}'news += li.format(Top, "[置顶]")for i in range(amount):next_data = f'{Result[i]["note"]}'news += li.format(next_data, "No." + str(i + 1))data = Data(title, name, news)return dataexcept:return "获取信息失败"class Data:def __init__(self, title: str, name: str, news: str):self.title = titleself.name = nameself.news = news
4.jinjia2渲染html
def generate_html(path: str, data: Data, result: str) -> None:env = Environment(loader=FileSystemLoader('./'))template = env.get_template(path) with open(result,'w+', encoding='utf-8') as fout: html_content = template.render(title=data.title,name=data.name,news=data.news)fout.write(html_content)
其中env的FileSystemLoader设置为程序运行所在目录，path应该设置为该目录的相对路径。
5.playwright截图
def render_pic(path, result):with sync_playwright() as p:for browser_type in [p.chromium]:print(f'start browser {browser_type.name} ...')# playwright默认是无头模式#browser = browser_type.launch()# 指定为有头模式，方便查看界面browser = browser_type.launch(headless=False)context = browser.new_context()page = context.new_page()page.goto(path)# screenshotpage.locator('#content').screenshot(path=result)context.close()browser.close()
6.测试程序
def main():loop = asyncio.get_event_loop()data = loop.run_until_complete(get_weibo(10))template = "templates/list.html"result = os.path.join(os.path.dirname(__file__), r"templates\result.html")result_img = os.path.join(os.path.dirname(__file__), r"templates\result.png")generate_html(template, data, result)render_pic(result, result_img)if __name__ == "__main__":main()
把html文件放入程序所在目录的templates文件夹下，文件名为list.html
运行程序，会在templates文件夹下生成result.html文件和result.png文件。
7.运行结果
生成的result.html文件：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>微博热搜</title>
<style type="text/css">*{padding: 0;margin: 0;}.box{width: 640px;height: 480px;border: 1px solid #d8d8d8;margin: 50px auto;overflow: hidden;background: #dcf1f0;}.box .line{width:600px;height: 50px;margin: 0 auto;border-bottom: 1px solid #ddd;line-height: 50px;}.box span{font: bold 18px '楷体';color: #000;padding: 15px;border-bottom: 2px solid red;}.box #more{float: right;font-weight: bold;color: #9f9f9f;text-decoration: none;}.box #more:hover{color: red;}.box ul{list-style: none;width:600px;height: 480px;padding:0;margin: 7px auto 0;}.box ul li{height:36px;border-bottom: 1px solid #ddd;background: url(dot.gif) left center no-repeat;}.box ul a{float:left;height:36px;font: bold 14px/36px '楷体';text-decoration: none;text-indent: 30px;color: #000;background: url(icon.jpg) 5px center no-repeat;}.box ul a:hover{color: red;}.box ul p{float: right;height: 36px;font:bold 14px/36px '微软雅黑';color: #000;}
</style>
</head>
<body>
<div class="box" id="content">
<div class='line'><span id="name" align="center">微博热搜-01月03日 14:50:46by 易安 <a href="https://jingblog.tech">https://jingblog.tech</a></span></div><ul id="list"><li><a href="#">#巩固脱贫成果乡村振兴开新局#</a><p>[置顶]</p></li><li><a href="#">春晚</a><p>No.1</p></li><li><a href="#">初二女生为活命扎针超25000次</a><p>No.2</p></li><li><a href="#">什么环境下需要佩戴N95口罩</a><p>No.3</p></li><li><a href="#">微博年货节</a><p>No.4</p></li><li><a href="#">干咳咳痰是肺炎的判断标准吗</a><p>No.5</p></li><li><a href="#">张婉婷听到宋宁峰的话秒哭</a><p>No.6</p></li><li><a href="#">大爷摔倒躺藕田2天2夜才被发现</a><p>No.7</p></li><li><a href="#">鹰眼扮演者被扫雪机碾压腿部</a><p>No.8</p></li><li><a href="#">央视评部分国家限制中国旅客入境</a><p>No.9</p></li><li><a href="#">小狗趁主人不在家偷吃6颗布洛芬</a><p>No.10</p></li></ul>
</div>
</body>
</html>
渲染效果
python+playwright+jinjia2渲染html并截图相关推荐
- python如何截长图_用python实现对元素的长截图
一.目标 浏览网页的时候,看见哪个元素,就能截取哪个元素当图片,不管那个元素有多长 二.所用工具和第三方库 python ,PIL,selenium pycharm 三.代码部分 长截图整体思路: 1 ...
- 使用Python自动给视频逐帧截图
背景 数据集采集不单有图片格式,也有视频格式,有时我们需要根据采集来的视频生成图片,再进行标注.所以这里我们使用Python自动给视频逐帧截图. 注意:由于摄像机录制的视频大多是XMF格式,需要使用格 ...
- python+Playwright自动化刷课简直太神了
使用工具:PyCharm 语言:python+Playwright 准备工作: 1.更新我们的pip工具 #更新我们的pip工具 pip install --upgrade pip(一般情况下不用) ...
- 2021-01-07 关于Python的jinjia2的学习和使用
关于Python的jinjia2的学习和使用 1, **from jinjia2 import Templatehtml_template ='''{% for k,v in dict|dictsor ...
- python+playwright 学习-6.截图使用
前言 playwright 除了可以截取当前屏幕,还可以截长图,也可以对某个元素截图,这点非常棒. screenshot 截图 这是捕获屏幕截图并将其保存到文件中的快速方法: page.screens ...
- python+playwright 学习-1.环境准备与快速开始
前言 说到 web 自动化,大家最熟悉的就是 selenium 了,selenium 之后又出现了三个强势的框架Puppeteer.CyPress.TestCafe, 但这3个都需要掌握 JavaSc ...
- python 服务端渲染_客户端渲染和服务器渲染的区别
我们都知道,网页上的很多内容之所以能那么丰富,是因为大量的css.js去渲染出这个页面.那么他们是如何渲染的呢?那么就要说到我们本文的两种渲染方式了,即客户端渲染和服务端渲染. 正文 本文将分别讲述两 ...
- python如何截长图_使用python实现对元素的长截图功能
一.目标 浏览网页的时候,看见哪个元素,就能截取哪个元素当图片,不管那个元素有多长 二.所用工具和第三方库 python ,PIL,selenium pycharm 三.代码部分 长截图整体思路: 1 ...
- Python实现计算机屏幕任意区域截图
程序功能与用法:运行后有个主窗体,上面有个按钮,单击后开始截图,鼠标坐标落下开始截图,鼠标左键抬起表示截图结束,然后弹出对话框提示保存截图文件. 本文要点在于Python扩展库pillow提供的Ima ...
最新文章
- mysql主从配置安装_mysql主从配置完整版（二进制安装）
- Ubuntu下安装和配置Apache2方法简介
- 深度剖析WinPcap之(七)——获得与释放网络适配器设备列表（5）
- Xml xpath samples
- google 浏览器默认打开控制台_chrome浏览器使用 Console(控制台)
- spring boot进行上传文件
- mysql判断存在返回布尔_MySqlClient访问tinyint字段返回布尔值篇
- kafka 事务_Kafka的有且仅有一次语义与事务消息
- springboot 数据库假面_Spring Boot实战：数据库操作
- 安卓开发之WebView的使用
- marlin固件烧录教程_marlin固件中文(marlin固件下载)
- 在word中强制换行方法如下
- 一、恒生电子面试 （校招）
- 【从蛋壳到满天飞】JS 数据结构解析和算法实现-堆和优先队列（二）
- 如何使虚拟机VMware workstation连接局域网
- Rust游戏引擎Bevy初探
- windows中的DOS命令及变量
- java zip文件加密_java自动压缩文件并加密
- java中五子棋_Java简单五子棋的实现
- GTD时间管理学习day01---基本原理
热门文章
- OpenCV-Python——一个搞笑的小程序，实现抖音戴墨镜效果
- 布林通道参数用20还是26_布林线参数13好还是20好
- 人脸眨眼检测：Real-Time Eye Blink Detection using Facial Landmarks
- nvidia设置wifi和接口
- fortran基于svd分解求解广义逆矩阵
- 使用 Vue.js 制作一个简单的调查问卷平台
- mysql性能调优之 max_allowed_packet 详解 解决ERROR 2006 (HY000): MySQL server has gone away
- 国家火炬计划“照亮”Broadview COSS 3.0信息化征途
- 声纹识别—让安全的声音听得见
- Python深度学习（DeepDream）--学习笔记（十九）