English Japanese Kawa.netxp [ajax] AjaxTB/トラックバック機能を静的HTMLページに追加するJavaScript

本サイト(kawa.net)が最初にトラックバックに対応したのは、2004年11月でした。
その後、ソーシャルブックマークの普及や SPAM の増加によって トラックバックは死んだは とまで言われて地位はだいぶ下がっていますが、 今ごろになって、また本サイトのトラックバック機能を実装し直してみました。

本サイトは CMS/ブログ等を使ってない静的な HTML ファイルばかりなのですが、 旧バージョンでは、トラックバックpingの届いたページの HTML ファイルを 自動的に書き換える仕組みで実装していました。 ただし、nobody 権限で HTML ファイルを書き換えるのは嫌いなので、cron で回しています。

新バージョンは ajax を利用して実装しています(正確にはresponseTextを使用)。 CGI 呼び出しはトラックバック到着時のみで、ページの表示時には静的テキストファイルを 使用して CGI は起動しないため、サーバへの負荷も軽いです。 もちろん、ページ自体も静的 HTML ファイルのままです。

トラックバックが増えても(見た目はともかく)ページ本体の HTML コードには影響がないので、 トラックバックの当初の繁栄理由の1つだった Google ページランクのアップは期待できません。 しかしその分トラックバック SPAM の意欲をいくらか削ぐことは出来るかも?

新着コメントは、 RSS形式 および JSON形式 でも 参照できます。
この RSS ファイル・JSON ファイルは、 ajaxtb.cgi?__mode=rss にアクセスすると、強制更新できます。

ダウンロードはこちら: ajaxtb-20060919.zip ZIP

Perl 5.005/5.6.x/5.8.x で利用できます。 (本サイトでも 5.005 を使っています)
本サイトも OS 入れ替えで、ついに Perl 5.8.8 になりました。
5.005/5.6.x でご利用の場合は、別途 Jcode.pm が必要です。

インストール

ダウンロードした ZIP ファイルをウェブサーバにアップロードしてご利用下さい。
ajaxtb.cgi と ajaxtb-data だけは、パーミションは変更する必要があります。

tb/ajaxtb.cgi                   パーミション 755 (rwxr-xr-x)
tb/ajaxtb.css
tb/ajaxtb.js
tb/cgi-lib/ajaxtb-main.pl
tb/cgi-lib/KCatch.pm
tb/cgi-lib/misclib.pl
tb/cgi-lib/XML/TreePP.pm
tb/cgi-lib/XML/FeedPP.pm
tb/cgi-lib/JSON.pm
tb/cgi-lib/JSON/Converter.pm
tb/cgi-lib/JSON/Parser.pm
tb/ajaxtb-data/                 パーミション 777 (rwxrwxrwx)
tb/ajaxtb-data/.exist           ダミーファイル

tb ディレクトリはサーバ上のどこでも構いません。
トラックバック機能を埋め込む HTML ファイル類とは別の場所の方が分かりやすそうです。

設定項目の編集

インストール環境ごとの設定項目として ajaxtb.js の編集が必要です。下記の行を書き換えて下さい。
デフォルトでは /service/com/ が、インストール先ディレクトリです。

    AjaxTB.prototype.url_receive   = '/service/tb/ajaxtb-data';

同様に cgi-lib/ajaxtb-main.pl の設定項目を変更します。

    my $AJAXTB_DATA = "ajaxtb-data";
    my $URL_ROOT    = "http://domain.name";
    my $DOC_ROOT    = "/home/htdocs/domain.name";

$URL_ROOT は、ご利用のドメイン名(トップページURL末尾の / を除いたもの)を指定します。
$DOC_ROOT は、その DocumentRoot(サーバ上の絶対パス)を指定します。

HTML にタグを埋め込む

以下のタグをページ HTML の好きなところ(下の方とか)に入れてください。
これだけで、静的 HTML ファイルがトラックバックに対応します。

