TwitterのOAuth認証でMovable Typeにコメント投稿できる「TwitComment」プラグイン

TwitterのOAuth認証でMovable Typeにコメント投稿できる「TwitComment」プラグイン

Posted at November 1,2010 1:55 AM
Tag:[MovableType, Plugin, TwitComment]

Movable Typeで、TwitterのOAuth認証によるコメント投稿を実現する「TwitCommentプラグイン」を公開します。

コメント投稿でTwitterのOAuth認証

2010.11.01追記:Twitterのガイドラインに抵触しないよう、プラグイン名および使用画像を変更しました。

このプラグインは、「コメント投稿にTwitterのOAuth認証を導入」で紹介したものです。1項の2つめの機能追加を行ってから公開しようと思ってましたが、しばらく多忙だったため公開が遅れてしまいました。

1.機能

  • TwitterのOAuth認証でのコメント投稿が可能です。
  • TwitterのOAuth認証で投稿されたコメントに対応するコメンター画像が表示可能です(冒頭の画像)。

このプラグインはブログ/ウェブサイト単位に機能します。4項・5項の作業はブログ/ウェブサイト単位に行ってください。

2.プラグインのダウンロード

下記の TwitComment_x_xx.zip をクリックして、プラグインアーカイブをダウンロードします。

変更履歴

2010.11.01 初版
2010.11.03 v0.02 phpファイル変更
2010.11.07 v0.03 ウェブサイト/ブログ作成でエラーになる不具合を修正
2010.11.08 v0.021 Movable Type 4.x対応版公開
2010.11.25 v0.022 Movable Type 4.x対応版でプロフィール画像が表示されない不具合を修正
2010.12.01 v0.04/v0.023 セキュリティアップデート/画像ファイルアップロード処理の改善

動作確認バージョンは、Movable Type 4.27/Movable Type 5.03xです。

3.プラグインのインストール

プラグインアーカイブを展開し、pluginsディレクトリ直下にある TwitComment フォルダごと、Movable Type のアプリケーションディレクトリの plugins ディレクトリにアップロードします。また、mt-static/pluginsディレクトリ直下にある TwitComment フォルダごと、Movable Type のアプリケーションディレクトリの mt-static/plugins ディレクトリにアップロードします。

システム管理画面のプラグイン一覧で、「TwitComment~」が表示されればインストール完了です。

システム管理画面のプラグイン一覧

4.Twitterのアプリケーション登録

Twitterにログインして、「ユーザー名」→「設定」をクリック。

ログイン画面

「連携アプリ」をクリック。

設定画面

「開発者」の説明にある「こちら」をクリック。

連携アプリ画面

「新しいアプリケーションを追加」をクリック。

Twitterアプリケーション画面

表示されたページで次の設定を行います。

Application Details

  • アプリケーションのアイコン:(設定不要)
  • アプリケーション名:任意のアプリケーション名を入力
  • アプリケーションの説明:任意のアプリケーションの説明を入力。
  • アプリケーションのウェブサイトURL:任意のURLを入力(プラグインの動作とは関係ありません)
  • 所属会社/団体:(設定不要)
  • サイト:(設定不要)
  • アプリケーションの種類:「ブラウザアプリケーション」を選択
  • コールバックURL:以下のURLを設定(赤字のみ自サイトの内容に入れ替え)
    http://アプリケーションディレクトリまでのURL/mt-comments.cgi?__mode=oauth_verified&blog_id=xx&client=twitter
  • Default Access type:「Read-only」を選択
  • Twitterでログインする:チェックします

2つのCAPTCHAコードを半角スペースで区切ってテキストフィールドに入力し、保存すれば「Consumer key」と「Consumer secret」が表示されます。この2つの値は次の作業で使用します。

Twitterアプリケーション設定完了画面

設定内容は後で変更することができます。変更する場合は、この画面にある「Edit Application Settings」を、「Consumer key」と「Consumer secret」を変更したい場合は、「Reset Consumer Key/Secret」をクリックします。

