Movable Typeのインストール方法、Movable Type用のプラグイン、Ajaxを使ったカスタマイズ例などをご紹介しています。「あんなことできないかなぁ」、「こんなことできたらいいなぁ」を形にしていきたいですの。

Movable Type 備忘録

Ajaxでアクセス・ランキングを表示する６

Feb222008
Vote:
http://bizcaz.com/archives/2008/02/22-210347.php
Categories: prototype
Tags: prototype
Social Bookmark

Prev Page: Ajaxでアクセス・ランキングを表示する５
Next Page: Ajax でアンケートフォーム表示

[2009.03.20] 以下のページでご紹介してます最新の prototype 版ランキングスクリプトをご利用ください。

こんばんわ^^

いろいろ試すことあって Safari 3 パブリックベータをインストールしてみました。
結果から言うと、いいかんじ (●´∀｀●)

Firefox はキー操作は使いやすかったけど、表示があまりにも遅過ぎるので、テンプレートの表示確認程度でしか今は使ってません。
Opera は表示はメッチャ速いんだけど、サイトで指定するフォントが適用されなかったり（設定であるのかも、ですけど）、キー操作が Firefox に慣れてしまっていたせいか、わたしにとっては違和感があって、それも慣れれば何とかなるかな･･･と思って使ってます。

