[Pipes] Yahoo! Pipes講座02（Text/URLInput、Yahoo!Search、Filter、Regex）

Yahoo! Pipes講座の2回目。これまでのエントリーはこちら。

• [Pipes] Yahoo! Pipesを勉強したい方へ
• [Pipes] 講座01（FetchFeed、Sort）

前回は初心者向けに初めの一歩的な内容でした。その後の12回のバランスを再構成し、目次の見直し等しれーっと行っています。今日は、一気にステップUPです！

前回の補足（デバッガーの見方）

前回の「講座01」を使い、デバッガーの見方を補足しときます。Pipeで作成されたRSSは、見た目上だとtitle（記事タイトル）description（記事中身）pubDate（配信日時）くらいしか見えないんですが、内部的には他にも色々な情報を保持しています。

キャンバスに配置された任意のモジュールを選択すると、そこまでの情報取得の結果をデバッガーに吐いてくれます。これを見ながら、取得がうまくいってるか確認できるのです。最後の結果が見たい場合には「Pipe Output」を選択します。

RSSフィードによって情報の種類は様々ですが、どのRSSフィードも共通的に持っている情報があります。title、description、pubDateは代表選手。私が良く使う情報のみ、以下に列挙してみます。他のはあんまり使ってません…。

• 「link」元サイトへのリンクが入ってる。
• 「description」RSSフィードの中身。この中身を加工していく。
• 「dc:creator」RSSフィードの投稿者。たまに使う程度。
• 「title」RSSフィードのタイトル。この中身も良く加工する。
• 「category」タグとか入ってくる。iTunes情報だとジャンルが入るみたい。
• 「pubDate」配信された日時が入ってる。並び順変更とかで使う。

上記のような情報を総称して「item」と呼びます。

itemの中見をPipeの中で指定して使う場合、前回も説明しましたが「item.pubDate」のように記載します。他にも「${pubDate}」のように記載することもあるのですが、そちらはRegexモジュールを説明する際にでも、詳しくご紹介します。

AppHtmlの解説（iTunesリンクの取得）

いよいよ今日からは、AppHtmlの中身の説明をしていきます。実は、今のAppHtmlのPipeは、中身がぐちゃぐちゃ。なので微妙に説明しにくい。ということで、この講座を通じて、綺麗なPipeに作り替えちゃおうと個人的には目論んでます(￣ー￣)ﾆﾔﾘ

AppHtmlは、利用者が任意に指定した検索ワードからiTunesのリンクを取得し、iTunesのWeb情報から必要情報のみを入手、マッシュアップしてから結果を返します。今日は、検索ワードからiTunesのリンクを取得するまでの話に着目します。

AppHtmlは、検索のヒット率を重要視してます。ヒットしすぎてもうざい、ヒットしないはもっとダメ。ヒットさせた後にどれだけノイズを除去するか。そこがポイント。試行錯誤の結果、現在、検索は以下の3つの手法を用いて行っています。

• Yahoo! SearchによるiTunesリンクの取得
• Google APIによるiTunesリンクの取得
• Google Web検索（Dapper経由）によるiTunesリンクの取得

3つの検索を同時並行に走らせ、ヒットしたiTunesリンクの重複を省き、後続の処理へと繋いでいきます。最近気付いたのですが、一番下のDapper経由の検索がうまくいって無いみたいです…。理由はGoogleがDapperからのアクセスを拒否してるっぽい。Googleは、Web検索のRSS化に対して前にも話題になりましたが敏感なようですね（；^ω^）

ということで本講座で作成するAppHtmlは、Dapper経由のGoogle検索は使わない方向とします。Yahoo! Searchがかなり良いのでそちらで代替したいと思います。今日は3つの検索方法の内「Yahoo! Search」の部分を作ってみます。

完成系はこちら。

• Pipes: 講座02（Yahoo! Search）

Yahoo! Searchモジュールを使う

前回と比べると一挙にレベルがあがります。今回、Yahoo! Pipesの弱点というか癖についても説明し、その対策案なども説明していきます。今回は、前回とは異なる6種のモジュールを駆使して、Yahoo! Searchの結果を返すPipeを作ります。

手順1（Text Inputモジュール）
Yahoo! Searchモジュールが今回の肝なんですが、このモジュールに渡す2つのInputをPipeの外から指定できるようにします。PipeにInputを渡すモジュールには、値の属性によっていくつか種類があるのですが、まずは「Text Input」を使います。

