Debug- Official Website -


犬土偶日記

海の近くに住みたい

Debug日記の使い方

話題:Webプログラミングとか

2004年02月17日

サイトリニューアル

公開日時: 不明

ついに夜型から抜け出せそうな気配が漂い始めた。朝5時ごろに目が覚めた。これはチャンスだ。何をやるにしても午前中が一番脳の働きがいい。起きてすぐといことではなく、午前中であることが重要だ。何故だかはわからん。とにかく午前中は脳みそのパワーが1.5倍ぐらいになる。この時間に起きてない奴はバカだと断言してもいいぐらいだ。そうか、俺はバカだったのか(鬱)

というわけで、この機を逃さず一気にサイトリニューアルを終えてしまおうと思ったのです。このままではいつまでも終わりそうにないし、長引けばまた余計なことを思いついて全ページ書き直しとかになったりするし。今までも何度もあったからな。そういうわけで、コーヒーをガブ飲みしながら猛烈に残りのページを作り始めた。まずはSupportのページと問い合わせのページ。普通のHTMLはただ文章を書いてタグつけるだけだからいいんだが、問い合わせのフォームあるだろ?あれはHTMLだけじゃ機能しないんだ。フォームを置くだけならHTMLで書けばいいんだけど、そこに何か打ち込んで送信する機能をつける場合、送信されたデータを処理するサーバーサイドのプログラムが必要になる。いわゆるCGIっていうやつだね。掲示板とかチャットとか、この日記もそうだな。ユーザーの入力が反映するページってのはCGIを使わなきゃいけない。フォームから送られてきたデータを処理してログファイルに記録するとか、ログファイルを読み出してそれを処理して表示するとか。そういうのは普通はPerlっていう言語を使ってプログラムする。サーバーに色々インストールされてたりコンパイルが可能だったりすればC言語とかも使えるが普通の無料レンタルサーバーではPerl以外ダメってところが多い。CGI自体がダメっていうところの方が多いかもしれん。バグを残したスクリプトを実行されてサーバー落とされたらシャレにならんからな。使えないようにしておくのが無難ではある。で、このサイト用に借りてるサーバーではPerlのCGIが使えるのでフォームからのデータを処理するプログラムを作ることにしたんだよ。CGIは便利だよ。フリーで配布してるCGIを拾ってきてもいいけどフォーム程度なら後で自分用に書き直したりする手間を考えるとゼロから自分で書いた方が断然いい。まずはフォームから書き込まれた時の処理を考える。送られてきたデータを処理。とりあえずタグは無効にしよう。連続改行や無意味な空白の連続は消そう。フォームから送られるデータ以外にリモートホストと書き込んだ時間も記録しよう。そうやって色々考えながらそれを実際にプログラムしていく。そしてデータを記録する形式を決める。項目の区切り文字は何にするかを決める。そしたら今度はフォーム内に偶然その区切り文字が入って記録形式に不備が出る事態を避けるためにその区切り文字が含まれてたらそれを別の文字に置換する。データ処理のサブルーチンを書いたら次はファイルに実際に書き込む部分。ファイルをオープンしてロックして書き込んでロック解除してクローズ。次は読み出しのルーチンだ。問い合わせフォームから送られたデータを表示するというのは、メンバー以外の人間に見られないようにも配慮しないといけない。通常アクセスでは表示されないように。ここで引数の処理をする。どういう状況なのかを判断するためのフラグっていう感じかな。今は書き込みでアクセスしている、とか、読むためのアクセスだ、とか、そういうのがわかるように印をつける。そして何もデータを渡されなかった時はエラーを出すように。そのフラグ形式を決めた後に表示用のルーチンを書く。まずどういう形式にするか。表形式で一覧を表示してそこから各投稿データにリンクする形式にしよう。その表のデザインも含めて考えねばならん。そして通常のHTMLではなく全てCGIで書き出すことにしよう。それってレスができない簡易掲示板と何も変わらんね。一覧表示部分のルーチンを書くに当たって、長すぎる件名を短縮表示するために**バイト以降の文字を省略するとか、件名をリンクにするとか、短い件名でもリンク部分を長くしてクリックしやすくするためにスタイルシートを弄るとか、新しい記事から順番に表示するとか、色んな処理を書き込む。で、次は各記事を表示する際にはどうするか考える。配列の添え字でアクセスすればよかろう。一覧のリンク部分にアクセスする記事の番号を引数として与えてやればいい。そして実際に表示する部分のTABLEを書いて終わり。大体こんな感じでサブルーチンだけをまず書きまくり、最後にメインルーチン。メインはただの条件分岐だ。フラグが書き込み状態になっていて、必須項目が空欄の場合はエラーを出力、フラグが書き込み状態でデータがある場合、データを処理してファイルに書き込んで書き込んだ内容と書き込み完了を通知する画面を表示、ただしファイルがオープンできなければエラーで終了、書き込みモードでない場合で参照番号つきの場合はその記事を読み出して表示、書き込みモードでなく記事番号が与えられない場合は一覧表示、それ以外の場合はエラーで強制終了。そんな感じで条件ごとに呼び出すサブルーチンを振り分けるだけだ。セキュリティの問題とか俺の記憶力の弱さとかもあって実際にはここに書いたのとは違う処理がされている。スクリプトを書き終わったら次は実際に実行して確かめる。いきなりサーバーにアップしてはいけない。バグがあったらサーバーを落としてしまうかもしれない。まずは自分のPC上で実行。考えられるありとあらゆる操作で動かしてみる。タグを打ち込むとか改行を入れまくるとちゃんと処理してくれるかとか、空欄で送るとどうなるかとか、不正な引数を与えるとどうなるかとか、いろいろとね。で、実際にちゃんと動くことを確認した後に今度は別のページ作成にかかる。フォームからのデータを見るのはバンドメンバーだけだ。つまり認証の必要なメンバー専用ページが必要になる。これもCGIだ。認証後に専用ページに飛ばす処理だと、専用ページ自体には認証など無くてもURLさえ知ってれば飛べることになる。だからそういう頭の悪いことはしない。クッキーを使った一時的なセッションのみでっていうのもあるけどめんどくせぇしクッキーなんていくらでもゴニョゴニョってことで、手っ取り早くこれも全てCGIで書き出す。認証がうまくいかなければ何も書き出さない。ただこれはサクッと作ったので今のところはセキュリティとかザルですがね。でも今は見てる人少ないし中身も別に大したことないからアタックかける価値がない。とりあえずこれでOKさ。結局フォームと認証ページだけで俺の個人サイトの登山日記のスクリプトより長くなった。これで一応全部完成したはず。あとは全ページHTMLとCSSをもう一度文法チェックにかけてみる。ダメなところは修正して、ローカル鯖で全ページ確認。NetscapeとOperaでも確認。更に画面解像度を800x600にして3つのブラウザで確認。他のCGIコンテンツにおいてもデザインを統一すべく、日記と掲示板のヘッダ部分とかを弄る。激しく疲れた。ふと時計を見ると14時だった。おいおい!9時間もやってたのかよ!リーマン並みじゃねぇのか?最近時間が過ぎる速度が速い。どんどん加速していく。腹減ったので飯を食い、そのまま寝ようかと思ったがやっぱりUPしておいた方がいいかなと思ったのでUPし始めた。もしここで寝てしまって俺がそのまま帰らぬ人となったら今まで作ったのが無駄になるからな。UPしてから寝た方がいいに違いない。それで、まずは新しく作ったページから上げ始める。更新中を見られるのは恥ずかしい。わからないところから上げていく。結構な量だから大変だったよ。ページ数も気付けば倍ぐらいになってるし、CGIなんかはファイル1つじゃないもんな。ログファイルとかライブラリとかあるし。しかもCGIはパーミッションの設定もしないと動かない。実行権限とか書き込み権限の設定をしないと動かない。全部UPし終わったら次はちゃんとできてるか全ページ確認だ。HTML全ページ確認して、CGIも動くか確認。試しにフォームから書き込んでみたりもする。どうやら大丈夫だったらしい。あとはメンバーにログインパスとかをメールで送って終了。長かった。もうしばらく弄らぬよ。当分このままさ。結構作りこんだからな。見た目はシンプルすぎてバンドのサイトには見えんぐらいだな。音楽やってるやつのサイトって激しく見た目重視とかでウザイのよね。一番腹立つのがJavaScriptで別窓開くやつと窓サイズを勝手にリサイズしやがるやつ。リサイズするやつによくありがちなのは自動リサイズ後にユーザーが手動でも元に戻せないやつね。ウザイなんてもんじゃない。アホかと。ページのサイズとブラウザのサイズを完全に一致させて喜んでるつもりなんだろうが、俺の場合、ブラウザの左側に履歴を表示してる。IEではエクスプローラーバーとか呼ばれる領域(?)に。お気に入りとか検索とかを表示してるやつもいるだろう。それも含めてブラウザのサイズを固定にしやがるから右側が見れんのだよ。手動リサイズも無効にされるから履歴とかお気に入りの表示を消さないとダメだ。激しくめんどくせぇ。内容が自己満足なサイトは別に構わんがこういうところで誇らしげにウザイことするサイトは嫌いじゃ。SURFACEのオフィシャルサイトとかLUNA SEAのオフィシャルサイトとかMUSIC STATIONのサイトとか色々。過去に見た中で一番極悪だったのはELTのオフィシャルサイトだな。今は普通だけどキヲクとかの頃、去年か一昨年かそれぐらいの頃、ELTのサイトに行ってみたのよね。そしたら画面に写真が1枚表示されてるだけ。あとは何も無い。いつまで待っても何も無い。どこにもクリックする場所が無い。ソースを見てみたらJavaScriptで色々書いてあったよ。ウザイwindow.openってやつで別窓が開くようになっててね、その別窓内にコンテンツのメニューとかがあるの。で、俺はJavaScriptをオフにしてたからそれが実行されずに放置されたというわけさ。そういうページはJava未対応とかJavaオフにしてるやつのために<noscript>〜</noscript>っていうタグを使わなきゃいけない。Javaが動かない環境ではそのタグ内にリンク先のURLを書くとかしないとどうしようもないだろ。そんなこともしてないからJavaScript使えん奴は来るな!っていう感じになっていた。しょうがないからJavaオンにしてリロードしたらちゃんと行けたけど、あれは衝撃的だったな。あと音楽系サイトにありがちなのは極小フォントを使いまくる。小さいフォントがカッコいいと思ってる人間が多いらしい。この日記も初期状態では相当小さいフォントで固定されてたし。狭い領域に小さい文字、しかも背景とのコントラストが低い文字、これが最近の流行りらしい。あとはFlashか。最近は何もかも全てがFlashで作られたページも多いね。俺はFlashが嫌いだ。セキュリティ上の問題でActiveXをオフにしてるので表示されない。完全にオフだと困る事もあるので警告ダイアログが表示されるように設定してある。そうするとFlashのページに行くとダイアログでまくりでウザイのさ。しかもそのダイアログのボタンはActiveXを無効にする「いいえ」に初期状態でフォーカスされてるからEnterキーを押すとFlashが再生されない。だから「はい」をクリックしないといけない。ページ丸ごとFlashならいいけど1ページに複数のFlashがあると地獄だね。ある意味ブラクラ。見た目のカッコよさとかどうでもいいんで、今まで自分が見てきたサイトの「ウザイ」と思った部分は徹底的に避ける方針で作り直してみました。そしたらこんな感じになってしまいました。。。音楽っぽくないな。やっぱ音楽やってるやつならバカっぽくカッコつけたつもりでカッコ悪くするのが卑屈に世の風潮に迎合する感じで良いのではないかと思えてきた。次回のリニューアルではALL Flashで。。。絶対にあり得ん(笑)