じゃぁ Safari はというと、わたしのフィーリングで (Firefox + Opera) / 2 ってかんじです。
平たく言えば、いいとこどりみたいな (;￣∇￣A

まだ思うところはチョコチョコとあるのですが、First Impression はかなりいいです。

さて、今回訪問者さんと Safari の文字化け対策についてコメントのやりとりしてしたことで、アクセスランキングのスクリプトを Safari 3 に対応しました。

変更内容

今回変更した内容を以下に記します。

ページタイトルなどの実体参照変換( JavaScript )
たとえば、ページタイトルにシングルクォーテーション( ' )やダブルクォーテーション( " )が使用されていた場合、実体参照文字に変換するようにしました。
Safari 向け文字化け対策( JavaScript )
Safari での Ajax 使用時の文字化け対策としてコード追加しました。内容については参考元をチョビッと引用します。

実際のテキストファイルがUTF-8コードだったとしても、Safari 2.0のresponseTextはISO-8859-1コードか何かと誤認識したような文字列を返してくるので文字化けしてしまう。
そこで、ブラウザを判別して Safari ではいったんescapeで%HH形式に変換する。
このとき『UTF-8コードのエスケープ状態』と同じ文字列並びになっているから、これをさらにdecodeURIComponentで展開すればUTF-8コードの文字列として取り出すことができる！via: [ajax] Safari の responseText で UTF-8 コード文字化け回避
サーバサイド側スクリプトを BOM 付きで保存( PHP )
BOM って今回初めて知ったのですが、Byte Order Mark の略語らしいです。
要するに作成したファイルの文字コード／エンディアンを明示する（ファイルに埋め込む）ものらしいです。

BOM は記述するものじゃなくって変換が必要になります。

以上です。
ランキングの使い方は今までと変わりません。スクリプトが勝手にいろいろやってくれるので気にしなくってよいです (￣∇￣)b

Trackback Pings(0)

TrackBack URL for this entry:

No trackbacks found.

Comments(27)

#1: Posted by ゆにっく @ February 22, 2008 [REPLY]: Safari 3.0いい感じですか。Macユーザーとしては何かとても嬉しい感想です SafariだけでもMacらしさを感じ取ってもらえたらええな〜と思いますでも俺は反対にFirefox 3の方が表示がきびきびしてるように思いました。

#2: Posted by bzbell @ February 22, 2008 [REPLY]

>>1 ゆにっくさん

こんにちわ^^

> でも俺は反対にFirefox 3の方が表示がきびきびしてるように思いました。

えっ!!
大丈夫でした !?
まだ不安定って聞いてたので、わたしはインストール避けてたんです。
なんせ、わたしのパソコンは家族で共有なので

#3: Posted by sinnchan @ February 22, 2008 [REPLY]: こんばんは。
私も先日、半分人柱気分で？Firefox 3ベータをＰＣにインストールしてみましたけど、動作は確かにきびきびしてますね。IEとは違って、Firefox 2との共存もできるので、お試しはやりやすいと思いますよ。
もし、その気になったらぜひお試しあれ。（但し、自己責任でお願いします。あしからず。（爆））

#4: Posted by bzbell @ February 22, 2008 [REPLY]

>>3 sinnchan さん

こんばんわ^^

> 私も先日、半分人柱気分で？Firefox 3ベータをＰＣにインストールしてみましたけど、動作は確かにきびきびしてますね。

何だか評判良さそうですね

> Firefox 2との共存もできるので、お試しはやりやすいと思いますよ。

おっ!! それはいいですね
共存可能ならお試ししてもいいかも、です。
さっそく入れてみます

#5: Posted by kura @ May 21, 2008 [REPLY]

こんにちは。

アクセスランキングを利用させていただいているのですが、
たまにログがうまく取得できていないようで困っています。
ご教授いただければ幸いです。

通常はタイトル名を表示するようにしているのですが、
なぜかリファラ？が表示されてしまうのもがあります。

ログを確認すると通常は1行に書かれているのがそこ部分だけ数行にまたがって書かれています。
それが原因でしょうか？

また、
http://www.shakkinkaiketsu.com/js/pagerank/index.php
で一覧表示ができるようにしてみてみると空白のものがあります。うまくログ取得ができていないのでしょうか？

バージョンが1番古いものを使っていたときはこのようなことはなかったのですが、今回の新しいものを使って表示されるようになりました。

お手数ですがご教授おねがいいたします。

#6: Posted by bzbell @ May 21, 2008 [REPLY]

>>5 kura さん

こんばんわ^^

ご質問の件ですが、ご連絡頂いてる現象はわたしの法でもすべて確認してます

kura さんが言われるように、1 行 1 アクセスというデータフォーマットが基本なのです。
でも、MT4 になってから <title> が改行されて出力されるようになってからこの現象を確認してます。

以下のようなかんじでテンプレートを変更してみてください。

<mt:If name="index_main">
<title><$mt:GetVar name="page_title"$></title>
<mt:Else>
<title><$mt:GetVar name="page_title"$> - <$MTBlogName encode_html="1"$></title>
</mt:If>

<title>～</title>の間を改行させないようにします。
スクリプト側で改行されたタイトルを処理できればいいのですが･･･とりあえず、テンプレート側を修正することでわたしのサイトでは改善されてます。

上記修正を行ってしばらく様子をみていただけますか
たぶんご連絡頂いた現象はすべて改善されると思いますので。

#7: Posted by kura @ May 22, 2008 [REPLY]

bzbellさん

RESをクリックしてもjavascriptがエラーになって返信できませんでしたのでこちらからご返事させていただきます。

早速のご返事ありがとうございます。
お教えいただいたように変更してしばらく様子をみてみます。
ありがとうございました。

ただ、当方はMT3.35を使用しておりますので
もしかしますとうまくいかないかもしれません。

そのときはまたご質問させていただきます。
ありがとうございました。

#8: Posted by bzbell @ May 22, 2008 [REPLY]

>>7 kura さん

こんばんわ^^

たぶん改善されると思います
だって、kura さんとこのソースを確認させてもらったのですが、title が改行されてるページが存在してましたので

どちらにしても少し様子見ですね。

#9: Posted by kura @ May 24, 2008 [REPLY]

bzbellさん

こんにちは。

お教えいただいたコードは
「Ajaxでアクセス・ランキングを表示する3」で
記載いただいていたのですね。

バージョンが4のものとあったので
見過ごしていました。
すみませんでした。

ただ、
お教えいただいたMTIFはバージョン4からしか使用できないようで
知らずに使っていたのですが、ソースを見るとタイトルが二重に表示されていました。

コードの内容は
インデックスページならそのままページタイトルを表示
そうでないならページタイトル+ブログタイトルを表示
となるようにすればよいのですね？

タグを調べてできるようがんばってみます。
ありがとうございました。

#10: Posted by bzbell @ May 24, 2008 [REPLY]

>>9 kura さん

こんにちわ^^

> となるようにすればよいのですね？

はい。そのような対応で OK です
がんばってください

#11: Posted by たかさん @ June 19, 2008 [REPLY]

はじめてコメントさせていただきます。
今回、アクセスランキングを利用させていただこうと思っております。
設置してみたのですが、取得したログを見てみると
ページタイトルの後ろに #extended#extended#extended#extended#extended というような文字列が付加されたものやされていないものが混在しています。
どうすればこの文字列が付かなくなるでしょうか？

また、ランキングの結果を表示してみると、設定は集計期間1ヶ月にしているのですが”14日間ログを集計します”というような表記になります。

どのように対処すればよいかご教示いただけますでしょうか。
よろしくお願いいたします

#12: Posted by ASG @ June 20, 2008 [REPLY]

こんにちは
もう結構古いポストなのでご返信いただけるか不安なのですが、気がつかれましたら
教えていただきたいと思います。

こちらのポストを見ながら自分のwebにアクセスランキングを組み込もうと思っているのですが、ローディングイメージがずっと表示されるだけで、ランキング表示ができません。

どのような原因が考えられるのでしょうか？
使わせていただいているサンプルはjquery版でMT4.1にて試しています。
当方では、サイト全体でSSIを使用しているため拡張子がshtmlになっています。

情報が不足しているかもしれませんが、何かわかれば、よろしくお願いいたします。

#13: Posted by bzbell @ June 21, 2008 [REPLY]

>>11 たかさんさん

こんにちわ^^
お返事が遅くなってすいません

ご質問の件ですが、#expand や #more などのように、URL の後ろに ID 名がついた URL は JavaScript 内で削除してるんです。
なので、通常なら純粋なページの URL になるのが正しくって、ましてや #expand が連続するようなことは普通ないはずです。

試しにブラウザからページ URL + #expand#expand#expand#expand というようなページ表示したところ、ログ中には連続した #expand は削除されてます。

考えられることは…
思い浮かばないのですが、たかさんさんのページを表示すると JavaScript エラーが出てます。そちらを改善されるとどうなりますか!?

#14: Posted by bzbell @ June 21, 2008 [REPLY]

>>12 ASG さん

こんにちわ^^
大変遅くなってすいません

ご質問の件ですが、考えられることは、

ランキング収集用のスクリプトのパスが間違ってる
prototype.pagerank.js 内に記述する( 33、34 行目あたり )パスは正しいですか!?
ドメインを跨って使用してる
Ajax はクロスドメインによる通信ができません。その場合には以下のページを参考に prototype.pagerank.js を修正する必要があります。

http://bizcaz.com/archives/2008/06/01-030409.php

というかんじでしょうか

#15: Posted by たかさん @ June 22, 2008 [REPLY]

>>13 bzbell さん

ありがとうございます。
URLに #expand や #more が付くのは確かにJavaScript 内で削除されているんです。
でも今回不思議なのはURLに付くのではなく、ページのタイトルの後ろに付くんです。
しかも #expand や #more が決まって5つです。
自分でアクセスして確認してみると #expand や #more が付くことはなく、なぜ付くのかの原因が特定できていません。

仕方がないので prototype.pagerank.js の
function pagerank_espace(str) 内で
str = str.replace(/#.*/,'');
を追加することで削除することができました。
う～ん、それにしてもなぜなんでしょう？？

それから別件なのですが、設定した一定間隔ごとにログはクリアされてまた一から集計されると思うのですが、これをいつ表示しても最近の一定期間分のログが集計されるようなものに変更するにはどういうふうにするのが良いでしょうか？
ちょこちょこ改造する程度ならできるのですが、こういった変更ができるまでの知識もないのでよろしくお願いいたします。

#16: Posted by bzbell @ June 22, 2008 [REPLY]

>>15 たかさんさん

> でも今回不思議なのはURLに付くのではなく、ページのタイトルの後ろに付くんです。
> しかも #expand や #more が決まって5つです。

えっ!? タイトルにですか !?
それは特定のページのみでしょうか。それともすべてにおいて!?

> これをいつ表示しても最近の一定期間分のログが集計されるようなものに変更するにはどういうふうにするのが良いでしょうか？

要するに、クリアせず収集する指定期間分を常に保持（表示）したい･･･ということですね

単刀直入にいいますと現状ではできません。

以前にも同じような質問をされたのですが、常に 7 日分を収集とするにはスクリプトを作り直す必要があるんです。

たとえば、6/1 からログ収集した場合 6/7 までは通常通りファイルに保存しますが、6/8 からは 6/1 のログは省き、6/8 のログを付け足す…といった処理が必要になるわけですね。

なので、今はそういったスクリプトを作る予定はないので、ごめんちゃいしてます。

#17: Posted by たかさん @ June 22, 2008 [REPLY]

>>16 bzbell さん

＞それは特定のページのみでしょうか。それともすべてにおいて!?

丸1日程度ログを取ってみた限りでは特定のページではなく、どんなページでも発生しているようでした。
一度ログを見ていただいたほうが良いかと思いますので、このコメントをさせていただくタイミングで元のスクリプトに戻してみました。
ログのURLは後ほどメールさせていただきます。

＞要するに、クリアせず収集する指定期間分を常に保持（表示）したい･･･ということですね

はい、そうです。
仰るとおりで、どのような仕組みにすればよいかというのはわかるのですが、実際にそう作り直すことが多分できそうにありません。
自分にできる範囲でいろいろやってみたいと思います。

#18: Posted by bzbell @ June 22, 2008 [REPLY]

>>17 たかさんさん

こんにちわ^^

ログ確認しました。
確かに #extended や #comments が連続したタイトルがありますね。

でも、該当のページをわたしの方で確認しても再現しなかったことから、もしかするとブラウザ( または OS !? )に依存するのかも、です

サーバ側( PHP スクリプト )は基本的にクライアント側( JavaScript )から渡された情報をそのままログに書き出すだけなので、明らかにクライアント側( JavaScript )で何か起こってますね

ランキングスクリプトはカウントするのが目的なので、アクセス解析に関する情報は皆無です。
そこで、たかさんさんの方でそういった情報を付加することができるようでしたら、ブラウザ、OS 情報など入れてみてはどうでしょうか

分からないことがあればお力になります

#19: Posted by たかさん @ June 22, 2008 [REPLY]

>>18 bzbell さん
こんばんは。

アクセス解析のほうは別途しておりますのでそちらを確認してみたところ、OSはWindows XP だったり Vista だったり、さらにはブラウザも IE6 や IE7 だったりしますし、同じ人と思われるアクセスでも #extended や #comments が付くページもあれば付かないページももある。
ひょっとするとウィルス対策ソフトなどの影響？などとも考えたりしましたが、簡単には調べられそうもないので先に書いたように JavaScript 側で #以降を削除するように変更しようと思います。
ありがとうございました。

#20: Posted by ASG @ June 24, 2008 [REPLY]

こんにちは
返事が大変遅くなってしまい申し訳ありません。
教えていただいた件試してみましたが、なかなかうまくいかないので
prototype版で設置を考えています。

ですが、こちらの設定どおり設置したつもりなのですが、表示したい場所に
’ Not Found
The requested URL /http://www.◎◎◎◎/common/js/pagerank/rank_view.php was not found on this server. ’
と表示されてしまいます。

ftpを覗くと該当ディレクトリにrank_view.phpは存在しているのですが見つけられないようです。
prototype.pagerank.jsの39～41行目
あたりでディレクトリがうまく指定できていない様な気がするのですが、ちょっとわからないです。
あと、rank_config.php内の

# * ページ・アクセス情報を保存するファイル名
# */
# $GLOBALS['RANK_DATA'] = 'data.txt';
# /*
# * 更新履歴情報を保存するファイル名
# */
# $GLOBALS['PERIOD_DATA'] = 'period.txt';

のテキストファイルはどのタイミングで生成されるのでしょうか？
もしかしたらこのファイルがうまくできないのも何か設定がまずいからなのでしょうか？

度々長々と質問してしまい申し訳ありません。
もしよろしければまたお答えいただければと思います。

#21: Posted by bzbell @ June 24, 2008 [REPLY]

>>20 ASG さん

こんばんわ^^

> prototype.pagerank.jsの39～41行目
> あたりでディレクトリがうまく指定できていない様な気がするのですが、ちょっとわからないです。

>>14 のことから、ASG さんの環境はサブドメイン環境ではないし、パスも正しいということですね

Ajax ローダーがクルクルしっぱなしってことは、サーバサイドの PHP スクリプトからの応答がない場合そのような現象が発生します。そうしますと、考えられることは

サーバサイドの各スクリプトのパーミッションを確認してみてください。
実行権限がないと JavaScript からサーバサイドのスクリプトを実行することができません。 ※たとえば、わたしのサイトなら 705 という権限を与えてます。
お使いのサーバ環境( PHP 環境 )による問題かもしれません。
可能であれば ASG さんが設置されたサイトの URL を教えていただけますか。そうしましたら、わたしの方でデバッグしてみます。

また、PHP ではカレントディレクトリが、WEB からアクセスしたファイル( 実行したファイル )のあるフォルダになってしまいます。
もしかすると、rank_post.php、rank_view.php 内の 2 行目を以下のように変更すると解決しちゃったりするかも、です。
```
require(dirname(__FILE__).'rank_config.php');
```

> …のテキストファイルはどのタイミングで生成されるのでしょうか？
> もしかしたらこのファイルがうまくできないのも何か設定がまずいからなのでしょうか？

ページがロードされた時に作成されます。
ファイルが作成されないのは、恐らく PHP スクリプトからの応答がない＝実行されてない、または途中でエラーしているからだと思われます。

また、ASG さんがお使いのサーバでは PHP5 がインストールされてますか!?
それとも PHP4 !?

実は PHP のバージョンによってファイルが作成されなかったりします。
厳密にはファイルの排他制御に違いがありまして、他のユーザさんもそこら辺でトラブったりします。
ご確認ください

#22: Posted by ちんぷい @ December 28, 2008 [REPLY]

はじめまして。
初めて書き込みさせていただきます。
こちらのランキングプラグインを設置してみたのですが、
文字化けが発生してしまい、上手に表示されません。
環境は
safari3・Firefox3
です。
MacユーザーのためWinは確認できません。

ページ・アクセス情報を保存するファイルに保存する時点で文字化けをしているようで
このファイルをダウンロードして開くと化けています。
その際のファイルのエンコードはjisとなっておりました。

どうすればよいでしょうか？
基本的なことをお伺いしておりましたら申し訳ありません。

#23: Posted by bzbellからちんぷいへの返信 @ December 28, 2008 [REPLY]

>>22 ちんぷいさん

こんにちわ^^

> その際のファイルのエンコードはjisとなっておりました。