Help us understand the problem. What is going on with this article?

Chromeコンソールでお手軽クローリング

More than 5 years have passed since last update.

PhantomJSはすごく便利なのですが、ちょろっと使いたいだけのときにスクリプトファイルを用意するのは若干面倒です。対話モード(REPL)も用意されていますが、対話的に使うだけならChromeの方が使いやすい場面が多いです。

今回の想定シーンは、「GitHubでStarしてくれた人の一覧が欲しい」というようなケース。時々、Issueで全員に連絡したいことがありますよね。↓ こういうやつ。

@user1, @user2, @user3, ...

GitHubだとJSONを返すAPIが用意されているので、それを使います。

コンソールを開く

新規タブを開いて、about:blankに移動します。まっさらな状態にするのがポイントです。

about-blank.png

jQueryを仕込む

PhantomJSを使う場合もそうですが、素のJavaScriptだと面倒が多いので、jQueryを仕込みます。次の2行を実行すればOK。

> (script = document.createElement('script')).src = 'http://code.jquery.com/jquery-latest.min.js'
> document.getElementsByTagName('head')[0].appendChild(script)

about-blank.png

APIからデータを取得

キーが必要なAPIの場合は一工夫要りますが、公開のものであれば次の3行でOK。JSONデータが入ります。

> result = {}
> url = 'https://api.github.com/repos/cognitom/symbols/stargazers'
> $.getJSON(url, function(data){ result = data })

データを加工

まずは取得できたかの確認。

> result

配列かオブジェクトが表示されればOK。続けて、必要な文字列に整形します。正規表現を使うまでもなかった!

> result.map(function(x){ return '@' + x.login }).join(', ')

無事、冒頭のような @user1, @user2, @user3,...という文字列を得られました。実行結果のスクリーンショットは、こんな感じになります。

about-blank.png

最後に

上記の事例は、APIが用意されているので「クローリング」というほどのものでもないですが、HTMLページから取得する場合もコンソールが使えます。"about:blank"に行く代わりに対象ページを開いて、jQueryが導入済みならそれを、なければこのページの説明と同様に追加して、あとはDOMを参照してデータを取得すればOK。コンソールからはワンライナーの方が使いやすいので、map関数が活躍しますね。

Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
Comments
No comments
Sign up for free and join this conversation.
If you already have a Qiita account
Why do not you register as a user and use Qiita more conveniently?
You need to log in to use this function. Qiita can be used more conveniently after logging in.
You seem to be reading articles frequently this month. Qiita can be used more conveniently after logging in.
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
ユーザーは見つかりませんでした