{ "componentChunkName": "component---src-templates-blog-post-jsx", "path": "/post/how-to-treat-pocket-api-with-js/", "result": {"data":{"site":{"siteMetadata":{"title":"WEB EGG","author":"Leko - CTO at Yuimedi"}},"markdownRemark":{"id":"b3f5cb63-ad80-554f-a6a6-f30dff700ac3","excerpt":"こんにちは。 最近は湿度が高いですね。くせ毛持ちにはつらい毎日です。 今回は、 「あとで読む」サービスのPocketのAPIを扱えるようにして、 TwitterとかからPocketを操作できるものを作ろうと思い立ったので、調べてみました。 あと、Nodejs…","html":"

こんにちは。
\n最近は湿度が高いですね。くせ毛持ちにはつらい毎日です。

\n

今回は、
\n「あとで読む」サービスのPocketのAPIを扱えるようにして、
\nTwitterとかからPocketを操作できるものを作ろうと思い立ったので、調べてみました。

\n

あと、Nodejsの記事が少ないなーと思ったので、
\n少しでも情報源を増やそうと思い、今回はNodejsで実装していきます。

\n

あくまで個人用の用途を想定しているので、
\nどっかの誰かに認証して使ってもらうサービスで使う場合は、今回の記事の対象外となります。

\n\n

Pocketのアプリを登録

\n

まず、PocketのAPIを利用するには、Pocketにアプリケーションを登録しないといけません。
\nというわけで早速登録していきます。

\n
    \n
  1. Pocketのデベロッパーサイト に行く
    2. \n
  2. いつも使っているPocketのIDでログインする
    3. \n
  3. 左側のメニューのAPPS>Create a New Appを選択
    4. \n
\n

すると、このような画面になると思うので、画像の説明の通り入力していきます。

\n

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

\n

日本語に対応していないようで、日本語でアプリ名を入れたら文字化けしました。
\nなので、動作に影響はないと思うけど、半角英数のみで打っておいたほうが無難だと思います。

\n

パーミッションは、自分用なので全部要求するようにしちゃいましょう。
\nパーミッションは後で足りなくなっても、編集できません。

\n

アプリケーションを登録したら、
\n左側のメニューのAPPS>My Appsに行き、今作ったアプリを選択します。

\n

すると、上記のような感じに詳細情報が表示されます。 まず、パーミッションを確認します。
\nAdd・Modify・Retrieveの３つが表示されていればOKです。

\n

次に、URLを設定します。
\nこのURLは、出来れば自分のページ（存在するページならどこでも）のURLを指定して下さい。
\nここで設定したURLは、後々の説明でリダイレクトURLと出てきます。
\nメモっておいて下さい。

\n

最後に、アクセストークンを取得するために必要な、
\nCONSUMEY KEYというのもメモっておいて下さい。

\n

Pocketからアクセストークンを取得する

\n

APIを利用するには、今メモったCONSUMER KEYと、アクセストークンが必要です。
\nアクセストークンを取得するためには、CONSUMER KEYが必要です。
\nでは、早速取得していきます。

\n

もしサービスにするなら、ごにょごにょとプログラムを書かないと行けないのですが、
\n今回は個人用なので、もっと簡単な方法でアクセストークンを入手します。

\n

各種HTTPメソッドやURLパラメータをGUIから設定して送信できる
\nFetcherというアプリを使用していきます。

\n

ちなみに、アクセストークンの取得についての公式ドキュメント(英語)はこちらです。
\nすでにアプリケーションを登録してCONSUMER KEYを取得済みなので、公式を参考に進める場合はStep2からになります。

\n
\n

Pocket Developer Program: Pocket Authentication API: Documentation

\n
\n

1. リクエストトークンを取得

\n

まず、アプリの認証をするためのリクエストトークンというものを取得します。

\n

アクセスすべきURLは、“です。
\n使うHTTPメソッドはPOST、必要なパラメータは、

\n\n

の２つです。

\n

あと、ヘッダーに
\nContent-Type=application/x-www-form-urlencodedを指定してあげます。
\nこれらを合わせると、

\n

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

\n

こんな感じになると思います。
\nFetchを押してみると、以下の様なレスポンスが帰ってくると思います。

\n
HTTP/1.1 200 OK\n———————————REQUEST————————————–\nContent-Type = application/x-www-form-urlencoded Accept-Encoding = gzip\nContent-Length = 77\nUser-Agent = Fetcher 1.4 (Macintosh; Mac OS X 10.8.4; ja_US)\n———————————RESPONSE————————————\nServer = Apache/2.2.23 (Amazon) Status = 200 OK\nContent-Type = application/x-www-form-urlencoded\nX-Powered-By = PHP/5.3.20\nX-Source = Pocket P3P = policyref=\"/w3c/p3p.xml\", CP=\"ALL CURa ADMa DEVa OUR IND UNI COM NAV INT STA PRE\"\nDate = Tue, 06 Aug 2013 11:23:38 GMT\nContent-Length = 35\nCache-Control = private\nConnection = keep-alive\n\ncode=XXXXXXXXXXXXXXXXXXX
\n

一番下の行の、code=XXXXXXXXXXXXの部分を使います。
\nXXXXXXXX…としていますが、実際には英語と数字とハイフン混じりの文字列になっていると思います。
\nこのXXXXXXX…の部分が、リクエストトークンです。

\n

2. Pocketの認証画面へ移動

\n

今取得したリクエストトークンを使って、アプリの認証画面へ移動します。

\n

今回はFetcherではなくブラウザを使います。
\nブラウザのアドレスバーに、 https://getpocket.com/auth/authorize?request_token=

\n

YOUR_REQUEST_TOKEN&redirect_uri=YOUR_REDIRECT_URI

\n

と入力して下さい。 YOUR_REQUEST_TOKENのところには、先ほど取得したリクエストトークンを、
\nYOUR_REDIRECT_URIのところには、先ほど設定したリダイレクトURLを入れます。

\n

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

\n

上記のURLにブラウザからアクセスすると、こんな画面になるので、
\nAuthorizeをクリックします。

\n

これで認証完了です。

\n

3. アクセストークンを取得

\n

やっとアクセストークンです。

\n

認証が完了したら、
\n先ほどのリクエストトークンと、CONSUMER KEYを利用して、アクセストークンを取得します。

\n

アクセスするURLは “
\nHTTPメソッドはPOST
\nパラメータは、

\n\n

これをFetcherに入れるとこんなかんじになります。

\n

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

\n

上記内容でFetchボタンを押すと、

\n

access_token=XXXXXXXXXXXXXXXXXXXXXX&username=...

\n

というレスポンスが帰ってきていると思います。 このaccess_token=以降のXXXの部分をメモっておいて下さい。

\n

これで、必要な処理は完了です。

\n

PocketAPIを試してみる

\n

APIの仕様についてはドキュメントを見ればわかるので、とりあえず使うだけ使ってみます。

\n

APIの公式ドキュメントはこちら。

\n
\n

Pocket Developer Program: Pocket API Documentation

\n
\n

自分がPocketに保存した最新１件の記事を取得して、
\nその記事のタイトルとURLを表示してみましょう。

\n

ソースはこんな感じになると思います。

\n
(function(global, undefined) {\n  \"use strict\";\n  var https = require(\"https\"),\n      endpoint = \"https://getpocket.com/v3/get\",\n      param = \"\";\n\n  param += \"consumer_key=YOUR_CONSUMER_KEY\";\n  param += \"&access_token=YOUR_ACCESS_TOKEN\";\n  param += \"&sort=newest\";\n  param += \"&count=1\";\n\n  https.get(endpoint + \"?\" + serialize(param), function(res) {\n    var response = \"\";\n    // データを受信したら\n    res.on(\"data\", function(buff) {\n      response += buff.toString();\n    });\n    // データの受信が完了したら\n    res.on(\"end\", function() {\n      var json = JSON.parse(response),\n          p;\n      for (p in json.list) {\n        var item = json.list[p],\n            title = item.resolved_title,\n            url = item.resolved_url;\n        console.log(title + \"n\" + url + \"n\");\n      }\n    });\n  });\n}(this));
\n

これを実行してみると、こんな表示がされると思います。

\n

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

\n

Nodejsでの通信は割とお手軽ではないのですが、上記のように書いて通信出来ます。

\n

APIクライアントの実装

\n

上の例でとりあえずの通信は出来るのですが、上のままだとかなり使いにくいと思います。

\n

ということで、PocketのAPIクライアントを書いてみました。

\n
\n

nodejs-pocket.js

\n
\n

アクセストークンは何らかの手段で取得済みという前提**（アクセストークンを取得する周りの処理は一切なし）**
\nの実装なので汎用性はあまりないと思いますが、

\n

自分のPocketのデータを操作したい場合などに、ご活用いただけたらなーと思います。

\n

使い方は、
\n上記のnodejs-pocket.jsをダウンロードした上で、下記のように使ってもらえます。 requireのパスは適宜変えて下さい。

\n
var Pocket = require(\"./nodejs-pocket.js\"),\n    pocket = new Pocket({\n        consumer_key: \"あなたのconsumer_key\",\n        access_token: \"あなたのaccess_token\"\n    });\n// Pocketから取得\nvar opt = {\n    sort: \"newest\",\n    count: 10\n};\npocket.get(opt, function(json) {\n    // 記事の配列\n});\n\n// Pocketされている記事の情報変更\nvar opt = {\n    actions: [\n        {\n            \"action\": \"favorite\",\n            \"item_id\": 99999999\n        }\n    ]\n};\npocket.modify(opt, function(json) {\n    // 送信したアクションを行った結果\n});\n\n// Pocketに記事を追加\nvar opt = {\n    url: \"http://leko.jp\",\n    title: \"うぇぶえっぐ\",\n    tags: \"web,egg\"\n};\npocket.add(opt, function(json) {\n    // 記事をPocketに追加した結果\n});
\n

APIは、APIクライアント系のgem(Rubyだけど)によくある形に合わせてみたつもりですが、
\n改善点がございましたら、Gistの方にコメントいただけると嬉しいです。

","timeToRead":9,"frontmatter":{"title":"PocketのAPIをNodejsから扱う方法","tags":["Nodejs","Pocket"],"date":"August 06, 2013","featuredImage":{"childImageSharp":{"fluid":{"tracedSVG":"data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20width='400'%20height='179'%20viewBox='0%200%20400%20179'%20preserveAspectRatio='none'%3e%3cpath%20d='M37%2033l-1%209c0%2010%200%2010%2010%2010%209%200%2010-1%2010-10s-1-10-10-10l-9%201m24%2040l-6%201-5%201c0%202%200%202%2012%202l15-1h1l1%201c2-2%200-4-4-4H61m236%2038v6l1%205h51l1-2v-9l-26-1-27%201m-33%2025v1l-1%201%2032%201c31%200%2032%200%2032-2s-7-3-9-1h-1l-1%201-1%201-1-2c1-1%200-1-9-1s-13%200-11%202l-1%201-1-1-1-2-2%202-1%201-1-1-2-2c-2%200-3%201-3%202l-1%201-1-1-2-2-2%202-1%201-1-2-4-1h-4l-1-1-1%202'%20fill='%23d3d3d3'%20fill-rule='evenodd'/%3e%3c/svg%3e","aspectRatio":2.2416107382550337,"src":"/static/28f42ce2249526efe760383f59961346/2a4de/featured-image.png","srcSet":"/static/28f42ce2249526efe760383f59961346/1ec58/featured-image.png 334w,\n/static/28f42ce2249526efe760383f59961346/2a4de/featured-image.png 600w","srcWebp":"/static/28f42ce2249526efe760383f59961346/ad85c/featured-image.webp","srcSetWebp":"/static/28f42ce2249526efe760383f59961346/cd98f/featured-image.webp 334w,\n/static/28f42ce2249526efe760383f59961346/ad85c/featured-image.webp 600w","sizes":"(max-width: 600px) 100vw, 600px"}}}}}},"pageContext":{"slug":"/how-to-treat-pocket-api-with-js/","previous":{"fields":{"slug":"/try-clean-install-with-boxen/"},"frontmatter":{"title":"Macの容量が埋まってしまったのでboxenとクリーンインストールをしてみた","tags":["Boxen","Mac"]}},"next":{"fields":{"slug":"/how-to-fix-sublime-linter-in-japanese/"},"frontmatter":{"title":"MacのSublimeLinterで日本語エラーが出る症状を治す方法","tags":["Sublime Text2"]}}}}, "staticQueryHashes": ["2585454260","2954598359"]}