前提・実現したいこと
画面を遷移させたあとに、遷移先のDOMを取得しようとしています。
取得したいページでスクレイピングの処理をする分にはうまく取得できます。
ただ、2ワード以上検索して情報を取得するために、ページ遷移する処理とスクレイピング処理を単純にfor文で実行しようとすると、検索したいワード群の最後のワードのページをひたすらスクレイピングしてしまいます。
そのため、ページ遷移が完了するまで待機するように、イベントハンドラを用いてhtmlの読み込みが完了したらresolveを返すようにしてみたのですが、そうするとどうもスクレイピングの処理まで到達しなくなってしまいました。
どのようにすれば意図通り、画面遷移が完了したあとにそのページでスクレイピング処理が実行されるようにできるでしょうか?
非同期処理の扱いに慣れておらず、非常に困っております。
どうかお力をお貸しいただければ幸いです。
よろしくお願いいたします。
発生している問題
ページを遷移させる関数の最初のlogが出るのみで、その先の処理が実行されません。
該当のソースコード
javascript
1// ==UserScript== 2// @name sample 3// @namespace sample 4// @author peimish 5// @version 1.0 6// @match https://www.webstagram.one/search* 7// ==/UserScript== 8 9(async () => { 10 const movePage = word => { 11 return new Promise(resolve => { 12 //検索欄にワードを入力 13 let searchBox = document.getElementById('searchText'); 14 searchBox.value = word; 15 //検索ボタンクリック 16 console.log('click: ' + word); 17 document.getElementById('searchButton').click(); 18 //----------ここで処理が終わってしまいます----------- 19 //htmlが読み込まれるまで待機 20 window.addEventListener('DOMContentLoaded', word => { 21 console.log('遷移完了: ' + word) 22 //指摘いただいた箇所の修正 23 //resolve; 24 resolve(); 25 }); 26 }); 27 } 28 29 const collectHashtags = () => { 30 let result = []; 31 if (location.href === 'https://www.webstagram.one/search/instagram') { 32 return result; 33 } else { 34 console.log('スクレイピング開始'); 35 //出力されたハッシュタグのhtmlCollectionを取得 36 let targets = document.getElementsByClassName('searchTags')[0].getElementsByTagName('li'); 37 //配列に変換 38 targets = Array.from(targets); 39 targets.forEach(function(target,index){ 40 if (typeof(target.getElementsByTagName('strong')[0]) === 'undefined') { 41 return; 42 } 43 else { 44 let tag = target.getElementsByTagName('strong')[0].innerText; 45 //先頭に#のある文字列だけ保存 46 const regExp = /^#/; 47 if(regExp.test(tag)){ 48 let posts = target.getElementsByClassName('tagMediaCout')[0].innerText; 49 const hashtag = {}; 50 hashtag.hashtag = tag; 51 hashtag.posts = posts; 52 result.push(hashtag); 53 console.log('hashtag:' + hashtag.hashtag + ' 投稿件数:' + hashtag.posts); 54 }; 55 } 56 }); 57 console.log('スクレイピング完了'); 58 return result; 59 } 60 } 61 //-----------------処理開始----------------- 62 alert('start'); 63 let hashtags = []; 64 const searchWords = ['ruby', 'java']; 65 for (let word of searchWords) { 66 await movePage(word); 67 const result = collectHashtags(); 68 hashtags = hashtags.concat(result); 69 }; 70 console.log('finish'); 71 72 console.log('取得結果'); 73 console.log('------------------------------------------------------'); 74 hashtags.forEach(value => console.log('hashtag:' + value.hashtag + ' 投稿件数:' + value.posts)); 75 console.log('------------------------------------------------------'); 76 77 alert('done'); 78})();
補足情報(FW/ツールのバージョンなど)
実行環境: tampermonkey
回答1件
あなたの回答
tips
プレビュー