現在地

Yahoo! pipes入門

作成者:mattz 作成日:水, 09/16/2009 - 17:23

「アメブロ rss カテゴリ別」のような検索キーワードでいらっしゃる方が結構いるのですが、アメブロさんはどうもそのような機能は提供されていないご様子。個人的に検索ニーズに応える月間実施中(今作った)なので、Yahoo! pipesを使ってアメーバのブログのカテゴリ(アメブロ的にはテーマか?)別のRSS を生成する方法など書いてみようと思う。

モデルケースが必要なので、アメブロのトップに行ってみた。一般の人のブログではなんなので、適当な芸能人ブログを使おうと思ったのだが、ランキング上位のほとんどの芸能人がろくにテーマを使ってません。テーマ:ブログばっかり。叶姉妹はまぁまぁ使ってるようなんですが、この人たちあまり好きじゃないのよねぇ、とか思ってたらいいブログ見つけた。「渋谷ではたらく社長のブログ」。これでいいじゃん。お誂え向きに『著作権保護のため、記事の一部のみ表示されております。』もしてやがるし。全文配信化のサンプルにもなるというね。

そろそろ具体的に話を進めます。

Yahoo!のアカウントを取得する

Yahoo! pipesを利用するには、Yahoo!にアカウントが必要です。ちなみにYahoo!JAPANのアカウントは使えないので日本以外のYahoo!でアカウント取得して ください。まぁ、www.yahoo.comで作っとけば一番確実。例外はあるかもしれませんが、日本以外ならどこのYahoo!でアカウント作ってもOKなはずですが、検証はしてませんので。

Google Chromeをインストール

まず、これは必須でもなんでもありません。Pipes' editorはいわゆるWebアプリなんですが、Yahoo!の推奨する環境はFirefox、IE7以降、Safariとなっています。これらのブラウザが既にインストールされているならそれを使っていただいて構いませんし、サポートしてねーよというダイアログこそ表示されるもののOperaでだって編集はできます。ただ、理屈は知りませんがPipes' editorはWebKitと相性がよいようなので。SafariもWebKitですけど、Safariはねぇ……

pipeを作る

入門とかうたっておきながら、いきなり作り始めます。こんなもん、実際に触るのが一番だし。
http://pipes.yahoo.com/pipes/ にログインしたら、「Create a pipe」というリンクをクリックします。

こんな感じの画面(ウィンドウは小さくしてます)になりますので、まずは「Fetch Feed」というボタンを右の方眼紙っぽいところにドラッグするか、右側の「+」ボタンを押します。

左側に並んでいるいろいろなボタンはモジュールといって、それぞれにいろんな機能を持っています。Fetch FeedモジュールはRSS(0.9も1.0も0.91も2.0も 全部含む)とかAtomとかそういういわゆるRSSリーダが扱うようなデータを構文解析して読みやすくしてくれるモジュール。RSSのURLを渡してあげるといい仕事をします。

渋谷ではたらく社長のブログのRSSのURLはhttp://feedblog.ameba.jp/rss/ameblo/shibuya/rss20.xmlなので、この文字列をコピペして、URLの欄に 貼り付けます。ちゃんとフィードが取得できるURLの場合は、この画像ではオレンジの三角になっている部分が、サイトのfavicon(ない場合は?マーク)に変わり、画面の下の方のデバッグ領域にエントリタイトルの一覧が表示されます。されない場合は、URLをよく確認してください。

今回は目的がカテゴリ(テーマ)別にRSSを生成する、ですが、RSSの形式や内容によっては、各フィードにカテゴリ情報が含まれていたりして、この段階でFilterモジュール(詳しくは後ほど)を使えば済んでしまう場合があります。残念ながらアメーバさんはあまりRSSでの配信には積極的ではないようですので、それは無理。ということで、次のステップに進みます。

LoopモジュールとFetch Pageモジュール

pipesは基本的にmoduleの組み合わせで目的を達成させるツールです。今から使うのが、LoopモジュールとFetch Pageモジュール(この二つは結構よく使うのでここでマスターしましょう)。Loopモジュールは左側のメニューのOperatorsグループの中の一つなので、まずはそこをクリックします。メニューが展開して、Loopっていうのが出てくるので、それをさっきと同じようにドラッグするか「+」をクリックします。

Loopモジュールは、RSSに含まれる複数のitemそれぞれについて、同じ処理を繰り返したいときに使うモジュールです。Fetch Pageモジュールは、Fetch Feedモジュールとよく似た名前ですが、機能も似ていて、URLを指定すると、そのページの内容を丸ごと取得してきます。Fetch Feedと違うのは、特に構文解析などはせず、ソースそのままの文字列(本文中に相対パスで書かれているようなものを絶対パスに変換してくれたりはする。意味が分からない人は無視して くれてOK)を返してくれるモジュールです。

これだけでは分からないので、実際にやってみましょう。

まず、Fetch Feedモジュールの出力(下側の水色○)とLoopモジュールの入力(上側の水色○)をつなげます。やり方はマウスでみよ~んとつなげるだけ。入力とか出力とか何言ってんの?というあなた。意味分からなくていいから上が入力、下が出力と覚えてください。とにかく、こうやってつなげることで、Fetch Feedモジュールがとってきたフィード情報を、Loopモジュールに渡してあげることができます。

Loopモジュールは、受け取ったRSSのitem(要はブログのエントリ)の1個1個について同じ処理をすると書きましたが、Loopモジュールはお腹に穴があいていますね。ここにその「処理をする」モジュール(や既に作ってあるpipe)を入れてあげます。今ここではFetch pageモジュールを入れます。左側のメニューのSourcesをクリックして、Fetch pageモジュールを表示させたら、Loopモジュールのお腹の穴の中にドラッグします。なお、お腹に入れられるモジュールのときは、穴のふちが赤くなるので覚えといてください。

