V2EX = way to explore
V2EX 是一个关于分享和探索的地方
Sign Up Now
For Existing Member  Sign In
爱意满满的作品展示区。
iLionel

📷 page2image - 一个给页面截图的新 npm 轮子 🚗

  •  
  •   iLionel ·
    runjuu · Aug 27, 2017 · 6588 views
    This topic created in 3164 days ago, the information mentioned may be changed or developed.

    虽然大家都在用 Headless Chrome 做自动化测试,但其实用它来对页面进行截图也是挺不错的 😆

    page2image 食用姿势

    Supplement 1  ·  Aug 29, 2017

    🎉 page2image 发布了 1.4.0 版本 🎉

    新增了模拟设备的功能 👉 食用方法

    Supplement 2  ·  Aug 29, 2017

    食用的时候出现了意想不到的状况怎么办? 👉 扔个 issue

    Supplement 3  ·  Aug 29, 2017

    🎊 page2image 发布了 1.5.0 版本 🎊

    CLI 命令新增 @moro 同学提出的给截图文件命名的功能 👉 食用方法

    Supplement 4  ·  Sep 3, 2017

    🎉 page2image 发布了 1.6.0 版本 🎉

    CLI 新增了滚动到页面底部的参数 👉 食用方法

    需要注意的是你可能会需要加上 --dpr=1 的参数来降低截图的清晰度以避免因页面过大而出现空白块的问题

    34 replies    2017-09-04 20:17:34 +08:00
    Showfom
        1
    Showfom  
    PRO
       Aug 28, 2017   ❤️ 1
    支持一下
    apppi
        2
    apppi  
       Aug 28, 2017
    @iLionel 本地服务器上的页面是不能截图的吗
    iLionel
        3
    iLionel  
    OP
       Aug 28, 2017
    @apppi 能用 url 访问的页面都能截图的
    apppi
        4
    apppi  
       Aug 28, 2017   ❤️ 1
    @iLionel localhost 和 127.0.0.1 这样的 似乎不行?
    iLionel
        5
    iLionel  
    OP
       Aug 28, 2017
    @apppi 你可能会需要加上 http 前缀,这种情况我还没考虑到,等下更新一个修复版本上去
    iLionel
        6
    iLionel  
    OP
       Aug 28, 2017
    @apppi 好吧,你的那个问题其实是因为链接正则没有匹配上..最新的那一版已经修复了这个问题了 感谢反馈~
    bhaltair
        7
    bhaltair  
       Aug 28, 2017 via Android
    dev tool 不是已经有截图了
    iLionel
        8
    iLionel  
    OP
       Aug 28, 2017
    @bhaltair [What's New In DevTools (Chrome 59)]https://developers.google.com/web/updates/2017/04/devtools-release-notes#screenshots,是的,不过总是会有需要从代码层面或用 CLI 命令进行截图调用,要不然怎么称之为轮子呢 🤓
    iLionel
        9
    iLionel  
    OP
       Aug 28, 2017
    UniDash
        10
    UniDash  
       Aug 28, 2017
    啊哈,我在自己的 side project https://www.v2ex.com/t/386460#reply0
    里面有用到类似的工具,但是不是很满意,下班回去试试楼主的产品。
    holajamc
        11
    holajamc  
       Aug 29, 2017
    同用 dev tool 做的,求问楼主怎么解决整页截图…
    iLionel
        13
    iLionel  
    OP
       Aug 29, 2017
    ...回复的 MD 有毒
    hoythan
        14
    hoythan  
       Aug 29, 2017
    v2 "人性化"的只有发帖有支持 markdown。
    holajamc
        15
    holajamc  
       Aug 29, 2017
    @iLionel 一直在纠结大小什么的谢谢楼主~
    holajamc
        16
    holajamc  
       Aug 29, 2017   ❤️ 1
    有一个 py 的轮子,功能类似 233~
    iLionel
        17
    iLionel  
    OP
       Aug 29, 2017
    @hoythan 原来是这样 😂
    moro
        18
    moro  
       Aug 29, 2017   ❤️ 1
    命令行保存文件名称使用什么方法。
    iLionel
        19
    iLionel  
    OP
       Aug 29, 2017
    @moro 目前还没有重命名的参数,因为是支持多个页面截图,现在还没考虑好怎么给各个截图命名 ,或许多页面时当作前缀会是一个不错的方案 🤔?我下一个版本更新上去吧 🤓
    moro
        20
    moro  
       Aug 29, 2017   ❤️ 1
    @iLionel windows 命令行下面带问号的网址 会报错。
    iLionel
        21
    iLionel  
    OP
       Aug 29, 2017
    @moro hum...[提个 Issus]( https://github.com/Runjuu/page2image/issues/new) 吧,这边我好追踪这个 issue
    iLionel
        22
    iLionel  
    OP
       Aug 29, 2017
    @moro windows 命令行下面带问号的网址 会报错的问题已经在最新的版本( 1.5.1 )中修复了
    jamesliu96
        23
    jamesliu96  
       Aug 31, 2017   ❤️ 1
    in the description, '...is AN npm package...', vow article plz

    sorry for interrupting
    iLionel
        24
    iLionel  
    OP
       Aug 31, 2017 via iPhone
    @jamesliu96 hmm,能否提个 issue 详细说明一下这个问题 🤓

    https://github.com/Runjuu/page2image/issues/new
    zhangneww
        25
    zhangneww  
       Aug 31, 2017   ❤️ 1
    @iLionel 本站只有主题可以使用 MD,回复不支持 MD。
    jamesliu96
        26
    jamesliu96  
       Aug 31, 2017 via Android   ❤️ 1
    @iLionel description 里面 a 改成 an 就好 hhh,我强迫症不要理我。。。
    iLionel
        27
    iLionel  
    OP
       Aug 31, 2017
    @jamesliu96 啊... 我懵逼了 😂 我直接把回复的英文当作报错在看..然后..一直没想到..这到底哪个地方会报这个错 💀 谢谢指正 已修改
    RyougiShiki
        28
    RyougiShiki  
       Sep 1, 2017
    挺有用的,现在主流网站没有功能还要自己装 chrome 插件。
    moro
        29
    moro  
       Sep 1, 2017   ❤️ 1
    @iLionel 截取动态加载图片的网站可能会有问题,比如 taobao 首页,是不是要模拟缓慢滚动到底。
    iLionel
        30
    iLionel  
    OP
       Sep 1, 2017
    @moro 用 CLI 命令的确是有这个问题,而且对于使用虚拟 DOM 渲染的页面,也会存在页面没有渲染完就截图的情况,第一个比较容易实现,第二个虚拟 DOM 的问题可以用判断某些元素是否存在来解决,我这个周末优化一下

    然后现在还遇到的一个问题是写在 CSS 里面的外链图片资源没办法判断是否加载完成,这就比较尴尬了...
    iLionel
        31
    iLionel  
    OP
       Sep 3, 2017
    @moro 已更新,不过页面太大的话,会因为性能问题导致截图出现一些不完整的空白块,目前还没有很好的解决方法
    esmdxx1
        32
    esmdxx1  
       Sep 4, 2017 via iPhone
    @Showfom 支持
    moro
        33
    moro  
       Sep 4, 2017
    可以提供 docker 运行的容器吗。
    iLionel
        34
    iLionel  
    OP
       Sep 4, 2017
    @moro 之前公司的运维同学貌似有弄过,我找个时间更新上去吧
    About   ·   Help   ·   Advertise   ·   Blog   ·   API   ·   FAQ   ·   Solana   ·   6074 Online   Highest 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 137ms · UTC 02:36 · PVG 10:36 · LAX 19:36 · JFK 22:36
    ♥ Do have faith in what you're doing.