ライブラリから「Text Input」を選び、キャンパスへドラッグ&ドロップします。

Text Inputを使うと「Run Pipe」時に入力欄が出てきます。この入力欄に値を入れることでひとつのPipeでも複数の結果を返してくれるようになります。

• 「Name」Pipe内で使う呼び名。「kwd」と入れる。
• 「Prompt」入力値のラベル名。こちらも「kwd」と入れる。
• 「Position」入力値の表示順番。「1」と入れる。
• 「Default」入力値の初期値。「textforce」と入れる。アプリ名の指定。
• 「Debug」Pipe内の初期値。Defaultと同じ値を入れる。

上記の中で最初の設定以降も使うのは「Debug」でしょうか。Pipe内で挙動確認する際には、この「Debug」の中身を色々と変更して動作確認をしていきます。

手順2（URL Inputモジュール）
Text Inputと同様に、URLをPipeの外から指定できるようにします。Textと何が違うのか？ Pipeでは同じURLでもTextに書かれたものと、URLは分けています。モジュールによって、Textを必要とするもの、URLを必要とするものがあるので、適宜、使い分けていくと良いです。ちなみにYahoo! SearchモジュールはURLを必要とします。

ライブラリから「URL Input」を選び、キャンパスへドラッグ&ドロップします。

先ほどのText Inputと属性が違うだけで指定する箇所や意味は一緒です。

• 「Name」Pipe内で使う呼び名。「url」と入れる。
• 「Prompt」入力値のラベル名。こちらも「url」と入れる。
• 「Position」入力値の表示順番。「2」と入れる。
• 「Default」入力値の初期値。「http://itunes.apple.com/jp/app」と入れる。
• 「Debug」Pipe内の初期値。Defaultと同じ値を入れる。

Defaultに入ってるURLは、iTunesサイトの中でも「AppStoreの日本語サイト」で使われるURLです。この指定によって「日本のAppStore限定」という縛りを作ります。

手順3（Yahoo! Searchモジュール）
今回の目玉モジュール。Yahoo!の検索結果をRSSにして返してくれる神モジュールです。こいつの存在を知ったのは、講座開設後。やっぱり振り返ることで新たな発見があるんですね。自分自身にもメリットがある。教えることで教えられる。素敵です。

ライブラリから「Yahoo! Search」を選び、キャンパスへドラッグ&ドロップします。

手順1と手順2で作成したInputモジュールとYahoo! Searchモジュールを繋ぎます。

• 「Search for」ここに検索ワードを入れる。日本語もOK。
• 「Site restriction」サイト縛りをしたい時に指定。「+」で複数指定可。

ここまでの手順でYahoo! Searchが動くはず。Yaoo! Searchのモジュールを選択すると結果がデバッガーに表示されるので、確認して下さい。うまく取れてるはず。

結果をフィルタリングする

デバッガーを見て気付かれたでしょう。そう、余計なものまでヒットしてきてるんです。これらのノイズを取り除かないといけません。何が余計なのかじっくり確認します。

むむむ。さっき「Site restriction」で指定した以外のサイトがヒットしてる。このサイトは「http://itunes.apple.com/us/app….」。ということで「Site restriction」は「http://itunes.apple.com」までしか効かないことが判明。ノイズが多い訳だ。

ここから自力でノイズを除去します。

手順4（Filterモジュール）
Filterモジュールは、指定した条件（複数指定可）に合致するものを、許したり、ブロックしたりが指定できます。AppHtmlの中でも頻繁に使ってるモジュールのひとつです。

ライブラリから「Filter」を選び、キャンパスへドラッグ&ドロップします。

上段の部分はFileter全体の挙動。下段に条件を追加していきます。

• 「Permit」は合致するものを許す「Block」は合致するものをブロック。
• 「all」は条件の全てが合致条件「any」は条件のどれかが合致条件。
• 「Rules」の左辺はチェック対象。「item.link」を入れる。
• 「Contans」は含まれるという意味。他にも指定できますが、これしか使わん。
• 「text」ここにURL Inputの結果を紐付ける。

ということでヒットした結果の中で「item.link」に「http://itunes.apple.com/jp/app」が含まれるものだけを抽出するという指定ができました。

手順5（Regexモジュール）
デバッガーで確認してみると…。無事に日本のAppStoreだけの結果になった。だがしかし、待てよ…。変なアプリもヒットしてる。どういうこっちゃ？

