{ "componentChunkName": "component---src-templates-blog-post-jsx", "path": "/post/improve-your-work-with-alfred/", "result": {"data":{"site":{"siteMetadata":{"title":"WEB EGG","author":"Leko - CTO at Yuimedi"}},"markdownRemark":{"id":"3d8d52db-0e26-5494-b7b4-2d4c447f5327","excerpt":"こんにちは。 最近は、Alfredというアプリに大変お世話になっております。 アプリを起動するのにいちいちトラックパッドを使わなくて済むので、すごく捗ります。 Alfred には、色々な便利機能があるのですが、 今回はもう少し突っ込んだことについて書きたいので、 参考になった記事を貼っておきます。 Mac…","html":"

こんにちは。
\n最近は、Alfredというアプリに大変お世話になっております。
\nアプリを起動するのにいちいちトラックパッドを使わなくて済むので、すごく捗ります。

\n

Alfred には、色々な便利機能があるのですが、

\n

今回はもう少し突っ込んだことについて書きたいので、
\n参考になった記事を貼っておきます。

\n
\n

Mac 仕事効率化！Spotlight を完全に超えた神ランチャーアプリ「Alfred 2」の使い方とおすすめ Workflows10 選。[Mac] | MacWin Ver.1.0

\n
\n\n
\n

[太]Mac のランチャーアプリ Alfred ver2 の新機能「workflows」が結構凄そう。 | Fujitaiju Blog

\n
\n

ここからが本題です。
\nAlfred にはWorkflowsという機能があります。

\n

この Workflows が非常に強力で、

\n\n

と、他にも色々ありますが、 Alfred というアプリ上で、一つのまとまった作業を一気に行うことができます。

\n

で、この中から
\nWeb で API が公開されているサービスに何らかの問い合わせをし、
\nその結果を元に、何かアクションを起こす

\n

といったタスクを行う Workflows を作ってみようと思います。

\n

ググっても、チュートリアル系の記事が１件も見つからなかったので、 ソースを読んで作り方を学んでいきます。

\n

今回は、日付を入力すると、
\n速水もこみちが MOCO’s キッチンで使ったオリーブオイルの量を検索出来る API
\nMOCO’S キッチンオリーブオイル APIを利用した Workflows を作ります。

\n\n

Alfred Workflows の前提知識

\n

まず、Alfred というアプリをインストールしないと始まらないので、
\n公式か App Store からインストールをします。
\nインストール+利用は無料です。

\n\n

\"undefined\"

\n

Alfred

\n


カテゴリ: 仕事効率化
\n価格: 無料

\n

そして、残念ですが、注意事項です。

\n

Alfred Workflows(以下 workflows)を利用するには、課金が必要です。

\n

価格にして、15 英ポンド、2013/05/21 現在¥2,300 くらいです。
\nしかし、それだけのお金を払う価値は十分にあると思います。

\n

ここから先の内容は、
\nAlfred の有料機能を使うための PowerPack を買った人を対象に進めます。

\n

サンプルの Google Suggest を利用してみる

\n

PowerPack を購入すると、workflows が利用できるようになります。

\n

まずは感覚をつかむために、
\nGoogle Suggest というサンプルを利用します。

\n

1. Google Suggest を作成

\n

\n \n \n \n \n \n \n

\n

workflows の下の方にある**[+]**を押し、
\nExamples→Google Suggestをクリックすると、作成完了です。 workflows のリストに Google Suggest というのが表示されたと思います。

\n

\n \n \n \n \n \n \n

\n

これは、Alfred にあらかじめサンプルとして入っている workflows で、
\nこのまま利用できます。

\n

2. 使ってみる

\n

では早速使ってみます。
\nAlfred を起動し、g 検索ワード(何でもいい)と入力します。

\n

例えばg jQと入力すると、このようなリストが表示されます。

\n

\n \n \n \n \n \n \n

\n

表示されたものを選択し、Enter を押すと、
\nその検索結果ページがブラウザで開かれます。

\n

3. つまり

\n

このように、Google の検索窓で打つのと同じことを、
\nAlfred 上で完結できます。

\n

今回、
\nurl を叩いて json やら xml を入手して、その結果を元に処理を行うことがしたいので、
\nこのサンプルは非常に参考になります。

\n

Examples に、同様の機能を持ったAmazon Suggestというものもあるんですが、
\nこちらはコードがあまりシンプルじゃなかったので、Google Suggest の方を見ていきます。

\n

サンプルのコードを読む

\n

まず、Google Suggest のコードを、全部貼っつけてみます。
\nあまり行数はないです。PHP で書かれています。

\n
require_once(\"workflows.php\");\n$wf = new Workflows();\n$orig = '{query}';\n$xml = $wf->request( 'http://google.com/complete/search?output=toolbar&q='.urlencode( $orig ) );\n$xml = simplexml_load_string( utf8_encode($xml) );\n$int = 1;\nforeach( $xml as $sugg ):\n  $data = $sugg->suggestion->attributes()->data;\n  $wf->result( $int.\".\".time(), '$data', '$data', \"Search Google for \".$data, \"icon.png\" );\n  $int++;\nendforeach;\n$results = $wf->results();\nif ( count( $results ) == 0 ):\n  $wf->result( \"googlesuggest\", $orig, \"No Suggestions\", \"No search suggestions found. Search Google for \".$orig, \"icon.png\" );\nendif;\necho $wf->toxml();
\n

これで分かる方なら、もう早速作り始められると思います。
\n備忘録のために、これを部分的に掻い摘んでいきます。

\n

0. 言語について

\n

その前に、workflows 作成に利用できる言語について。

\n

Google Suggest も Amazon Suggest もPHPで書かれています。
\nですが、もちろん他の言語でも書くことができます。

\n

他に対応している言語は、

\n\n

があります。

\n

PHP で書く際の注意点は、
\nファイルの先頭、末尾に<\\?phpと?>を入れないこと、くらいです。

\n

今回は、Google Suggest に倣って書くので、PHP で書きます。
\nご了承下さい。

\n

というか PHP 以外の言語あまり分かりません。

\n

1. workflows.php と Workflows クラス

\n
require_once('workflows.php');\n$wf = new Workflows();
\n

この部分、いかにもなクラスを require しています。
\nWorkflows クラスは、workflows を作る上でのユーティリティです。

\n

これのお陰で、通信などの処理を自前で書かずとも、
\n簡単に workflows が作成できるようになっています。

\n

workflows.php は、workflows を作成すると自動的に生成されるので、
\n自前で揃える必要はありません。

\n

2. 入力値の格納

\n
$orig = \"{query}\";
\n

とありますが、これは workflows 上でのおまじないです。

\n

\"{query}\"という文字列は、Google Suggest で設定されている、
\ngキーワード以降に入力された文字列に置き換えられます。

\n

例えば、g jQueryと入力すると、
\n$orig には、\"{query}\"ではなく、変換後のjQueryという文字列が入ります。

\n

どのタイミングで置換が行われるかは、調査はしていません。

\n

3. $wf->requesr( url )

\n

Workflows クラス大活躍です。
\nurl を渡すだけでレスポンスを取得できます。

\n

必要に応じて、urlencodeを使ってエンコードして下さい。

\n

4. $wf->result()

\n
foreach( $xml as $sugg ):\n    $data = $sugg->suggestion->attributes()->data;\n    $wf->result( $int.'.'.time(), \"$data\", \"$data\", 'Search Google for '.$data, 'icon.png' );\n    $int++;\nendforeach;
\n

レスポンスを取得したら、
\n必要なデータを抜き出して$wf->resultに突っ込んでいます。

\n

result()に突っ込まれたデータが、Alfred 上で表示されます。

\n

この$wf->result()の引数が分かりにくいので、
\nWorkflows.php の中身を見てみました。

\n
/**\n * Description:\n * Helper function that just makes it easier to pass values into a function\n * and create an array result to be passed back to Alfred\n *\n * @param $uid – the uid of the result, should be unique\n * @param $arg – the argument that will be passed on\n * @param $title – The title of the result item\n * @param $sub – The subtitle text for the result item\n * @param $icon – the icon to use for the result item\n * @param $valid – sets whether the result item can be actioned\n * @param $auto – the autocomplete value for the result item\n * @return array – array item to be passed back to Alfred\n */\npublic function result( $uid, $arg, $title, $sub, $icon, $valid='yes', $auto=null, $type=null ) {\n    // …\n}
\n

という引数になっています。
\nリストに見える部分は、$titleと$sub、$icon です。

\n

$arg は、取得結果を表示した次のアクションに渡される値です。

\n

例えば、取得結果に URL が存在する場合には、その URL を$argに渡しておくと、
\n次のURLを開くアクションなどで$arg の値を渡すことができます。

\n

5. echo $wf->toxml();

\n

workflows は、echo $wf->toxml()で echo された xml 文字列を受け取って、リスト表示するようです。

\n

6. まとめ

\n

これらの処理をすごくざっくりまとめると、

\n
    \n
  1. $wf->request()で API を叩く
    2. \n
  2. レスポンスから、使いたいデータを$wf->result()に突っ込む
    3. \n
  3. echo $wf->toXML()でリスト表示させる
    4. \n
\n

と言った３ステップになると思います。

\n

補足. キーワード？ ？ ？

\n

g 検索ワードのように、
\ngというキーワードにこの workflows が反応させるように決めます。

\n

\n \n \n \n \n \n \n

\n

反応させるキーワードは、図の上部に書かれた文字を見れば分かります。

\n

\n \n \n \n \n \n \n

\n

反応キーワードを変更したい場合には、
\nこの図をダブルクリックして、keyword を変更すれば OK です。

\n

今回作るものの詳細

\n

冒頭でも話しましたが、
\n今回は、MOCO’s キッチンオリーブ APIを利用したサンプルを作ります。

\n

今回使用するキーワードは、mocosとして、

\n\n

と言った機能を作ります。 完成図はこんな感じ。

\n

\n \n \n \n \n \n \n

\n

この API はパラメータは１種類しか取らず、
\nその書式もはっきりしているので Hello world に最適だと思います。

\n

今回利用する API について学ぶ

\n

MOCO’s キッチンオリーブ API の URL は、
\nGET: です。

\n

パラメータはdateのみで、
\n値は、YYYY-MM-DD形式の日付です。
\nカンマ区切りで複数書くこともできます。

\n


\nにアクセスして、レスポンスを整形したものが以下です。

\n
{ \"2013-05-21\": { \"menu\": \"もこみち流　ペンネのミネストローネ\", \"url\": \"http://www.ntv.co.jp/zip/mokomichi/397800.html\", \"olive\": \"大２\", \"thumb\": \"http://pastak.cosmio.net/mocoDB/oliveAPI/img/thumb_800.jpg\" } }
\n

レスポンスは、上記の形式で得られます。

\n

コードの説明

\n

先ほどの Google Suggest にならって作ったコードがこちらです。

\n
<?php\n\n require_once('workflows.php'); $wf = new Workflows(); $in = \"{query}\"; define(\"REQUEST_URL\", \"http://pastak.cosmio.net/mocoDB/oliveAPI/getJson.php\"); // YYYY/MM/DD形式の場合パラメータを変換 $in = str_replace(\"/\", \"-\", $in); $url = REQUEST_URL.\"?date=\".$in; $json = json_decode($wf->request($url)); // エラーがある場合 if ( $json->error ) { $wf->result(time(), \", $json->error, \", 'icon.png'); // 正常に取得ができた場合 } else { foreach($json as $menu => $info) { $title = $menu.\": \".$info->olive.\"オリーブ\"; $wf->result(time(), $info->url, $title, $info->menu, 'icon.png'); } } echo $wf->toXML();
\n

先ほどの Google Suggest の例を見れば、
\n特に難しいことは無いと思います。

\n

PHP で JSON のパースを行うには、json_decode()を利用します。

\n

ポイントは、
\nresult()の第２引数$arg に、レシピの URL を設定しているところです。

\n

これによって、この後に続く**「URL を開く」という処理が可能に**なります。

\n

workflows の全体図と open URL の設定内容がこちらです。

\n

\n \n \n \n \n \n \n

\n

\n \n \n \n \n \n \n

\n

繰り返しますが、$wf->result()の第二匹数$arg は、次の処理へ渡す値を指定しています。
\nそして、次の処理でも同様に\"{query}\"という文字列で値を取ることが出来るようです。

\n

まとめ

\n

web API と連携した Alfred Workflows の作り方は、
\nこのような感じになっています。

\n

シンプルな MOCO’s キッチン API だから簡単だったわけではなく、
\n他の API を利用しても同様の方法でかなり簡単に書けます。

\n

これを機に、是非皆さんも workflow 製作者になってみては如何でしょうか。

\n","timeToRead":13,"frontmatter":{"title":"Alfred2のWorflowsを自作して作業を効率化する","tags":["Alfred Workflows","PHP"],"date":"May 22, 2013","featuredImage":{"childImageSharp":{"fluid":{"tracedSVG":"data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20width='400'%20height='143'%20viewBox='0%200%20400%20143'%20preserveAspectRatio='none'%3e%3cpath%20d='M0%2072v71h401V0H0v72m59-55l-9%206c-13%2013-11%2034%204%2043%203%202%204%203%203%204v3l-1%203c-1%201%200%202%201%203%204%202%205%201%206-4%201-6%201-6%205-6%203%200%2010-3%2013-6l4-2h2c4-5%205-9%202-7-1%201-1%201-1-1l2-5c0-3%201-3%202-3%202%201%202%201%202-5-2-17-18-27-35-23m1%203c2%200%201%201-2%203-9%207-13%2021-9%2030l3%205v2c-2%201%203%205%209%206%208%202%2013%200%2019-6%2010-10%2011-25%202-34-6-5-9-7-17-7-4%200-6%200-5%201m152%2010l1%201%201%2010-1%209-1%202%205%201%204-1-1-2-1-11V28h-3c-3%200-4%200-4%202m16%200l-2%204-1%202-2%202%202%201%201%205-1%206c-4%202-2%203%203%203s7-1%204-3c-3-1-3-11%200-11l2-1-2-2-2-2%202-3%202-2c0-2-4-1-6%201m52-1l2%202c2%201%201%206-1%205-6-1-9%202-9%208-1%207%204%2011%209%208h2l3%201%203-1-1-2-1-11V28h-3l-4%201m-90%2010l-6%2011c-2%203-1%203%203%203s4%200%203-2c0-3%201-4%206-4%205-1%207%201%205%204-1%202-1%202%203%202%205%200%207-1%204-3l-6-11c-3-9-4-10-6-10s-3%201-6%2010m47-2l2%202c2%201%202%2010-1%2012-2%201-1%202%205%202%204%200%204-1%203-2-4-3-2-11%202-11%201%200%203-2%203-4l-6%201h-8m18%202c-6%207%202%2017%2011%2013%204-1%202-3-2-3-3%201-4%201-5-1-3-2-2-3%204-3s7-1%205-5c-3-5-10-6-13-1m3%2046l2%202c2%201%202%2019-1%2019-2%202%200%203%204%204%204%200%206-2%204-4l-2-3v-2l2%202%204%205c2%202%206%202%207%200l-1-1-5-4-2-3%203-4c5-4%205-4-1-4-3%200-4%200-4%202v3c-2%204-3%202-3-5v-8h-3l-4%201m26%201l-2%204-2%202v2c1%201%202%203%202%207l-2%206c-2%201%200%203%205%203%204-1%205-2%203-3-3-2-2-11%201-12%202%200%202-2-1-3-3%200-3-4%201-5l2-1c-1-2-5-2-7%200m10-1c-1%201-1%202%201%202s2%2019-1%2019c-2%202%200%203%204%204%204%200%206-2%204-4-2-1-2-3-2-11V84h-3l-3%201m-111%201l1%202%204%2010c3%2012%203%2012%206%2011l4-8c3-10%203-10%206-1%204%2014%206%2013%2011-2%201-6%203-10%204-10l1-1c0-2-1-2-4-2-4%200-5%200-5%202l1%201-1%206-2%207-3-8c-4-11-5-10-9%201l-3%208-2-7-1-7c3-1%201-3-3-3l-5%201m43%207c-2%200-4%205-4%208%200%209%2013%2011%2016%204%203-8-4-16-12-12m16%200l2%202c2%201%202%2011-1%2011-2%201-1%203%203%204%204%200%207-3%204-4v-9l3-1c1%200%203-2%203-4l-6%201h-2c0-2-6-1-6%200m66%201c-6%206-2%2015%206%2015%207%200%2011-11%205-15-3-3-8-3-11%200m17%200l1%201%203%207c2%206%202%207%204%207s3-1%204-5c2-7%203-7%204-1%202%209%205%209%209-2l3-6%201-1c0-2-1-2-4-2-5%200-6%201-4%203v5l-1%205-2-6c-2-9-5-9-8-1l-1%206-2-4v-5c2-2%201-3-3-3s-5%200-4%202m34-1c-4%201-3%206%202%209%204%202%204%202%203%204h-5c-1-3-3-2-3%201%200%202%200%202%203%202%205%200%206%200%208-2%203-3%202-5-3-8l-3-3h5c1%203%202%202%202-1s0-3-4-3l-5%201'%20fill='%23d3d3d3'%20fill-rule='evenodd'/%3e%3c/svg%3e","aspectRatio":2.783333333333333,"src":"/static/b72978eac58fe18d3788a3e680ae77d8/f32f2/featured-image.jpg","srcSet":"/static/b72978eac58fe18d3788a3e680ae77d8/466a3/featured-image.jpg 334w,\n/static/b72978eac58fe18d3788a3e680ae77d8/f32f2/featured-image.jpg 569w","srcWebp":"/static/b72978eac58fe18d3788a3e680ae77d8/3d427/featured-image.webp","srcSetWebp":"/static/b72978eac58fe18d3788a3e680ae77d8/cd98f/featured-image.webp 334w,\n/static/b72978eac58fe18d3788a3e680ae77d8/3d427/featured-image.webp 569w","sizes":"(max-width: 569px) 100vw, 569px"}}}}}},"pageContext":{"slug":"/improve-your-work-with-alfred/","previous":{"fields":{"slug":"/aoj-1135-ohgas-fortune/"},"frontmatter":{"title":"[AOJ] 1135 Ohgas' Fortune","tags":["AOJ","JavaScript"]}},"next":{"fields":{"slug":"/aoj-1179-mysterious-worm/"},"frontmatter":{"title":"[AOJ] 0179 Mysterious Worm","tags":["AOJ","C++"]}}}}, "staticQueryHashes": ["2585454260","2954598359"]}