はじめに

Googleの検索よく使いますよね。

検索結果の一覧をCSVでダウンロードしたい。

なので結果をCSVでダウンロードできるブックマークレットを作りました！

経緯

検索結果の一覧をCSVでダウンロードしたい。

サクッと検索して実現できる拡張機能は見つからず...。

DevTools開いてconsoleから取り出すのもな...。

先駆者の方¹がいらっしゃいましたが、既に動かなくなっていた模様。

では、ブックマークレットを作ろう！

ブックマークレットとは

ブックマークレット (Bookmarklet) とは、ユーザーがウェブブラウザのブックマークなどから起動し、ウェブブラウザで簡単な処理を行う簡易的なプログラムのことである [注釈 1]。携帯電話のウェブブラウザで足りない機能を補ったり、ウェブアプリケーションの処理を起動する為に使われることが多い。
ブックマークレット - Wikipedia

完成したブックマークレット

javascript:(()=>{const e=new Uint8Array([239,187,191]),t=[...document.querySelectorAll`div.yuRUbf`].map(e=>`${e.querySelector`a`.href}, ${e.querySelector`h3`.innerText}`).join`\n`,r=document.createElement`a`;r.download="urls.csv",r.href=URL.createObjectURL(new Blob([e,t],{type:"text/csv"})),r.dataset.downloadurl=["text/csv",r.download,r.href].join`:`,r.click()})()

使い方

ブラウザで新しいブックマークを作り、上記をURL欄に貼り付けます。
ブックマークの名前は、Google検索結果CSVダウンロードなどで良いでしょう。
Googleの検索結果画面で、登録したブックマークをクリックすると動作します。

こちら¹の記事を参考にしております。合わせて参照いただけると幸いです。

また、こちら²の記事を参考にしてcsvのダウンロードの部分を書いています。

とても参考になりました。ありがとうございます。

ソースコード

(() => {
  const bom = new Uint8Array([0xEF, 0xBB, 0xBF])
  const data = [...document.querySelectorAll`div.yuRUbf`].map(e => `${e.querySelector`a`.href}, ${e.querySelector`h3`.innerText}`).join`\n`
  const downloadLink = document.createElement`a`
  downloadLink.download = 'urls.csv'
  downloadLink.href = URL.createObjectURL(new Blob([bom, data], { type: 'text/csv' }));
  downloadLink.dataset.downloadurl = ['text/csv', downloadLink.download, downloadLink.href].join`:`
  downloadLink.click()
})()

おわりに

これでボタンポチッで検索結果一覧をCSVでダウンロードできますね！