1/21/2012

[php で OAuth を使ってみる:第壱回] Twitter に文字を post する

Twitter に OAuth を使って post してみる。
※この情報は 2012 年 1 月現在のものです。仕様が変更される可能性は充分にあるので、ご了承ください。

1. アプリを登録する
Create an application | Twitter Developers にアクセスし、アプリの登録を行う。
Name: アプリ名
Description: アプリの説明
WebSite: アプリ本体の URL
Callback URL: ユーザによる認証動作後にリダイレクトする URL(「5.」でアップする php)

※全ての情報は登録後でも変更できるので、気楽に。

2. 書き込みできる権限に変更する
アプリの詳細ページに「Settings」というタブがあるので、それをクリックし、「Application Type」の「Access」を「Read and Write」に変更し、保存する。

3. 使うキーを確認する
「Details」タブを押し、「Consumer key」と「Consumer secret」を確認する。これが今後必要となるキー。

4. 必要となるライブラリをインストールする
下記からダウンロードし、アプリとするディレクトリにアップする。
PEAR: PEAR, /アプリのディレクトリ/PEAR
HTTP_OAuth: HTTP_OAuth, /アプリのディレクトリ/HTTP
HTTP_Request2: HTTP_Request2, /アプリのディレクトリ/HTTP/Request2
Net_URL2: Net_URL2, /アプリのディレクトリ/Net

5. 認証受け渡し用の php を用意する
下記に必要な事項を埋め、アプリのディレクトリにアップする。
<?php
include './HTTP/OAuth/Consumer.php';

$consumer_key = 'xxxxxxxxxxxxxxxx'; // 「3.」で確認した「Consumer key」
$consumer_secret = 'xxxxxxxxxxxxxxxx'; // 「3.」で確認した「Consumer secret」

$http_request = new HTTP_Request2();
$http_request->setConfig('ssl_verify_peer', false);

$consumer = new HTTP_OAuth_Consumer($consumer_key, $consumer_secret);
$consumer_request = new HTTP_OAuth_Consumer_Request;
$consumer_request->accept($http_request);
$consumer->accept($consumer_request);

session_start();

if (empty($_GET['oauth_verifier'])) {
// ユーザの認証前、Twitter にリダイレクトする
  $callback = 'callback する URL'; // この場合はこの php 本体
  $consumer->getRequestToken('https://api.twitter.com/oauth/request_token', $callback);

  $_SESSION['request_token'] = $consumer->getToken();
  $_SESSION['request_token_secret'] = $consumer->getTokenSecret();

  $auth_url = $consumer->getAuthorizeUrl('https://api.twitter.com/oauth/authorize');

  header('Location:'. $auth_url);
} else {
// ユーザの認証後、リダイレクトで帰ってきた後
  $consumer->setToken($_SESSION['request_token']);
  $consumer->setTokenSecret($_SESSION['request_token_secret']);
  $consumer->getAccessToken('https://api.twitter.com/oauth/access_token', $_GET['oauth_verifier']);

  $_SESSION['access_token'] = $consumer->getToken();
  $_SESSION['access_token_secret'] = $consumer->getTokenSecret();

  echo "<script type='text/javascript'>location.href = 'アプリ本体の URL';</script>";
}
?>

6. post する
下記の php をアプリのディレクトリにアップする
<?php
require_once 'HTTP/OAuth/Consumer.php';

$consumer_key = 'xxxxxxxxxxxxxxxx'; // 「3.」で確認した「Consumer key」
$consumer_secret = 'xxxxxxxxxxxxxxxx'; // 「3.」で確認した「Consumer secret」
$access_token = 'xxxxxxxxxxxxxxxx'; // 「5.」で取得した access_token
$access_token_secret = 'xxxxxxxxxxxxxxxx'; // 「5.」で取得した access_token_secret

$http_request = new HTTP_Request2();
$http_request->setConfig('ssl_verify_peer', false);

$consumer = new HTTP_OAuth_Consumer($consumer_key, $consumer_secret);
$consumer_request = new HTTP_OAuth_Consumer_Request;
$consumer_request->accept($http_request);
$consumer->accept($consumer_request);

$consumer->setToken($access_token);
$consumer->setTokenSecret($access_token_secret);

$api_url = 'http://api.twitter.com/1/statuses/update.json';
$params = array(
  'status' => 'テスト' // post する本文
);
$response = $consumer->sendRequest($api_url, $params, 'POST');
echo "<script type='text/javascript'>alert('「". $status. "」をpostしました!');</script>\n";
?>

POST statuses/update | Twitter Developers

1/17/2012

京都での観光名所やホテル等の観光案内(ルート検索付き)を作ってみた

電車の乗り換え案内は色々とありますが、バスの乗り換え案内って見たことなくて、特に京都のようなバス地域の場合は重要だと思ってます。そこで、こんなのを作ってみました。GPS で出発地を検出し、目的地までのルートを検索して表示したり、電話番号の表示や、神社仏閣の場合は Wikipedia の情報も表示したりします。出発地や目的地の周辺 1km で駅やバス停を検索して最寄り駅としています。


一度検出した経路は保存できるので、京都以外で試したあと、実際に京都でアクセスするときにも、保存したデータを呼び出せるのですぐに閲覧できます。


