首页 > 编程语言 >一个基于Nodejs环境的小工具,使用Puppeter对网页进行全屏截图

一个基于Nodejs环境的小工具,使用Puppeter对网页进行全屏截图

时间:2024-03-27 17:12:11浏览次数:25  
标签:截图 Puppeter 请求 Nodejs 渲染 mode 全屏 screenshots 页面

screenshots

A small tool based on Nodejs environment, using Puppeter to take full screen screenshots of any webpage

1. 简介

 
一个基于Nodejs环境的小工具,使用Puppeter对任何网页进行全屏截图
 

2. 特点

 

  1. 如果页面有滚动条会自动滚屏截取全部可见内容
  2. 如果页面使用了异步加载,会等待全部数据加载完毕后再进行截屏
  3. 如果页面使用了AOS滚屏动画会将动画清除后再进行截屏
     

3. 请求参数

 

  1. url: 请求页面地址,必传
  2. mode: 页面渲染模式,可选值:pc、mobile,默认:pc
  3. width: 页面渲染宽度,可选,默认:1366,优先于mode
  4. height: 页面渲染高度,可选,默认:800,优先于mode
  1. base64: 是否返回图片的Base64编码,可选,默认0
     

4. 返回数据

 

  1. state: 处理状态,成功true,失败false
  2. msg: 错误信息,处理成功时该参数为空
  3. url: 请求页面的地址
  4. mode: 请求页面的渲染方式(pc、mobile)
  5. width: 请求页面的渲染宽度(模拟浏览器宽度,非截图宽度)
  6. height: 请求页面的渲染高度(模拟浏览器高度,非截图高度)
  7. screenshot: 截屏图片的请求地址
  8. times: 接口总处理时长,单位:毫秒
  9. base64: 截屏图片的Base64编码,当请求参数base64为真时有效
     

5. 如何使用

 

  1. 本地安装node.js环境
  2. 拉取代码到本地目录
  3. 执行:npm install 初始化依赖
  4. 执行:node ./screenshots.js 开启服务
  5. 配置文件 conf.json 中可以调整服务端口和截图保存目录名称
  6. 也可利用 pkg 将 ./screenshots.js 打包部署到服务器
     

6. 项目地址

 
https://github.com/netwild/screenshots

标签:截图,Puppeter,请求,Nodejs,渲染,mode,全屏,screenshots,页面
From: https://www.cnblogs.com/netWild/p/18099754

相关文章

  • 安装nodejs
    方法一:源码包安装官网下载centos下载最新版10.9https://nodejs.org/dist/v10.9.0/node-v10.9.0-linux-x64.tar.xzmkdir/opt/software/&&cd/opt/software/tar-xvfnode-v10.9.0-linux-x64.tar.xzmvnode-v10.9.0-linux-x64nodejs建立软连接,变为全局①ln-s/opt/soft......
  • Nodejs沙盒逃逸
    Buffer在较早一点的node.js版本中(8.0之前),当Buffer的构造函数传入数字时,会得到与数字长度一致的一个Buffer,并且这个Buffer是未清零的。8.0之后的版本可以通过另一个函数Buffer.allocUnsafe(size)来获得未清空的内存。注:关于BufferJavaScript语言自身只有字......
  • 继续nodejs
    昨天学习完了读写模块,今天继续学习Path路径模块1、路径拼接,path.join方法用法很简单,首先,使用路径模块要声明个常量,constpath=require(‘path’)然后直接使用就好了,constfpath=path.join(‘路径1’,‘路径2’,‘路径3’,‘路径4’,‘路径5’)输出的结果就是这几个路径连在一起......
  • nodejs学习
    什么是nodejs就是一个基于chormeV8引擎的JavaScript运行环境,是一个用于后端的运行环境nodejs中的运行环境分为两部分,分别是V8引擎和内置Api,前者用于解析js,后者用于被js调用终端的概念 虽然用的很多,但一讨论他的概念,我倒是有点说不上来:终端,是专门为开发人员设计的,用于实现人......
  • [nodejs] pm2 : nodejs 的进程管理工具
    0pm2概述0.1序0.2pm2简述PM2是一款非常优秀的Node进程管理工具,它有着丰富的特性:能够充分利用多核CPU且能够负载均衡、能够帮助应用在崩溃后、指定时间(clustermodel)和超出最大内存限制等情况下实现自动重启。PM2是开源的基于Nodejs的应用进程管理器,包括守护进......
  • [nodejs] nodejs版本管理工具:nvm
    0序言nodejs的版本管理、安装,是个麻烦事儿。例如在centos7上安装nodejs,就不是那么痛快。(基于docker的安装,除外)1nvm简述nvm是一个node的版本管理工具,可以简单操作node版本的切换、安装、查看等与npm不同的是:npm是依赖包的管理工具,nvm是nodejs的版本管理工具,通过它可以......
  • 2020-2-20-nodejs基础知识
    vs插件安装、快速运行、url模块使用、自动重启工具supervisor、自定义模块、下载第三方包、fs模块、Async、Await的使用、文件里、简易静态服务器、事件驱动EventEmitter、模拟登陆简单版、模拟express封装、操作mongodb数据库VScode插件安装需要安装NodeSnippets插件才会有提......
  • Nodejs常用命令及解释
    node-启动Node.js程序解释:使用该命令可以直接运行一个Node.js程序,从而执行其中的JavaScript代码。npm-Node.js包管理器命令解释:npm是Node.js的包管理器,可以用来安装、卸载和管理Node.js包。常用的命令有:npminit-初始化一个新的Node.js项目npminsta......
  • nodejs 实现 AMD 加载 依赖
    importfsfrom"fs";importpathfrom"path";importvmfrom"vm";exportclassLoadComponent{componentsPath:string=path.resolve("../first/components/");componentName:string="";componentIn......
  • 前端-全屏功能
    constisFullScreen=ref(false)//全屏constfullScrenn=()=>{letelement=document.documentElementif(element.requestFullscreen){ element.requestFullscreen()}elseif(element.webkitRequestFullScreen){ element.webkitRequestFullScreen()......