<link rel="stylesheet" type="text/css" href="http://domain.name/service/tb/ajaxtb.css" />
<script src="http://domain.name/service/tb/ajaxtb.js"></script>

<p>トラックバックURL ⇒ http://domain.name/service/tb/ajaxtb.cgi/path/to/page.html</p>
<div id="ajaxtb_here"></div>
<script>(new AjaxTB("ajaxtb_here")).load();</script>
<!--
<rdf:RDF xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
  xmlns:dc="http://purl.org/dc/elements/1.1/"
  xmlns:trackback="http://madskills.com/public/xml/rss/module/trackback/">
<rdf:Description
  rdf:about="http://domain.name/path/to/page.html"
  trackback:ping="http://domain.name/service/tb/ajaxtb.cgi/path/to/page.html"
  dc:title="ページタイトル"
  dc:identifier="/path/to/page.html" />
</rdf:RDF>
-->

http://domain.name の部分はドメイン名(例:http://www.kawa.net)、 path/to/page.html の部分はページへのパス(例:works/ajax/ajaxtb/ajaxtb.html)を指定します。 service/tb の部分には ajaxtb のインストール先パスを指定します。

長いですが、(new AjaxTB("ajaxtb_here")).load() の部分が重要で、ここで ajax の処理を起動しています。
冒頭2行については、<head>〜</head> 中でも構いません。 (<body>〜</body> 中でも問題ありません)

まだトラックバックpingが1件も到着していない場合は、 トラックバックURLのみが表示されます。
1件以上到着している場合は、ajaxtb_here のエリアに内容が表示されます。
見た目は ajaxtb.css の スタイルシートで定義します。

トラックバック送信の試し方

自分のブログ等からトラックバック ping を送信してみるのが確実ですが、 最初のテストや、面倒な場合は、 ここのフォーム からもトラックバック ping を送信できます。

トラックバックの技術的な仕様について、詳しくは こちら を参照してください。(Six Apart)

データファイルのフォーマット

送信されたトラックバックの内容は、 ajaxtb-data ディレクトリにページごとのテキストファイルを生成して格納しています。 例えば、本ページのテキストファイルは works_ajax_ajaxtb_ajaxtb.html.txt というファイル名になっています。 UTF-8 エンコードのタブ区切りテキスト形式です。

カラム番号内容補足
第1カラム送信日時2006-03-06T15:37:07ZW3CDTF形式のping送信日時(GMT)
第2カラムプロセスID42018特に利用しません
第3カラムIPハッシュ10060送信元IPアドレスからのハッシュ値(5桁)
第4カラムcharsetUTF-8ping送信時の文字コード
第5カラムurlhttp://kawa.at.webry.info/200603/article_1.htmlping送信元ブログ記事のURL
第6カラムtitle[ajax] 静的HTMLページにも掲示板&トラックバック機能をping送信元ブログ記事のタイトル
第7カラムexcerptkawa.netのサイト(ブログ以外)は CMS などのツールを...ping送信元ブログ記事の要約文
第8カラムblognameゆうすけブログping送信元ブログ名(サイト名)

第3カラムのハッシュ値から送信元IPアドレスを逆算して割り出すことはほぼ不可能ですが、 例えば、イタズラの連続pingが同一人物からのものかを判定するときなどに使います。

トラックバック SPAM の自動検出、ブロックIPアドレス、削除機能等の管理者画面はありません。
FTP で該当ファイルをダウンロードして、行単位でトラックバックを削除してください。
UTF-8 エンコードですので、編集時には 秀丸エディタ などのテキストエディタが必要です。
面倒なら、ファイル単位で削除しちゃう方が早いです。

ソーシャルブックマークへのリンク

はてブ・del.icio.us といったソーシャルブックマークに コメントを書く人も多くなっています。
トラックバックのようにページ上に残らないため、見逃してしまうこともあります。
AjaxTB によるトラックバック機能実装に加えて ソーシャルブックマークへのリンクも用意しておくと、 分かりやすくて便利ですね。