正直、何でヒットしちゃうのか悩んだんですが解決しました。

iTunesのWebサイトを見て納得。

おすすめアプリの欄に「Textfoece」がある(ﾟДﾟ )！これがヒットする原因か！ということで、ノイズ除去の為に、もうひと工夫することにしました。

上記はノイズになってるデータのdescription。確かに「Textforce」という単語が入ってる。しかし、文章の法則性を発見した。「についての情報…」以降のdesctiptionをカットしちゃえば、余計な単語を拾ってこなくなるはず！！

ライブラリから「Regex」を選び、キャンパスへドラッグ&ドロップします。

Regexモジュールは、対象となるitemを特定条件で置換することができる。条件指定には「正規表現」というのが使えるんですが、これが奥が深い。AppHtmlでも正規表現をたくさん使ってます。今回は、もっとも簡単なところだけにしますが、今後の講座で何度も紹介し、最後にまとめもしたいと思ってます。それくらい重要です。

今回は「item.description」の中で「についての情報.*」を「空」に置換してます。「についての情報.*」の「.*」にご注目。これが正規表現です。意味的には「についての情報」という文字以降の全てを指し、これらの文字列を「空」にしちゃいます。

結果、さっきのはこうなります。

無事にメインとなるアプリ名以外は除去されました(´∀｀)

手順6（Filterモジュール）
最後に更にFilterモジュールを追加し「descriptionの中に指定したアプリ名称が含まれているか」という絞込条件を入れます。Text部分は、Text Inputの値と紐付けます。

最後に全てのモジュールを繋げます。

以上で完成です！！お疲れ様でした。

見つかった課題と対処の方針

今回のようにPipeはモジュールを駆使し、結果を途中で確認しながら、ちょっとずつ手直しして作っていきます。うまくいかないことも多いのですが、法則性を発見し、その法則を当てはめることで目的に達する。そんな頭のトレーニングにもなります。

で、今回作ったモジュールの欠点、というか逃れられない課題がありまして…。

実は「Yahoo! Pipesは日本語に弱い！」ということ。今回は「Textforce」という英語のアプリ名で試してましたが、日本語だとうまく動く場合、うまく動かない場合があるんです。試しに「はてブポケット」でやるとうまくいく。しかし「ポケットベガス」でやるとうまくいかない。こればっかりは、法則性も何もない。お手上げです（；^ω^）

この課題を克服する為に、AppHtmlでは他の検索手法も加えることで、「ポケットベガス」を救う手立てをしています。それが、次回にご紹介する予定の「GoogleAPIを使った検索」です。これらの複数の手段を組み合わせることで検索精度を高めている訳です。

ということで次回は「GoogleAPIの活用」をテーマにします。

あとがき…

今回は、前回と比べるとAppHtmlを意識した構成にしてみました。

ただ、いきなりたくさんのモジュールを使っちゃうと混乱しちゃうと思い、切り出して説明してみました。作っていく中での試行錯誤もログとして残しておけば、後々役に立つかなぁと思いまして、赤裸々に色々書くようにしてます。

こうやって欲しいとか要望があればTwitterやコメントにてご指摘下さい。今後のカリキュラムですが、またまた構成を入れ替えて以下のようになってます。

• 講座01（FetchFeed、Sort）
• 講座02（Text/URLInput、Yahoo!Search、Filter、Regex） ←今ココ
• 講座03（String/URLBuilder、FetchData、Rename）
• 講座04（MyPipe、Union、Unique）
• 講座05（ItemBuilder）
• 講座06（Loop）
• 講座07（Dapperの使い方）
• 講座08（Dapper情報の取得、FetchPage）
• 講座09（NumberInput、SimpleMath）
• 講座10（良く使う正規表現まとめ）
• 講座11（MyPipeの可読性の向上）
• 講座12（Javascriptとの連携）

一応、講座06までのPipeサンプルは完成してます…。頑張って続けます！

-

Similar Posts:

• [Pipes] Yahoo! Pipes講座06（Loop）
• [Pipes] Yahoo! Pipes講座04（MyPipe、Union、Unique）
• Yahoo! Pipes講座のまとめページを作りました♪
• [Pipes] Yahoo! Pipes講座05（ItemBuilder）
• [Pipes] Yahoo! Pipes講座03（String/URLBuilder、FetchData、Rename）