fhpg @homepageでここまできる[①]

ファイルの更新を[NEW]イメージで明示する

 掲示板の更新を、トップページの掲示板へのリンクにつけられたアイコンで示す方法です。   

 これは、シェルスクリプトです。CGIはPerlが全盛ですが、ちょっとした小さなプログラムはシェルスクリプトのほうが簡単?です。
 ただ、残念なことにシェルスクリプトによるCGIの説明は本当に少なくなりました。特に@niftyの場合には使用できるコマンドが少なく・・・nkfが無いのは痛い・・・、文字列の複雑な処理を含むCGIは、Perlによる開発には太刀打ちできません。
 Windows以外のOSでは拡張子によってファイルの操作の制限はありませんが、@niftyではPerlで書かれたCGIは、拡張子がcgiかplに制限されています(という設定も可能)ので、他の拡張子または拡張子がないCGIはシェルスクリプトで作成する必要があります。

スクリプトの説明(と言うほどのものではないですけど)

 自分のサイト内のコンテンツを示すHTML(多くの場合、index.htmlとかcontents.htmlにされていると思いますが)には、サイト内のページへリンクがあります。いずれかのページが変更された場合[新着]とか[New]、[update]という文字やアイコンで示すことが多いと思います。
 ただ、この方法ではリンク先のページを改定するたびにHTMLを書きなおさなければなりません。
 このCGIは、外見上(URI)も、[http://hpcgi[*].nifty.com/[YourName]/images/icons/updating.gif]のように、まったく画像ファイルになります。
 これは、@nift内の[ホームページ作りのフォーラム]内の掲示板[fhpg CGI設置]に投稿された「更新がある印をだす(には?)」という記事で、ちょっと書いてみたスクリプトです。
 こんだけですから、わざわざPerlを使うことはないでしょう。

ファイル名[updating.gif]

#!/bin/sh
echo 'Content-type: image/gif'
echo
Tested=`find /cgi-bin/diary/ -mtime -3 -name "data.txt"`
if [ "$Tested" = "/cgi-bin/diary/data.txt" ];then
    cat '/homepage/images/icons/new.gif'
else
    cat '/homepage/images/icons/old.gif'
fi
exit 0
 自分だけが、たったひとつのファイルに対してチェックするのならこれでも良いですが、汎用性が無いので変数を使って書きなおすと

ファイル名[updating.gif]

#!/bin/sh
NewImage='/homepage/images/icons/new.gif'
OldImage='/homepage/images/icons/old.gif'
CheckDir='/cgi-bin/daiary/'
CheckFile='data.txt'
UpdatingDay='3'

echo 'Content-type: image/gif'
echo
Tested=`find $CheckDir -mtime -$UpdatingDay -name "$CheckFile"`
if [ "$Tested" = "${CheckDir}${CheckFile}" ];then
    cat "$NewImage"
else
    cat "$OldImage"
fi
exit 0
 特別に説明するほどのものではないので、良くスクリプトを眺めて必要な箇所赤字を変更してください。
 ただし、Perlと異なり変数への代入部分で[=]の両側には、半角スペースは置けません。また、if/else/fiは行頭から書く必要があります。

使用方法

 使用方法を順番に説明します。Perlでのスクリプトと異なる部分がいくつかあるので注意してください。
  1. アイコン用画像ファイルを作成し、サーバーにアップロードし、パーミッションを設定
    • 新着用のGIF画像を、幅[48]ピクセル×縦[24]ビクセルで作成し、ファイル名を[new.gif]として保存
    • 非新着用のGIF画像(同サイズ透明)を、幅[48]ピクセル×縦[24]ビクセルで作成し、ファイル名を[old.gif]として保存
    • [new.gif]を、バイナリモードでアップロードする。
    • [old.gif]を、バイナリモードでアップロードする。
    • それぞれのパーミッションを[600]とする。
  2. CGIのソースを編集する。
    • [new.gif]のCGIからのシェル上のパスをNewImage='[/homepage/images/icons/new.gif]'に記入
    • [old.gif]のCGIからのシェル上のパスをOldImage='[/homepage/images/icons/old.gif]'に記入
    • 更新をチェックするファイルの存在するシェル上のディレクトリをCheckDir='[/cgi-bin/daiary/]'に記入([/]まで書くこと)
    • 更新をチェックするファイル名をCheckFile='[data.txt]'に記入
    • いつまでをチェックするかの日数をUpdatingDay='[3]'に記入
    • 編集したファイルを[updating.gif]という名前で保存する
  3. CGIをサーバーにアップロードする
    • ファイル名は[updating.gif]
    • 必ずテキストモードで転送すること
    • アップロード先は/cgi-bin以下のディレクトリであること
      例:/cgi-bin/[images/icons/]
    • パーミッションを[700]とする
  4. アイコンを表示するHTMLを編集する。
    • 上の例だと
      <img src="http://hpcgi[*].nifty.com/[YourserName]/images/icons/updating.gif" width="[48]" height="[24]" alt="更新マーク">
    • HTMLをアップロードする
 以上です。編集したHTMLを表示させて見ましょう。

応用について

 じつは、このスクリプト、あまり良い出来ではません。もっとスマートな方法があります。
 [NewImage]と[OldOmage]はともかく、チェックは特定のファイルだけでなく「任意のディレクトリ内のHTMLのいずれか」と「更新チェックの間隔」はスクリプトではなくリンクから指定できるようにするべきでしょう。
 たとえば、<img src=http://hpcgi1.nifty.com/Iruka/images/updating/book/index.html/3day/icon.gif" width="48" height="24">のように・・
 ちなみに上記は、「/bookディレクトリのindex.htmlが3日以内に更新されていたらアイコンを変える」という意味!!
 また、<img src=http://hpcgi1.nifty.com/Iruka/images/updating/abcd/7day/icon.gif" width="48" height="24">だと、「/abcディレクトリ内のHTMLが7日以内に更新されていたらアイコンを変える」という意味!!

ヒント

 CGIへのリンクのPATH_INFOから、これらの情報を渡し、sedを使って必要な情報を該当する変数に代入すると良いです。

目次へ | このページの最初へ
このページは、Netscape7.1-ComposerEm_Editor3.35で作成しています。

スタイルシートの選択

 HTML4.01の「代替スタイルシートの指定」に対応しているブラウザ(Netscape(6以降))や、OperaMozilla)は、代替スタイルシート(Alternate StyleSheet)を選択できます。【イメージ1】
 このページは、IEなど他のブラウザでも、javaScriptを用いずに代替スタイルシートを選択できるようにするテストです。
 Netscapeは、[表示]→[スタイルを使用]で基本のスタイルシートを選択しておいてください。【イメージ3】
下記ボタンをクリック
 サイト指定 
 パステル  
 反 転   
 ハイコントラスト 
 な し  

<テスト中  Now, It is under test.>
 パステル(pastel.css)以外は直接ファイルを参照してもご覧いただけません。
  Netscapeは、[表示]→[スタイルを使用]→[ソース]でいずれも確認できます。【イメージ2】

このHTMLは、HTML 4.01 Transitionalで書かれています。対応したブラウザ(Netscape,Mozilla,Opera)でご覧ください。
【詳細】IEを使い続けるリスクを再認識しようと、Mozilla にできて IE にできない 101 の機能