Chrome Headless
什么是Chrome Headless
Headless Chrome 是 Chrome 瀏覽器的無(wú)界面形態(tài),可以在不打開(kāi)瀏覽器的前提下,使用所有 Chrome 支持的特性運(yùn)行你的程序,簡(jiǎn)而言之,除了沒(méi)有圖形界面,headless chrome具有所有現(xiàn)代瀏覽器的特性,可以像在其他現(xiàn)代瀏覽器里一樣渲染目標(biāo)網(wǎng)頁(yè),并能進(jìn)行網(wǎng)頁(yè)截圖,獲取cookie,獲取html等操作。 而對(duì)于寫爬蟲的同學(xué),很多都會(huì)面臨都一個(gè)問(wèn)題,那就是數(shù)據(jù)都是通過(guò)動(dòng)態(tài)渲染,甚至是加密得到的,普通的分析接口模式早已無(wú)法滿足需求,因此我們引入Chrome Headless 來(lái)解決數(shù)據(jù)渲染問(wèn)題。
部署 Chrome Headless
因?yàn)榄h(huán)境部署不是本文的重點(diǎn),因此我們直接推薦docker。
docker pull alpeware/chrome-headless-trunk
docker run -d -p 9222:9222 alpeware/chrome-headless-trunk
訪問(wèn)debug 地址即可得到接口信息
curl http://{HOST}:9222/json
以下例子中,{HOST}定義的IP主機(jī)響
驅(qū)動(dòng)Chrome Headless
Chrome Headless 可以通過(guò)websocket協(xié)議進(jìn)行遠(yuǎn)程驅(qū)動(dòng)debug。首先我們引入easyswoole的websocket客戶端。
composer require easyswoole/http-client
我們以網(wǎng)站 https://datacenter.jin10.com/price 為例子,我們打開(kāi)可以發(fā)現(xiàn),里面的數(shù)據(jù)都是通過(guò)websocket實(shí)時(shí)刷新的,這個(gè)時(shí)候,通過(guò)傳統(tǒng)手段抓接口的手段,是很難實(shí)現(xiàn)的。模擬實(shí)現(xiàn)如下:
use EasySwoole\HttpClient\HttpClient;
use EasySwoole\Spl\SplBean;
use Swoole\WebSocket\Frame;
static $i = 0;
//定義命令bean,具體協(xié)議格式可以看 Chrome Headless 文檔
class Command extends SplBean{
protected $method;
protected $id;
protected $params;
protected function initialize(): void
{
if(empty($this->id)){
global $i;
$i++;
$this->id = $i;
}
}
}
//用websocket協(xié)議去驅(qū)動(dòng)Chrome Headless
go(function (){
$targetUrl = 'https://datacenter.jin10.com/price';
$ch = curl_init('http://{HOST}:9222/json');
curl_setopt($ch,CURLOPT_RETURNTRANSFER,true);
$data = json_decode( curl_exec($ch) ,true);
$client = new HttpClient($data[0]['webSocketDebuggerUrl']);
if($client->upgrade()){
//打開(kāi)URL
$command = new Command([
'method'=>'Page.navigate',
'params'=>[
'url'=>$targetUrl
]
]);
$client->getClient()->push($command->__toString());
$client->recv(1);
//模擬等待渲染
\co::sleep(2);
//實(shí)現(xiàn) js 語(yǔ)句
$command = new Command([
'method'=>'Runtime.evaluate',
'params'=>[
'expression'=>"var p = document.querySelector('#J_pricewall > div:nth-child(1) > ul > li:nth-child(1)').innerHTML;p;"
]
]);
$client->getClient()->push($command->__toString());
//此處就可以得到渲染后的數(shù)據(jù)了
$data = json_decode($client->recv()->data,true)['result']['result']['value'];
var_dump($data);
}else{
var_dump('handshake fail');
}
});
以上教程僅供學(xué)習(xí)之用,請(qǐng)勿用于非法用途