はてなブックマークへのリンク

おまけとして、 はてなブックマークへのリンク このエントリーを含むブックマーク のアイコンを入れるコードは↓。

<a href="http://b.hatena.ne.jp/entry/http://domain.name/path/to/page.html#comments"
	target="_blank"><img src="http://d.hatena.ne.jp/images/b_entry_de.gif"
    alt="このエントリーを含むブックマーク" border="0" width="16" height="12"></a>

ただし、 アイコンの画像ファイルは自分のサーバにコピーしてから利用しましょう。

del.icio.us へのリンク

おまけ(その2)として、 del.icio.us へのリンク del.icio.us のアイコンを入れるコードは↓。

<a href="http://del.icio.us/url/check?url=http://domain.name/path/to/page.html"
    target="_blank"><img src="http://www.kawa.net/rss/images/delicious-12x12.gif"
    alt="del.icio.us" border="0" width="12" height="12"></a>

こちらも、アイコンの画像ファイルは自分のサーバにコピーしてくださいませ。

del.icio.us は、通常なら予め URL を MD5 形式に変換した上で渡す必要がありますが、 /url/check?url= とすると検索機能を経由して、 del.icio.us 側で自動変換してくれて便利です。
もちろん、Perl・JavaScript 等で自前で MD5 値を計算できる環境の場合は、 del.icio.us に計算させずに、自前で計算してあげてください。

国内のユーザは圧倒的に はてブ ユーザが多いですが、 やはり、海外のユーザは del.icio.us ユーザばかりです。(当たり前か)

更新履歴

2006/08/19
アクセス元IPアドレスのハッシュ値計算が誤っていたので修正しました。 (thanks to Sibelianさん)
ついでに同梱の JSON.pmXML::TreePPXML::FeedPPモジュールも最新版に更新しておきました。
2006/05/29
URL 中に _ アンダーバーが入った場合の RSS/JSON ファイル出力をようやく修正しました。 (thanks to Indexさん)
2006/05/26
www.domain.name/index.html や www.domain.name/path/index.html への トラックバックのログファイル名を正規化しました。 URL 末尾に index.html を付ける付けないに関わらず、 ドキュメントルートの /index.html 用ログは _.txt、 下位ディレクトリの /path/index.html 用ログは path.txt というファイル名になります。
旧バージョンとは少し処理が変わるため、既に ajaxtb-data に入っている トラックバックのログが参照・表示できない場合があります。
参照できない場合は、ajaxtb-data 内にある該当ログの ファイル名を変更してください。 また、その場合は url.alias ファイル(URLとログファイル名の変換表/キャッシュ)を いったん削除する(クリアする)必要があります。 お手数をおかけします。m(..)m
今回の配布バージョンから、 JSON.pmが添付なので、 別途インストールが不要になりました。ありがとうございます!>まかまかさん
2006/05/05
JSON モジュールまたは JSON::Syck モジュールがある場合は、 最新コメントのインデックスファイルを JSON形式 でも出力するようにしました。
2006/04/01
url.alias ファイル(ページURLからajaxtb-dataデータファイル名への マッピングファイル)の重複チェック処理のバグを修正しました。
ajaxtb.cgi?__mode=rssで↓の RSS ファイルを再生成するようにしました。
データファイルを操作してコメントを削除した場合などに、RSS を更新できます。
なお、各ページごとの RSS でなくて、サイト内の全ページ一括の RSS です。
2006/03/16
ajaxtb-data/recent.xml に最新コメントの RSS を発行するようにしました。
2006/03/06
最初のリリースバージョン

コメントはこちらへ by AjaxCom

その他のページへのリンク

このページへのトラックバック by AjaxTB

トラックバックURL⇒ http://www.kawa.net/service/tb/ajaxtb.cgi/works/ajax/ajaxtb/ajaxtb.html

Kawa.netxp © Copyright 2006 Kawasaki Yusuke