こんな感じになってればOKなので、Fetch PageモジュールのURL欄の右側の右向きの三角をクリックします。

いろいろ選択肢があるんですが、ここでは「item.link」ってやつを選びます。item.linkというのは、Loopモジュールが扱う一つ一つのitemのリンク先を表します。要するに、ブログの記事一つ一つのURL(必ずしもそうとは言い切れませんが)。つまり、Fetch Pageモジュールに個別記事のURLを渡して、記事内容を取得してきてね、と命令していることになります。

とってきた記事内容は、つまりそのページのソースです、サイドバーだの何だのといったあまり必要ではないものも含んでいますので、必要な部分だけを取り出すのが必要になってきます。ここで使うのが、Fetch Pageモジュールの「Cut content from ____ to ____」の部分。ブログのトップではなくて、どれか一つの記事をブラウザで表示して、「ソースの表示」をします。

この辺は多少経験も必要になってきてしまいますが、ブログの場合、大体テーマとかスキンとはテンプレートとかがあるので、大体は機械的に判断できるようなつくりになっています。

今回の場合必要なのは、エントリのカテゴリ(テーマ)と、ついでに本文なので、それを切り出せるように始まりの文字と終わりの文字を探します。

この例では、From(始まり)として<!--//.entry_head-->、To(終わり)に<!--entryBottom-->と設定しました。本文を取りたいだけであれば、始まりの方は<div class="contents">でいいと思いますが、今回はテーマも欲しかったのでこのように設定し、さらに、delilmiterとして<span class="date">というのも使っています。

この辺のモジュールのさまざまなオプションやら何やらを一つ一つ説明していくと長くなりますし、そもそも僕がめんどくさいので、省略します。Pipes editorの左下にhelp textも表示されていますし使用例なんかも見ることができますので、詳しく知りたい人はそちらを参照のこと。

Renameモジュール

次は説明が難しいのですが、まずは実際にやってみます。使うのはRenameモジュール。これをLoopモジュールの下に配置してLoopモジュールとつなげます。Renameモジュールの「+Mappings」というのを1回クリックし、入力欄を二つにします。

1個目の入力欄。左側には「item.loop:fetchpage.0.content」、真ん中の選択肢はRename、右側の入力欄には「category」と入れます。
2個目の入力欄。左側には「item.loop:fetchpage.1.content」、真ん中の選択肢はRename、右側の入力欄には「description」と入れます。

Regexモジュール

これだけですと、まだまだ余計なものがくっついているのでそれを取っ払います。使うのはRegex(正規表現)モジュール。

今のこの時点でcategoryがどんな値になっているかというと、[<span class="theme">テーマ:<a rel="nofollow" target="_blank" href="http://ameblo.jp/shibuya/theme-10000000241.html">社長業</a></span>]こんな感じ。ここで欲しいのはこの例だと「社長業」の部分だけです。また、description(RSSリーダで読むのは結局ここ)にも、特に必要ではない日付情報が入っちゃっています。これはまぁ、Fetch Pageのやり方次第なのですが。

やはり「+Rules」を1回クリックして入力欄を1個増やします。

1個目の入力欄。左側には「item.category」、真ん中のreplaceには「(<.*?>|テーマ:)」、右側の入力欄は空っぽのまま、gとmにチェック。
2個目の入力欄。左側には「item.description」、真ん中のreplaceに「^.*?<」、右側の入力欄には「<」と入れます。

Filterモジュール

次がやっと出てきました。Filterモジュール。カテゴリ別配信の肝です。これは、それぞれのitemが特定の条件を満たすものだけ抽出するモジュール。いろいろオプションを設定すると、特定の条件を満たすものを排除するとか、条件を複数設定して全てに一致するなら、とか、どれかに一致するなら、など細かく設定できます。とはいえ、今は特定のカテゴリだけを抽出したいだけなので、次のように設定します。

右側のやつ。これはText Inputモジュールといいまして、任意の文字列をインプットしてもらうためのモジュールです。ホントに特定のカテゴリだけを抽出したいだけなら、Filterモジュールの右側の入力欄にその抽出したいカテゴリ(テーマ)を設定してやればいいのですが、カテゴリは自由に設定できるようにしよう、というのが、これ。これを使わないと、カテゴリ毎にパイプを作らなければならなくなってしまいますので、任意のカテゴリ名を入力できるようにこうしました。これなら出来上がったpipeのURLにカテゴリを含めることができます。

保存して実行

とりあえず、このブログの特定カテゴリのエントリだけを配信するpipeは完成なので、Filterモジュールの出力をPipe Outputにつなげ、このPipe自体の名前を入力してSaveします。Saveができると、上の方に「Pipe Saved Run Pipe...」と表示されますので、「Run Pipe...」の部分をクリックしてみましょう 。

いま僕が作ったpipeはこちら⇒「渋はた社ブ(カテゴリ別)」。

アクセスしたら、category欄に例えば「ブログ」とか「アメブロ」とか入力して[Run Pipe]ボタンを押します。Google Readerに登録するなら、そこにボタンがあるのでそれを押せばいいし、LDRなどで購読するには、「Get as RSS」のところをクリックするとか、右クリックしてリンクURLをコピーするとかして、どうにかしてください。

最後めんどくさくなって適当になりましたが、今日のところはこの辺で。多分、次はないけど。

質問などあれば、僕の分かる範囲でお答えします。

ま、でも、RSSをpipesでゴニョゴニョするのは、簡単な部類なんだな。楽しいのはRSSを出力していないサイトをゴニョゴニョすることであり。はてなアンテナでもいいんだけども。

タグ: