質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.46%
WebSocket

WebSocketとは双方向・全二重コミュニケーションのためのAPIでありプロトコルのことを指します。WebSocketはHTML5に密接に結びついており、多くのウェブブラウザの最新版に導入されています。

PHP

PHPは、Webサイト構築に特化して開発されたプログラミング言語です。大きな特徴のひとつは、HTMLに直接プログラムを埋め込むことができるという点です。PHPを用いることで、HTMLを動的コンテンツとして出力できます。HTMLがそのままブラウザに表示されるのに対し、PHPプログラムはサーバ側で実行された結果がブラウザに表示されるため、PHPスクリプトは「サーバサイドスクリプト」と呼ばれています。

Q&A

0回答

623閲覧

Google Chrome Headless BrowserでDOM.querySelectorが失敗する

hoge2010

総合スコア0

WebSocket

WebSocketとは双方向・全二重コミュニケーションのためのAPIでありプロトコルのことを指します。WebSocketはHTML5に密接に結びついており、多くのウェブブラウザの最新版に導入されています。

PHP

PHPは、Webサイト構築に特化して開発されたプログラミング言語です。大きな特徴のひとつは、HTMLに直接プログラムを埋め込むことができるという点です。PHPを用いることで、HTMLを動的コンテンツとして出力できます。HTMLがそのままブラウザに表示されるのに対し、PHPプログラムはサーバ側で実行された結果がブラウザに表示されるため、PHPスクリプトは「サーバサイドスクリプト」と呼ばれています。

0グッド

0クリップ

投稿2020/09/06 12:17

前提・実現したいこと

Google Chromeのヘッドレスブラウザを起動し、PHPからWebSocketを使って通信していますが、DOM.querySelectorでノードの取得に失敗します。
以下のエラーメッセージが返ります。

発生している問題・エラーメッセージ

Could not find node with given id

該当のソースコード

最後のDOM.getOuterHTMLは成功しているので、ヘッドレスブラウザとの通信は問題がないと思っています。

PHP

1<?php 2 3// Composer 4require('vendor/autoload.php'); 5use WebSocket\Client; 6 7// EndPointの取得 8do{ 9 $endpoints = json_decode(`curl -s http://localhost:9222/json`); 10} while(empty($endpoints)); 11$endpoint = $endpoints[0]->webSocketDebuggerUrl; 12 13// WebSocketの初期化 14$client = new Client($endpoint,['timeout' => 60]); 15$client->send(json_encode([ 16 'id' => 2, 17 "method" => 'Page.navigate', 18 "params" => ['url' => 'http://example.com/'] 19])); 20 21// ページのルートノードを取得 22$client->send(json_encode([ 23 'id' => 3, 24 'method' => 'DOM.getDocument', 25])); 26while( $data = json_decode($client->receive() ) ){ 27 if( $id = $data->id ?? null ){ 28 if( $id == 3 ){ 29 $root_node = $data->result->root; 30 break; 31 } 32 } 33} 34 35// querySelectorでノードを取得する 36$client->send(json_encode([ 37 'id' => 4, 38 'method' => 'DOM.querySelector', 39 'params' => [ 40 'nodeId' => $root_node->nodeId, 41 'selector' => 'h1', 42 ] 43])); 44while( $data = json_decode($client->receive()) ){ 45 if( $id = $data->id ?? null ){ 46 if( $id == 4 ){ 47 var_dump($data); 48 break; 49 } 50 } 51} 52 53// HTMLソースを取得する 54$client->send(json_encode([ 55 'id' => 5, 56 'method' => 'DOM.getOuterHTML', 57 "params" => ['backendNodeId' => $root_node->backendNodeId] 58])); 59while( $data = json_decode($client->receive()) ){ 60 if( $id = $data->id ?? null ){ 61 if( $id == 5 ){ 62 echo '<textarea style="width:100%; height:20em;">'; 63 echo $data->result->outerHTML; 64 echo '</textarea>'; 65 break; 66 } 67 } 68} 69

試したこと

何を試せば良いでしょうか?アドバイスを頂きたいです。

補足情報(FW/ツールのバージョンなど)

WebSocketはcomposerでインストールした以下のライブラリーを利用しています。

{ "require": { "textalk/websocket": "1.*" } }

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

まだ回答がついていません

会員登録して回答してみよう

アカウントをお持ちの方は

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.46%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問