また、Twitter と Facebook 連携を付けています。検索などを行って神社仏閣や駅、ホテルなどのページにアクセスすると、下記のようなボタンに出会います。


これらのボタンを押して Twitter/Facebook と接続すると、post できるようになります。


その他の使い方は下記をご覧ください。
京都で遊ぼう!

1/13/2012

Blogger の新 UI

Blogger の新 UI ってのを使ってみてるんだけど、相変わらずプレビューは別タブなのね...。
はてなブログの方がまだいいな。

っていうか、昔の Blogger の UI が一番便利だったなぁ...。

1/05/2012

IdontCare を公開しました

Chrome 機能拡張 IdontCare を公開しました。Facebook で「いいね」を「どうでもいいね」などに置換します。


オムニバーに出るアイコンを押して、置換前と置換後の文字列を設定し、「置換しちゃう」を押すと置換します。フィードなどのリアルタイムな更新には適応してませんので、置換したいときに押して遊んでください。


興味のある方は、以下からどうぞ。

IdontCare: Google Chrome 機能拡張

12/31/2011

2011 年の集計結果

今年はほとんどエントリーを書いてませんが、毎年やってる(2010 年/2009 年)ので、今年もしてみます。

◆◆Google Analytics による集計(2011/01/01〜2011/12/30)
◆タイトル別のコンテンツ
Lion での使い方に悩まれてる方が多かったようですね...。


◆キーワード
こちらも Lion ネタなんですね...。


◆ブラウザと OS
  1. (28.21%) Chrome / Windows
  2. (18.34%) Firefox / Windows
  3. (17.11%) Internet Explorer / Windows
  4. (12.32%) Chrome / Macintosh
  5. (11.57%) Safari / Macintosh
  6. (5.03%) Firefox / Macintosh
  7. (1.97%) Safari / iPhone
  8. (0.99%) Opera / Windows
  9. (0.80%) Android Browser / Android
  10. (0.75%) Safari / Windows
一昨年は IE、去年は Firefox が 1 位でしたが、遂に Chrome が来ましたね。去年 9 位の iPhone が 7 位にランクアップしてます。ちなみに、IE のバージョンでの割合は、8 が 48.35%、9 が 34.07%、7 が 10.71%、そして 6 は 6.87% でした。


◆全ての参照先
  1. (83.36%) google / organic
  2. (9.07%) yahoo / organic
  3. (4.42%) (direct) / (none)
  4. (0.52%) blogger.com / referral
  5. (0.38%) dothtml5.com / referral
  6. (0.33%) facebook.com / referral
  7. (0.33%) search / organic
  8. (0.14%) bing / organic
  9. (0.14%) d.aoikujira.com / referral
  10. (0.14%) s.luna.tv / referral
今年も Google が圧倒的。入り浸ってる Facebook が 6 位です。


◆画面の解像度
  1. (17.16%) 1920 x 1080
  2. (16.93%) 1280 x 1024
  3. (12.22%) 1280 x 800
  4. (10.95%) 1366 x 768
  5. (8.60%) 1680 x 1050
  6. (7.85%) 1920 x 1200
  7. (6.68%) 1440 x 900
  8. (3.95%) 1024 x 768
  9. (3.10%) 2560 x 1440
  10. (2.54%) 1600 x 1200
2560px というとんでもない大画面がなんと 3% もいるじゃないですか!


今年は震災もあり、一言では言い表せない一年でしたが、こうやって無事に振り返ることができました。ありがとうございます。
来年もどうぞ宜しくお願い申し上げます。

no KEIBA, no LIFE のスマートフォン版を公開しました

以前公開した競馬予想サイト no KEIBA, no LIFE ですが、スマートフォン版を公開しました。

表示できる内容は同じですが、モバイルデバイスという特性上、レイアウトが制限されるので、表示項目を選択できるようにしてあります。



この QR コードからアクセスできます。


パソコン版はこちらからどうぞ。
no KEIBA, no LIFE

【動作環境】
パソコン版
Apple Safari 5 以降
Google Chrome 12 以降
Firefox 5 以降
Opera 11 以降

スマートフォン版
iOS 4 以降
Android OS 1.6 以降

I LOVE MACINTOSH を公開しました

お手持ちのアイコン画像をお手持ちの背景画像と一緒に、下記のようなバッヂが付いた画像を生成するサービス「I LoveMacintosh」を公開しました。
I LoveMacintosh

トップページにアクセスすると、下記のようなページが表示されるので、アイコン画像と背景画像を選択します。
I LoveMacintosh

次は、アイコンとする画像での表示する場所と、背景画像のどこにバッヂを付けるかを、ドラッグして決め、NEXTを押します。バッヂのサイズは3種類から選べます。
I LoveMacintosh

色をバーを使って決め、入力する文字とフォントを決め、NEXTを押します。入力すると、結果がプレビューに反映されます。
I LoveMacintosh

最後の画面で表示された画像を右クリックし、ダウンロードしてください。

I LOVE MACINTOSH

【動作環境】
Apple Safari 5 以降
Google Chrome 12 以降
Firefox 5 以降(ただし、色変更のバーは表示されず、数値入力のみです)

※ html5 canvas の解釈に拠っているので、上記に限られます。