基于需求的网站搜索截图模拟实战

需求：

批量网站自动使用站内检索关键词并保存截图

1. 截图需要是浏览器自带的Control + P截的 pdf 文件；
2. 使用Python开发

实现：

针对 chrome 浏览器，自然第一时间想到的便是 selenium.

下载 chrome 浏览器内核 chromedriver，接着就可以对chrome操作了

from selenium import webdriver
from PIL import ImageGrab

chromedriver="path"
os.environ["webdriver.chrome.driver"] = chromedriver
browser = webdriver.Chrome(chromedriver)
# browser.maximize_window()  # Maximize the interface
url = "url"  
browser.get(url)
browser.find_element_by_id("#").send_keys("python")
im = ImageGrab.grab()  # screenshot function
im.show() # show result
browser.quit()

代码解释:
	path--chromedriver.exe存放的文件
	url--需要操作的网址
	#--需要操作的搜索框的id
	python--代表输入的搜索词

如果认真看了需求的同学到此肯定会说，你这少一步啊，是的，确实少了一步【所以读懂需求很重要】

具体来说就是：要求截的是搜索结果页面，我截的是输入关键词之后的页面

那么，继续…

很多人说简单啊，直接模拟点击按钮啊

那…如果是这样的呢

再如果是这样的呢

<div class="..">
 <form id=".." name=".." method="get" action="/so/s">
  <input name=".." id=".." class=".." value="请输入要查询的内容" type="text">
   <div class=".."><i class=".."></i></div>
   <div class="search_btn"><input type="image" src="./images/**.png"></div>
 </form>
</div>

当我意识到前端基础薄弱的时候，追悔莫及。

试着想一想，除了id能作为 select 选择器外，还有啥，对 class ，xpath

根据 CSS 语法标准，id 选择器前面加 “#” ，class 前面加 “.”

对于 id 和 class 都很简单，直接从检查元素里边读取就OK，对于 XPath

XPath 是XML路径语言，可以用来做HTML文档的搜索，所以可以用来信息提取
XPath提供了100个内建函数，几乎可以定位一切节点

对于 chrome 可以直接右键 Copy XPath ，XPath不做过多介绍 https://www.w3.org/TR/xpath/

browser.find_element_by_xpath('xpath').click()
time.sleep(3)

到此基本功能算是完成了，但需要提醒的一点是，ImageGrab 包下的 grab 函数是对全屏进行捕捉，自然截图结果不太舒服

寻求一种截图方便且对适当的内容进行截图

换一种方式同时解决 chrome 的安全验证和截图不理想的问题：

介绍 chrome 的双胞胎，chromium

可以了解下chromium ，就知道为什么可以解决第一个问题了。

那么浏览器内核也不需要了，直接导包 pyppeteer 【首次运行会自动下载chromium浏览器】

from pyppeteer import launch
import asyncio
from lxml import etree

async def main():
    browser = await launch(headless=False,args = ['--disable-infobars'])
    page = await browser.newPage()
    '''
    # change size
    width,height = screen_size()
    await page.setViewport({
       'width': width,
       'height': height
    })
    '''
    await page.goto(address)
    await page.type(id_[address], "python")
    await page.click(class_[address])
    await asyncio.sleep(3)
    await page.screenshot({'path': 'example.png'})
    await browser.close()

asyncio.get_event_loop().run_until_complete(main())

代码解释：
	address--网址
	id_,class_--两个字典，存储检索框和按钮的选择器
	python--模拟输入检索词
	path--保存路径，默认在当前文件夹
	example.png--图片文件名