Twitterアプリケーション設定完了画面

5.プラグインの設定

TwitCommentプラグインを使用したいブログまたはウェブサイトの「設定」→「登録/認証」をクリックして、「Twitter Commentプラグイン設定」のリンクをクリック。

登録/認証画面

プラグイン一覧画面に移動するので、「TwitComment」の設定タブを開き、4項で取得した、「Consumer key」と「Consumer secret」を設定して、「変更を保存」をクリックします。

TwitComment設定画面

「設定」→「登録/認証」画面に戻って、「Twitter」をチェックして「変更を保存」をクリックします。

「登録/認証」画面

これで設定完了です。

6.基本動作確認

任意の記事のコメント投稿フォームでサインインをクリックし、「Twitter」を選択。

サインイン画面

これで次のような画面に切り替わるので、Twitterのロゴをクリック。

サインイン画面

アカウントへの接続要求画面にリダイレクトするので、「許可する」をクリックします。

アカウントへの接続要求画面

利用しているブラウザでTwitterにログインしていない状態であれば、ユーザー名・パスワードを入力する画面が表示されます。

アカウントへの接続要求画面

これでサインインできました。

サインイン後のコメント投稿画面

投稿コメントにはTwitterのロゴやユーザー名が反映されます。リンクをクリックすれば、Twitterのユーザーページにジャンプします。

twitterのOAuth認証による投稿コメント

7.Twitterのアイコンを表示する

冒頭のようにTwitterのアイコンをコメント一覧に表示する方法ですが、コミュニティ機能を利用している場合、テンプレートの変更は不要です。コメントを投稿すれば冒頭のアイコンが表示されます。

プロフィール画像機能は、コミュニティ機能をもたないMTOSなどでも利用可能なはずです。「プロフィール画像」のテンプレートについては、次のページを参考にしてください。

プロフィール画像の表示を便利に行うテンプレートモジュール
関連記事
トラックバックURL


コメント

Twitterでのコメントはずっと欲しかった機能の一つです!
まだ、試してませんが、嬉しい限りです!

ありがとうございます。

[1] Posted by hira logo : November 1, 2010 3:46 AM

早速使わせていただきました。ありがとうございます。
困った時の小粋空間頼りでいつもいつもお世話になっております。

[2] Posted by オーク : November 2, 2010 6:09 AM

phpを使ってないのでよくわからないのですが配布内のphpフォルダのファイルが元のまま(旧プラグイン名の設定)なのですが変えなくても動作するのでしょうか?

[3] Posted by macminiosx : November 2, 2010 1:53 PM

>hiraさん
こんばんは。
コメントありがとうございます。
機会がありましたらご利用ください。

>オークさん
こんばんは。
こちらこそお世話になります。
プラグインご利用、ありがとうございます。

>macminiosxさん
こんばんは。
ご指摘ありがとうございました!
別途修正したいと思います。

[4] Posted by yujiro logo : November 3, 2010 3:12 AM

動作確認バージョンはMT5.xとのことで、MTOS 4.34に導入してみましたが、動作しませんでした。自MTのバージョンアップ時に使用させていただくことにします。

[5] Posted by blue_bullet logo : November 3, 2010 7:05 PM

>blue_bulletさん
こんばんは。
ご指摘ありがとうございます。
動作確認して、MT4対応版を別途公開したいと思いますのでお待ちください。

[6] Posted by yujiro logo : November 4, 2010 2:05 AM

試してみました!
・・・が、プラグインを有効にすると、コメントのプレビューを押したりした場合に、Script Error になってしまいました。
サインイン を押した際も、何も動かなくなってしまいました。

システムのプラグイン一覧から無効にすると、Script Errorが無くなったので、プラグインを入れたことによって発生していると思います。

サーバがコアサーバなので、以前のMT5.03の時のような状況かもしれません。(現在使っているMTは5.02です)

