将网页转换为图片实战

922 阅读2分钟

微信小程序转发到群时, 卡片的图片通常表达一些信息. 默认是在转发时小程序所在页面的截屏, 但此时所在页面并不是所需的页面, 幸好页面是可以指定的url的.但如何根据需要来定制图片呢?

  • 方案1, 利用python的pil自己画图. 如果内容很少, 样式比较固定, 则比较适合. 但是如果内容经常变动, 这种方案工作量就比较大了.
  • 方案2, 利用headless browser截屏, 比如phantomJS或chrome headless特性, 特点是比较灵活, 适合页面经常变动.
  • 方案3, 方案2的服务化, 网上有专门的api,但是定置化有限, 并且要银子.

此处我们自己我们选择headless chrome来实现, 为啥要选它呢?因为这货出来后phantomJS已经停止维护了

(1)centos7.0 安装chrome 在server上安装headless chrome比较繁琐. centos6.5不能安装chrome. 原因是chrome所以依赖的图形库,需要高版本的libc, 要更换libc必须升级OS. 所以必须选择centos7. centos6.5升级7太花时间,有很多步骤, 如无必要,尽量另找机器 以下centos7.0安装chrome的步骤 (1) 安装yum源

vim /etc/yum.repos.d/google-chrome.repo
[google-chrome]
name=google-chrome
baseurl=http://dl.google.com/linux/chrome/rpm/stable/x86_64
enabled=1
gpgcheck=1
gpgkey=https://dl.google.com/linux/linux_signing_key.pub

(2)安装chrome

yum install google-chrome-stable

(3)安装chromedriver

(4)python安装selenium

pip install selenium

(5)安装字体

yum -y install fontconfig ttmkfdir
mkdir  /usr/share/fonts/chinese
将windows的Arial字体上传到/usr/share/fonts/chinese
chmod -R 755 /usr/share/fonts/chinese
vi /etc/fonts/fonts.conf
fc-cache        生成字体缓存

(5)安装gnome环境

yum groupinstall "x Window System" --setopt=group_package_types=mandatory,default,optional
yum groupinstall "GNOME Desktop"

(7)此时可以测试一下:

[root@vultr ~]# cat test_chrome.py 
#!/usr/bin/python
# -*- encoding: utf8 -*-
from selenium import webdriver
from selenium.webdriver.chrome.options import Options

chrome_options = Options()
# 无头模式启动
chrome_options.add_argument('--headless')
chrome_options.add_argument('--disable-gpu')
chrome_options.add_argument('--no-sandbox')
chrome_options.add_argument('--disable-gpu')
chrome_options.add_argument('--window-size=1980x960')
#chrome_options.add_argument('--lang=zh-CN')


# 初始化实例
driver= webdriver.Chrome(chrome_options=chrome_options)
# 请求百度
driver.get("http://www.baidu.com")
driver.get_screenshot_as_file('baidu.png')

执行test_chrome.py 可以在当前目录下看到baidu.png, 显示真是百度的哪个框框