◇犬土偶 Selection #027
Soul Station / 稲葉浩志
1st Album「マグマ」収録

ソロになるとB'zの時とは違ってすごい暗い感じの曲が多くなるね。FF7やりながらこのアルバム聴きまくってたから今でもマグマを聴くとFF7を強烈に思い出す。この曲を選んだ理由は、初めてまともにギターソロをコピーした曲だから。B'zのTAKみたいにギター弾いてみてぇ〜って思って始めたのはいいが、1年ぐらい経っても何もまともに弾けないような状態。最初からいきなりB'zのPleasure・Treasureの楽譜見ながらやり始めたからな。指も開かんし動かんしコードも押さえれんし。譜面だけは読めたけどいきなりB'zなんか弾けるわけもなく、それでも頑固にB'zにこだわり続けて1年。もうダメかなと思ったんだが、そんな簡単に諦めるほど雑魚じゃないんで、どれか1つ、これだけは絶対に弾けるようになってやるぜ!と思って手を出したのがB'zではなくて稲葉ソロのSoul Station。ギターソロだけ長時間練習し続けた。聴いた感じそんなに速くもないんだが、当時の俺にはかなり厳しいだろうなっていうのはわかってた。それでもやり続けたら意外とあっさりできてしまった。なんだ、これぐらいのなら俺でも何とかできるんだ・・・と思って少し自信がついてまたB'zに手を出し始めた。今でもまともにB'z弾けねぇんだけどな。

話題:Webプログラミングとか

Info.
公開日時不明
本文文字数5704文字 (タグ込み)
URLhttps://orca.xii.jp/debug/diary/diary.cgi?id=dogoo;date=20040217
RSS1.0https://orca.xii.jp/info/diary-dogoo.rdf
Comments

コメントはありません。

コメント投稿フォーム
文字色              
  • 名前を省略すると「名無しDebugger」になります。
  • メールアドレスの入力は任意です。
  • 海外からのコメントスパム対策のため、表示された漢字の読みを必ず入力してください。
  • 本文は必須項目です。投稿する場合は必ず記入してください。タグは使えません。
  • 改行が1つ入力された場合は強制改行として処理されますが、2つ以上連続する改行は段落の終了として処理されます。
  • 本文の行頭に「>」のある文は引用としてマークします。引用でない部分の冒頭に「>」は付けないでください。
  • コメントの削除は管理者若しくは日記執筆者しかできません。書き込む時は注意しましょう。
  • 全部記入が済んだら投稿ボタンを押す前に一度読み直して推敲しましょう。