Google Chromeの拡張機能を使って、スクレイピングをしたいと考えています。
今やろうとしているのは、Google検索結果のタイトルを3ページ分取得したいです。
困っているのは、1ページ目を表示されている状態で、拡張機能を実行し、
1ページ目のタイトルは取得できるのですが、「次へ」をクリックして表示される
2ページ目のタイトルが取得できずに困っています。
ご回答をお待ちしております。
※具体的なサンプル例でのご回答を希望。
###フォルダ構成 [myscraper]
1階層 | 2階層 | 3階層 |
---|---|---|
[foreground] | ||
[js] | ||
main.js | ||
popup.html | ||
doScraping.js | ||
manifest.json |
###manifest.json
json
1{ 2 "name": "My Scraper", 3 "description": "scraping test", 4 "version": "0.0.1", 5 "manifest_version": 2, 6 "browser_action": { 7 "default_popup": "foreground/popup.html" 8 }, 9 "content_scripts": [{ 10 "matches": ["http://www.google.co.jp/*", "https://www.google.co.jp/*"], 11 "js": ["doScraping.js"], 12 "run_at": "document_end" 13 }], 14 "permissions": [ 15 "tabs" 16 ] 17}
###doScraping.js
js
1chrome.runtime.onMessage.addListener(function(msg, sender, sendResponse) { 2 var result = "<ul>"; 3 var el_titles = document.querySelectorAll("div > div.r > a:nth-child(1) > h3"); 4 5 for(var i = 0; i < el_titles.length; i++){ 6 result += "<li>" + el_titles[i].innerHTML + "</li>"; 7 } 8 9 //2ページ目を取得するため「次へ」をクリック 10 document.querySelector("#pnnext").click(); 11 12 el_titles = document.querySelectorAll("div > div.r > a:nth-child(1) > h3"); 13 14 for(var i = 0; i < el_titles.length; i++){ 15 result += "<li>" + el_titles[i].innerHTML + "</li>"; 16 } 17 18 result += "</ul>"; 19 sendResponse(result); 20 return true; 21});
###popup.html
html
1<!doctype html> 2<html lang="en"> 3<head> 4 <meta charset="UTF-8"> 5 <title>Document</title> 6</head> 7<body> 8<button id="ChromePlugin-doScrape">GET</button> 9<div class="result-wrapper" style="width: 300px;"> 10 <h3>RESULT</h3> 11 <div id="ChromePlugin-result-disp"></div> 12</div> 13 14<script src="js/main.js"></script> 15 16</body> 17</html>
###main.js
js
1document.addEventListener("DOMContentLoaded", function() { 2 document.getElementById("ChromePlugin-doScrape").addEventListener("click", function(){ 3 4 chrome.tabs.query({active: true, currentWindow: true}, function(tabs) { 5 chrome.tabs.sendMessage(tabs[0].id, {}, 6 function(msg) { 7 document.getElementById("ChromePlugin-result-disp").innerHTML = msg; 8 }); 9 }); 10 11 }); 12});
###使い方
0. Chrome拡張機能をデベロッパーモードで有効にする。
0. Google検索画面を表示して、google検索を実行する。
0. 有効にした拡張機能を実行すると表示される「GET」ボタンを押下する。
すると、タイトルの一覧が表示される。
あなたの回答
tips
プレビュー