Twitter @Anywhereを導入（その１）
生活チェックサービス「ChanTo.me」では、TwitterへのTweet方法は、GETのパラメータにstatus=[tweetする文]と設定したリンクを貼っていたのですが、何かと面倒なので、Twitter APIを使うつもりでいました。
ところが、@Anywhereが出て簡単にTweetをサイトからできるとの事だったので、@Anywhereの導入に向けて、調査し一部導入し公開を開始しました。
そこで、@Anywhereでの試行錯誤した点を記録します。
@Anywhereサイトを参照
こちらから@Anywhereのサイトにアクセスします。
ドキュメントを見たい場合は、右下の「Read the documentation」をクリックします。
アプリケーションを登録する場合は、「Start using now」をクリックします。(注意点を後述)
Twitter 新 API のドキュメント「Getting Started with @Anywhere」日本語訳があったのでリンクしておきます。
@Anywhereで何ができるか
@Anywhereでできるのは次の機能です。
Twitter IDへのリンク追加
html中のTwitter IDを探し出して、リンクを作成する。
つまり、html中から @nakachin とか @chantome のような部分を探し、「@」以降の部分に、twitterのURLへのリンクを作成します。
html中のTwitter IDを探し出して、Twitter情報を含むツールチップを作成する。つまり、html中から @nakachin とか @chantome のような部分を探し、「@」以降の部分にマウスオーバーすると、ツールチップが表示されます。
フォローボタンの設置
フォローボタンを設置します。フォローボタンをクリックするだけでフォローできます。
ただし、最初の一度だけ、後述のTwitterの認証と利用許可のダイアログが表示されます。
ツイートボックスの設置
ツイートボックスを設置します。ツイートを入力し「Tweet」をクリックするだけでツイートされます。
ただし、最初の一度だけ、後述のTwitterの認証と利用許可のダイアログが表示されます。
Twitter接続ボックスの設置
上記のフォローとツイートで必要となる認証ダイアログを表示するボタンを設置します。
クリックすると、認証ダイアログが表示されます。
注意点
細かいコードについては、次の記事で書きますが、注意点を書きます。
アプリケーションの登録
アプリケーションの登録は、@Anywhereからの「Start using it now」やデベロッパーページの「Register an app」からではなく、以下のリンクからやった方がいいでしょう。
[Twitterのホーム]-[設定]-[外部アプリ]-[右の開発者の方へのこちら]
URLは以下のになります。
なぜこちらからの方が良いかというと、「Default Access type」がこちらからしか設定できないからです。上記のリンクからだと設定できず、デフォルトのRead-onlyになります。しかしRead-onlyだとフォローとツイートができません。
フォローとツイートがしたい人はこちらでRead-Writeで登録するか、上記で登録したものをこちらでRead-Writeに設定変更する必要があります。
ログイン状態とカレントユーザの取得(追記)
twitter.isConnected でログイン状態を取得でき、twitter.User.current でユーザ情報を取得できるはずなんですが、できませんでした。
Webアプリの認証との連携
ChanTo.meでは、Twitter APIのOAuthを使って認証しています。しかし、このWebアプリでの認証を@Anywhereの認証として利用する事ができません。そのため、両方行う場合は、それぞれ認証する必要があります。
ただ、上記のアプリケーションの登録自体は共有できるようです。
ツイートボックスへのフォーカス移動
ツイートボックスを利用する時、入力域にカーソルをフォーカスしないと、「Tweet」ボタンが押せません。
ツイートボックスにはデフォルト値を入れる事ができるので、わざわざフォーカスせずに「Tweet」ボタンを押したい時があるのに、できない事になってしまいます。
JavaScriptで何とかしようとしたのですが、iframeを使っており、かつ、外部サイトのコードのため、私がやった限りでは自動的にフォーカスを移す事ができませんでした。
ぜひ、何もしなくても「Tweet」ができるようにしてほしいものです。
スマートフォンでの利用
ツイートボックスだけですが、iPhoneとAndroid(HT-03A)で使えるか試してみましたが、ツイートボックスは表示されませんでした。
ぜひ、早く対応してほしいものです。というのが、@Anywhereを使いたかった一番の理由は、Androidでモバイルツイッターの文字数の処理に問題があったためなもので。
他の細かい点は、コードを含めて次の記事に書きます。
生活チェックサービス「ChanTo.me」では、すでに@Anywhereに対応しました。Googleアカウントでログインした人は、@Anywhereでツイートを、Twitterアカウントでログインした人は、Twitter APIでツイートをするようになっています。ぜひご利用ください。