もし何かおわかりでしたら、教えて頂けると幸いです。

[7] Posted by hira logo : November 5, 2010 11:57 PM

いつもブログ拝見させて頂いています。
インストール後、新規ウェブサイトを作って試してみようと思ったのですが、
エラーとなってしまいます。
「Can't call method "id" on an undefined value 」となってしまいます。

TwitCommentプラグインを削除すると正常に新規WEBサイトを作ることができます。

TwitCommentプラグインを正常に使うにはどのようにしたらよいでしょうか?ご教授いただけると幸いです。

[8] Posted by 13_yousuke logo : November 6, 2010 3:12 PM

>hiraさん
こんばんは。
ご指摘ありがとうございます。

サインインが進行しない件について、MT-5.03+CORESERVERで同様の事象を確認致しました。
本質的な対処ではないかもしれませんが、config.yamlの以下の1行を削除するか、行頭に「#」をつけてコメントアウトしてみてください。

condition: $TwitComment::TwitComment::App::oauth_commenter_condition

コメントプレビューでScript Errorになる件は、Twitter認証以外での認証コメント、または認証なしのコメントの場合でしょうか。同様の事象が確認できていないため、具体的な内容をお知らせください。

コメント8の13_yousukeさんの不具合を解消するため、v0.03にバージョンアップしましたので、上記のいずれもv0.03で再度ご確認頂ければ幸いです。

それではよろしくお願い致します。

>13_yousukeさん
こんばんは。
ブログご利用くださりありがとうございます。

ご指摘の件ですが、プラグインに不具合がありましたのでv0.03にバージョンアップ致しました。情報ありがとうございました。
バージョンアップしたプラグインを再度ダウンロードして動作をご確認願えますでしょうか。
それではよろしくお願い致します。

[9] Posted by yujiro logo : November 7, 2010 2:01 AM

MT4対応ありがとうございます。
MTOS4.34で試してみましたが、サインインが進行しません。
サーバはcore MINIを使用しており、config.yamlの対策をしてみましたが、変化ありませんでした。ご報告いたします。

[10] Posted by blue_bullet logo : November 14, 2010 2:11 PM

yujiro さん、お返事ありがとうございます。
確認が遅くなってしまいすみません。
まだ試せていないのですが、また確認次第ご連絡致します。

[11] Posted by hira logo : November 16, 2010 4:00 AM

>blue_bulletさん
こんばんは。
サインインが進行しない件ですが、MT4.x+v0.03では、プラグインから起動している関数がMT4に存在しないので、サインインが進行しないようです。
v0.21をダウンロードし、繰り返しになりますがconfig.yamlの以下1行を削除して動作をご確認ください。

condition: $TwitComment::TwitComment::App::oauth_commenter_condition

上記の組み合わせで、MTOS4.34 + core MINIの環境で動作することを確認しました。以下はそのサイトです。

http://mtbook.m23.coreserver.jp/MTOS-4.34-ja/my_first_blog/

それではよろしくお願い致します。

>hiraさん
了解です。
ご連絡ありがとうございます。

[12] Posted by yujiro logo : November 17, 2010 1:34 AM

>yujiroさん
こんばんは。動作しました。
私の前回のコメントで試していたのはv0.021でした。記載忘れました、すみません。
コメント回答を見て再実施したところ、正常に動作しました。お手数かけて申し訳ありません。
ありがとうございました。

[13] Posted by blue_bullet logo : November 17, 2010 10:24 PM

>blue_bulletさん
こんにちは。
ご連絡ありがとうございます。
バージョンの件、失礼致しました。

無事に動作したようで良かったです。
ではでは!

[14] Posted by yujiro logo : November 18, 2010 12:28 PM

Twitterアカウントでの認証プラグイン有り難く利用させていただきます。
無事、自サイトでの導入に成功しました。

