Shell拍手

このページも配布したくて書いたというより解説したくて書いたようなものなので、適宜いらないところはすっ飛ばして読んでね。

Shell拍手（ShellClap）とは

Shell拍手はBashで作った自作Web拍手もどきCGIです。
Web拍手さんにインスパイアされ、拍手設置場所URLの自動記録と拍手1回目からコメントがつけられるようにしたものです。
複数の作品ページなどがあるときに各ページに設置することで、何に対して拍手やコメントをもらったのかが分かるようになります。
そのかわり、拍手2回目以降に異なるお礼画面をつけるという機能はありません。今のところ……。

もらった拍手数を見るためのウェブページがあるわけではないので、CGIが生成したログファイルをFTPソフト等で取り出して閲覧する必要があります。

拍手フォームやログファイルのサンプルについては下から2番目に載っているので、先に見てみてちょっと違うなと思ったらやめておいたほうがいいかもしれません。
あれこれ書いていますが、「使用条件」と「実装」「注意」のところだけ見てもらえればサクっと使えます……多分。

なお、このShell拍手は見た目のカスタム以上に挙動自体も好きに改造してもらってOKです（Bashだし…）。改造後のコードの公開などもお好みでどうぞ。

使用条件

システム面
- サーバ内でCGIが使用可能であることと、Bashが動作する（サーバのOSがLinuxである?）ことが前提です。有料のサーバまたはCGI使用プランなどを使用していれば作動すると思われます。
- 訪問者がJavascript未使用のブラウザを使っている場合、URLがNoLocationになり記録されません（拍手カウントは入ります）。
- FTPソフト、サーバーサービス付属のWebFTP等でファイルの取り出しができないと拍手データの閲覧ができません。（なおこちらではFTPソフト等の使い方については解説できません…）FTP機能のないサービスを使っていないかどうか注意してください。

その他
* 設置やカスタマイズに少々のHTML、CSSの知識が必要です。
* 十分にテストしてから公開されることを推奨します。
* 何が起こっても自己責任でお願いします。

* こういったことがありますので普通はインスパイア元たる本家Web拍手さんをご利用になることをおすすめします。

実装

clap.html と clapwrite と clap.cgi をダウンロードしてサーバーのルートに設置します。（右クリック→名前を付けてリンクを保存）
clap.cgi と clapwrite は実行権限がついているか確認してください。（つけた状態で配布しているはずなのですが、一応）

clap.html で拍手送信フォームを作り、
clapwrite でフォームから受け取ったURLクエリの処理と保存を行います。
clap.cgiは排他処理のためだけに使われます。拍手処理中に別の人から拍手を受け取る時にデータが壊れる現象を防ぎます。

拍手フォームの設置はiframeタグの挿入で行います。
なので、とりあえず3ファイルを置いて好きなところに以下のiframeタグを挿入するだけで拍手を受け取れるようになります。

設置

以下のHTMLタグを設置したい場所に貼り付けます。style="〜"内は枠線の表示なので、要らない場合は空白にしてください。widthとheightの値で設置サイズが変更できます。 <iframe src="clap.html" name="clapframe" width="300" height="120" style=" border: solid 1px lightgray; border-radius: 3px; "> [inline frame] </iframe> フォルダによって分けられた日記や作品ページなどで、設置したいhtmlとCGIファイルが同じフォルダ階層にない場合（http://yourdomain/diary/today.html など）は、iframeタグのsrc部分をsrc="../clap.html"に変更してください。（階層が1段違う場合）
相対リンク対策として <base href="../"> を追加してあるページの場合、この処置は不要です。

閲覧

clap.cgiの置いた場所と同じ階層に、.clapdataと.clapdata.htmlが生成されます。
通常の閲覧の場合は.clapdata.htmlをブラウザに通して見ることを推奨します。グラフ化などの処理を行いたい場合は、.clapdataをご利用ください。

.clapdata.html は.clapdata をベースにして拍手毎に再出力されています。
.clapdataを消去すると次に拍手を受けた時に.clapdata.htmlは空のデータにその1件のログのみを付け足したもので上書きされます。拍手はいつ受け取るか分からないため、実態としては道連れにされるように今までの拍手カウントとコメントが消失することになります。
.clapdata は見る用のファイルではありませんが削除しないでください。どちらとも自動バックアップなどで保持することをおすすめします。

その他

あとはもうごちゃごちゃしたことです。

各種デザイン（拍手フォーム、お礼ページ、解析用HTML）のカスタム

ファイル内にコメントアウトして書いてあることも参考にどうぞ。

すでにサイトデザイン用のCSSファイルがある場合、linkタグの挿入で読み込ませるとある程度デザインを共有・流用することができます。class属性などをつけてそちらのCSSファイルで一括管理することもできます。その場合は以下のstyleタグやstyle要素は削除してください。

■拍手フォーム：clap.html のstyleタグ内にベタ書きしてあります。

※ボタンとコメント枠の位置を入れ替えるためにタグを入れ替えた場合、clapwrite の url="$(echo ${QUERY_STRING} | nkf --url-input -s | awk -F"&" '{ print $2}' | sed "s/.*\///")"
comment="$(echo ${QUERY_STRING} | nkf --url-input -s | awk -F"&" '{ print $3}' | sed "s/input=//")" $2と$3の部分だけを入れ替えてください。処理前のURLクエリはInputやButtonタグが出現した順に記載され、デフォルトのCGIのクエリ処理はコメントが末尾に来ることを想定しています。

■お礼ページ：clap.cgi の14行目あたりにStyle属性を含んだHTMLタグがあります。body内であれば好きに画像などを設置できます。

■解析用HTML：clapwrite の30行目あたりから色やフォントサイズのカスタムができます。……が、これが反映されるのは次に拍手を受け取った時なので、一瞬だけ自画自賛をするか、他の人が押してくれるまで待つしかありません。

ファイルがごちゃごちゃしていて申し訳ないのですが、これがこんふぃぐの限界なので他に作り変えられる方がいらっしゃいましたら改造や再配布などを何卒お願いします……。

iframeを設置せず拍手ボタンフォームを設置する

訪問者が広告ブロッカーなどを使っていてiframeが排除されてしまったり、デザインの都合でiframeを使いたくない場合、clap.htmlのformタグを中身もろとも直接貼り付けてください。

サンプル

実際に送信できます。このサイトに設置している拍手とは別データに入るのでテスト投稿はご自由にどうぞ。

ログファイルサンプル：.clapdata
ログファイル（HTML形式）サンプル：.clapdata.html
※これらのファイルは上のサンプルフォームとは連動していません。

注意

■外部の人に見られることがないよう、chmodによって通常はブラウザからのアクセス（http://yourdomain/.clapdata（.clapdata.html））を遮断しています。直接見ようとすると403エラーで断られます。FTPソフト等でログインしてファイルを開いた人のみが見れるようになっているはずです。

■ドットで始まるファイルなのでFTPソフトの初期設定で表示されていないことがあります。
clapwrite の3行目あたり file=".clapdata"でファイル名を定義しているので、ここでファイル名が変更できます。
あえて長く複雑な名前にして clapwrite 内の最後「chmod 600」を「chmod 666」にすることで、そのファイル名を知っているあなただけがFTP経由なしでもブラウザから直接データを見れるようになりますが、セキュリティ的には全くパワーがありません。

質問などがありましたらBBS（Pass: connedos）またはメールなどでどうぞ。（FTPソフトの使い方についてはお答えできません…）