A15. Dream CounterをImageMagickで表示高速化           ぶらり旅行写真集

2024- 3- 7初版   2024- 4- 2更新   

 
       1.プログラムの入手と手順確認
       2.Dream Counterを使うためのサイト構成の検討
       3.Dream Counterの調整手順
       4.Dream Counter表示用の設置
       5.セキュリティ対応ほか
       6.Dream Counter設置後のカウント状況

 アクセスカウンタは高速表示できるものがスマートです。 CGIだけの処理ではカウンタ文字の画像連結の
負荷が大きく1文字づつのパラパラ表示でいかにも負荷が重いということが見てとれます。
 Dream Counter CGIはカウンタ文字の画像連結の高速化にImageMagickを使う設定が使え、使った結果は
満足できる表示速度になった。 (複数のカウンタが設置可能で当方では2つのカウンタ設定で使用)
 従来は合理的な設定調整の手順がなかったがブラウザのソース表示を使うと簡単に正常なパスを見つけ
られることが分かったので無駄な時間を使わずにカウンタを設定することが可能です。(3.項 調整方法
(注) 当方はさくらインターネットで最も安いライトプランを使っているが、PHPに関連するImageMagickを
   使えた効果が大きい。 最初のgifcat.plライブラリでの表示は僅かに速い程度だったが、 ImageMagick
   使用に設定を変更して期待以上に速くなった。(注) ImageMagickはライブラリだが使い方が良いので速くなった。
     その後、プロバイダ(DT I)とさくらインターネットの2つのサイトを合体して1つのサイト構成にした。
   当然ながら別サイトを統合したので運用上の最適化が必要で Dream Counterの設定位置の変更を
   しなければならなくなり、最初から最終構成で設定していれば良かったが手戻りになった。
   (参考) cgi ファイルを含むサイト構成の変更はHTMLエディタ関連でトラブルが起きやすい。

 
1.プログラムの入手と手順確認
  (Dream CounterのCGIプログラムの入手)
  KentWebの[プログラムの入手]からdream.zipをダウンロード、エクスプローラーで解凍。
  解凍して説明通りの構成でファイル/ディレクトリが展開されるので使用するサイト構成内へコピーする。
  (サイト構成のDream Counterソフトの場所とPC側のルートディレクトリとの相対的な関係が重要)
  (注) KentWebではCGIソフトの設置環境について詳しい説明がなく使う側の判断に任せている。
     レンタルサーバーでは普通はトップページ以下の設置になるので使い方は考える必要あり。

  (設置側のindexと使用マニュアルのkentが同じ目的でごっちゃに表記されている感じ)
  CGIファイルの編集には用途に合った専用エディタの表示が見やすくトラブルが起きない。
  (使ったことがあるエディタ TeraPad(多機能)、Crescent Eve(軽い) エディタによって表示・文字の大きさが違う
    TeraPad、Crescent Eveでの init.cgi の画面表示例(1000x737pxのJPEG画像
   実行環境値設定: 説明にあるinit.cgiの設定値をエディタを使って編集して上書き保存。
  ( init.cgi は初期値のような名前だが実行中にこのファイルがないとDream Counterが正常に動かない)
   dream.cgi, admin.cgi, check.cgi にPerlへのパスを設定する。(さくらインターネットは #!/usr/bin/perl )

 
2.Dream Counterを使うためのサイト構成の検討 (最終的にどうするかが重要です)
    Dream Counterを設置して別のサーバーからサイト移動して統合する予定があるのなら、ここで
  最終的なDream Counterの設定を考えた方が手戻りが起きません。
    Dream CounterをKentWebの説明通りに設定するとDream フォルダが作られます。
    Dream Counterは使い方を変えない限り同じ場所に表示されるのでサイト共通部分として特定の
  場所に置いた方が邪魔にならず作業性が良くなります。
   当方は一度Dream Counterを説明通りに初期設定してから構成を変更しました。
  (参考情報)
  <Dream Counterの参照側の移動はHTMLエディタのリンク更新でやれる>
   Dream Counterを設置後にカウンタの参照側のフォルダ位置の変更はHTMLエディタのリンク更新で
  問題なく処理できた。  北海道ショートカット集を (移動前) /N-shortcut/index.html から
  (移動後) /_N-shortcut/index.html (先頭にアンダーバーを付けた名前)に変更して問題なく動いた。
    Dreamweaver上で名前変更でhtmlファイル内の関連リンクを更新処理ができる。
  <Dream Counter側の移動はDream Counter内の init.cgi 内の設定情報が絡むので問題が起きやすい>
    Dream Counter側を移動した場合アンダーバー付の名前に変更した部分の更新が微妙な処理に
  なって更新処理された場合と更新されない場合の2つの状況が発生した。(原因不明)

サイト構成の表示例  <サイト構成の表示例>   (当方のサイト構成例の主要部分の説明)
  当初はフォルダ数が多くてごっちゃな画面表示になるとは想像して
いなかった。 Dream Counterを設定して最終形態にしようと別サイトと
一緒にしたら一画面内に収まらず縦スクロールをしなければいけない。
  フォルダを開いたり閉じたりの操作が簡単にできないのは我慢でき
ないので一画面内に収まるようフォルダ名を変えたり、フォルダの場所
を移動(他のフォルダの下へ)したりして画面表示 を見やすくした。

 
3.Dream Counterの調整方法ブラウザが処理中のimg部の画像を表示、実行中の状態確認ができる
    合理的な調整方法が分かると時間をかけないで設定することができます。
   (これが最初から分かっていたらもっと楽ができた筈だが、後で発見して作業が楽になりました)
  <カウンタ設置の設定確認法>
  ・第一段階: PC内だけでの確認
    エディタからブラウザでローカル表示させた時にdream.cgi を参照するリンクをクリックした時に、
    dream.cgi ページが表示されればdream.cgi へのパスが合っています。
    (表示されない場合はdream.cgi との相対的な位置関係の設定部分のhtml 設定を調整します)
  ・第二段階: Dream Counter関係ファイルをサーバーへFTP、属性設定を設定後
    ブラウザでソース表示させたページ内のDream Counterの data/index.datを参照してカウントと
   表示をさせるリンクをマウスでクリックするとパスが合っていればカウント数値が全画面表示され
   ます。  /index.dat に対する属性が[606] なのは読出しと書込みをするためです。
    属性の(その他)で書込み設定がないとカウント表示は可能だがカウントアップしません。
   (パスが合っていない場合は第一段階と同じようにhtml 内の設定を調整します)
    
    動くようになったら check.cgi(動作確認ツール)でどんな状況になっているか結果を表示させる。
   動いてから IPアドレスのチェックを「あり」に設定する。 最初は条件のゆるいものから始めるべき。
    IPアドレス チェック「あり」にして全くカウントアップしなかったが、サーバーのパーミッション設定を
   調整してこれで動く筈でカウントアップした。(複数ページにカウンタ設定してたまたまアップ、確認方法が問題
    最初はカウンタを1つだけにして後からadmin.cgi で2番目以後のカウンタを増やすことができます。
    admin.cgi でカウンタを指定して初期カウント値設定、現在値の表示/変更ができます。
   (Image::Magick 対応)
    設定もしていないのに check.cgi でImageMagickが動作する表示が出たのでネットで設定方法を
   調べる。 さくらのレンタルサーバーのコントロールパネルから、 サイドバー「スクリプト設定」 >
   「php.ini設定」をクリックして「PHPiniファイル設定」画面を表示させる。(extension = imagick.soを追加)
   [設定画面] さくらのレンタルサーバーのコントロールパネルの画面800x276px 画面
  (参考) さくらのレンタルサーバーでImageMagickを有効化する方法 | なおやの日記
    ImageMagick使用のためのサーバー設定をして動くことを確認、init.cgi 内の$cf{image_pm} = 0; を"1
  に変更して切替える。 さすが ImageMagick という速さの表示に変わった。

 
4.Dream Counter表示用の設置
    カウンタの表示サイズ変更・非表示: htmlのimgタグでwidth、heightを指定するとブラウザ機能で
  サイズ変換ができます。(非表示でカウントしたい場合は縦横を5x5ピクセル位の小さな四角にする)
   ページ表示にして画面を再表示させた時にカウンタ指定した場所の色が変化する。
   カウンタ設置・確認: カウンタ設置したい位置のhtml 内へimgタグでDream Counterを設置。
   カウンタ表示させている場合はページを再表示して確認可、非表示設定ではブラウザでソース表示に
  して<img src="dream/dream.cgi?id=index"> のように書いた部分をマウスでクリックするとパスが正常の
  場合にカウンタ数値のGIF画像が全画面表示されて便利。(5桁以上のカウント値は桁数指定が必要
  (注) 非表示のカウントだけの設置の場合は桁数指定なしでも問題ないことが判明。(2024- 5- 1)
  <!-- counter --> <img src="dream/dream.cgi?id=index> <!-- counter -->のように書くと<!-- counter -->
  が別の色表示になって場所を見つけやすくなる。(Edge、Chrome、Firefoxでソース表示して確認)
  (新しいブラウザはimgタグ部分がアンダーバー付き表示で現在情報を表示するが古いブラウザはこの変換が行われない)
  (参考1) クロスサイト スクリプト攻撃対応でブログ記事の記述が見事にエスケープされて修正した。
     (文字列修飾では記述通り表示されるがhtmlソースの場合はエアスケープされた。(四角枠内にX表示ほか)
     (Dreamweaver CS6で作成したこのページも特殊記号に変換された文字列で構成されています)
  (参考2) カウンタ設置フォルダ名 dream/dream の前の赤字表記のdream部分は変更可能だが、
      カウンタがある部分だけでなくカウンタ設置のフォルダ名になっているのでサイト内での
      整合性が必要です。 名前変更についてはサイト運用面からも配慮が必要です。
  (注) 名前変更はHTMLエディタでサイト内を更新編集してミラーリングFTPをする必要があり、サイトを
     構成するページ数、階層数が多い時は十分に検討すべきです。(2.項 サイト構成の検討 参照)
       Dreamweaver CS6では当方の使用文字に問題があるのかサイト内更新がうまくできず更新漏れ
     が起きた。(Dream Counter内のinit.cgi 内にフォルダの初期設定値があるが連動しない模様
      後でやっても良いのではでなく、最初からやった方が手戻りやトラブルを回避できます。

 
5.セキュリティ対応ほか
   ・admin.cgiは名前が知られているので変更。(ネット検索で名前を変更していたので気付いた
   init.cgi 内の管理CGI【URLパス】、 $cf{admin_cgi} = './admin.cgi';  admin.cgi の赤字名を変更。
   ・ init.cgi の属性[604]、Dream Counter実行時に読み出せないとカウンタとして動かない。
   ・dream.cgi はカウント部分なので実行できないと意味がない。属性[705]。
   (注) 自宅でFTPソフトを動かしていればオーナーとして認識されるが、そうでない場合は普通の
      アクセスになりそう。(設定調整時と普通に動かす時の条件の認識状況が問題)
   ・サーバーのパーミッション設定をアクセスさせない 属性[700]にすると動作条件が厳しくなる。

 
6.Dream Counter設置後のカウント状況
    前のDTIサーバーのカウンタではさくらインターネット側は全くカウント表示できなかったが、さくら側
  のアクセス解析で特定ページのアクセスが多いので同じ目的のグループ間で情報交換されてアクセス
  されているような感じ。 個人でページ検索するような感じの使い方は少ない、地域の写真DBへの
  アクセスは良い写真やPC・写真処理の情報など特定ページにアクセスが集まっている。
   サイトの全ページにカウンタを設置しないとさくらのレンタルサーバのアクセスログ内(アクセス解析)
  と 同じようにカウントできないと分かった。(Webalizerの解析結果、約10,000visits/月をカウント)
  ( さくらインターネット内のページへ本格的にカウンタ設置をしていないので現在はDTI当時と同レベル。 3/26)

   北海道ショートカット集 は北海道の道路情報ページでDTIの2番目のカウンタを使用していたもので
  こちらの想定通りのカウント。 内容が特殊だが新型コロナウイルス発生後は急激に北海道をドライブ
  旅行する人数が減ってアクセスが上がらない。(自分で走らないと移動ルートの道路変化の重要性に気付き難い
   北海道内は車を使わないと移動時間が問題で長距離移動のJRの特急以外は1時間に1本の列車・
  バスがあれば良いという地域がほとんど。 最新の道路情報を集めるのは難しいので需要はあると
  思っています。
   Google検索の上位にインデックスされているページもあるので全ページにカウンタを設置してカウント
  するように設定した。(現在、DTI 側でGoogle検索にインデックスされているのでさくらインターネットへの早急な切替要

  (以上)

更新履歴 (ブラウザのボタンで戻る)

 24- 4- 2: 不適切と思われる表現を見直し。(内容的には変更なし)
 24- 3-26
: タイトル名を変更。(一部表現を変更)
 24- 3-20: 説明順序・内容を変更、(サイト構成の画面例を追加、設定・調整法の合理化)を追記。
 24- 3-17: 実運用での配慮点などを追記。
 24- 3- 7: 初版 (ブログ記事からのまとめ)

(Top)ぶらり旅行写真集