ただ、こちらのサイトにコメントするため、サインインしようとしたところ下記のようなエラーでサインインできませんでした。
(なのでfacebookのほうでサインインしました)

Parameter oauth_callback_confirmed not valid for a message of type Net::OAuth::RequestTokenResponse

[15] Posted by Takashi logo : March 4, 2011 8:53 PM

>Takashiさん
こんばんは。
プラグインご利用ありがとうございます。
当サイトでは配布前のプロトタイプを使っていたためエラーになっていたようです。
配布版のものと差し替えて正常に動作することを確認致しました。
ご指摘ありがとうございました!

[16] Posted by yujiro logo : March 5, 2011 4:57 AM

すみません、twitcommentのテストさせてください。

[17] Posted by odatest logo : April 17, 2011 7:29 PM

>odatestさん
了解です。ご自由にどうぞ。

[18] Posted by yujiro logo : April 18, 2011 2:24 AM

ツイッターでの認証プラグイン利用させていただきます。ありがとうございます。インストールは無事、成功しました。
しかし、コメントができない状態です
質問なのですがコールバックURL内に”blog_id=xx”とありますが何を入力すればいいのでしょうか?サイトのURLとは違いますか?
すいませんがよろしくお願い致します。

[19] Posted by daisuke : April 22, 2011 7:37 PM

>daisukeさん
こんばんは。
ご質問の件ですが、「xx」にはプラグインを利用したいブログのブログID(数字)を設定します。何を設定してよいか分からない場合は、BlogIDViewerプラグインをお使いください(下記)。

http://www.koikikukan.com/archives/2009/01/05-005555.php

このプラグインをインストールすれば、ブログIDがメニューに表示されるようになります。その番号を「xx」に設定してください。

それではよろしくお願い致します。

[20] Posted by yujiro logo : April 23, 2011 1:04 AM

ありがとうございました。無事動作いたしました。
初歩的なミスにもかかわらず教えていただきありがとうございます。

[21] Posted by daisuke : April 24, 2011 11:49 AM

>daisukeさん
こんばんは。
ご連絡ありがとうございます。
無事に設定できたようでよかったです。
ではでは!

[22] Posted by yujiro logo : April 26, 2011 2:11 AM

参考にさせていただきました。すいませんが試させてください。

[23] Posted by ino227 logo : August 17, 2011 12:53 PM

>ino227さん
了解です。ご自由にお試しください。

[24] Posted by yujiro logo : August 18, 2011 1:59 AM

初心者ですが質問お願いします、TwitCommentプラグインはFC2ブログのプラグインに追加できますでしょうか?追加しようとしたのですが分からず頓挫してしまいました。

[25] Posted by ken logo : September 10, 2015 5:57 PM

>kenさん
ご返事遅くなり申し訳ありません。
このプラグインはMovable Type専用のため適用することはできません。
お役に立てずすいません。
それではよろしくお願い致します。

[26] Posted by yujiro logo : September 30, 2015 12:28 AM
コメントする
greeting

*必須

*必須(非表示)


ご質問のコメントの回答については、内容あるいは多忙の場合、1週間以上かかる場合があります。また、すべてのご質問にはお答えできない可能性があります。予めご了承ください。

太字イタリックアンダーラインハイパーリンク引用
[サインインしない場合はここにCAPTCHAを表示します]

コメント投稿後にScript Errorや500エラーが表示された場合は、すぐに再送信せず、ブラウザの「戻る」ボタンで一旦エントリーのページに戻り(プレビュー画面で投稿した場合は、投稿内容をマウスコピーしてからエントリーのページに戻り)、ブラウザをリロードして投稿コメントが反映されていることを確認してください。

コメント欄に(X)HTMLタグやMTタグを記述される場合、「<」は「&lt;」、「>」は「&gt;」と入力してください。例えば「<$MTBlogURL$>」は「&lt;$MTBlogURL$&gt;」となります(全て半角文字)