プロが教える店舗&オフィスのセキュリティ対策術

学校の課題でリンク先へのページの訪問回数、前回訪問日時をlocalstorageを使ってリンク元のページで表示させたいのですが、どのようにソースを組めばいいのでしょうか?


localStorage.getItem("userCount");
localStorage.getItem("userDate");

などを使ってそのページでの表示は作れるのですが課題の様に他のページで保存された情報を引用する方法がわかりません。

簡易的にでいいので具体例を含めて教えて頂けませんか?

A 回答 (1件)

こんにちは


課題とのことなので、ヒントのみですが・・・

「リンク先へのページの訪問回数、前回訪問日時」はリンク元のページを辿った場合をカウントするのか、それとも別のルートを辿った場合も含めてカウントするかによって考え方が変わりますね。

前者であれば、リンク元のページで完結することが可能で、そのページ内でリンクがクリックされたら、時間や回数をカウントするようにしておけばよいことはわかりますよね。
一つのページ内で(複数の)リンクがクリックされるのを監視するには、以下のような方法で可能です。
document.addEventListener("click", function(evt){
 var t = evt.target;
 if(t.nodeName == "A"){
  //リンクがクリックされた場合の処理
  alert("Clicked! href=" + t.href);
 }
}, false);

後者の場合は、記録を保存するのはそれぞれのページで行い、表示は「元ページ」ということになりますね。
こちらの場合は、各ページに保存を行うスクリプトが必要になりますので、スクリプトを外部ファイル化しておいて、各ページで読み込むような方法が考えられます。
読み出すのが固定のページであるなら、その部分は上の外部ファイルとは別に作成しておくのがよいでしょう。

いずれの場合でも、(複数あると思われる)ページを区別できるように、ページ毎の符号や番号を設けておいて、訪問回数などを区別できるようにしておく必要がありますね。


>他のページで保存された情報を引用する方法がわかりません
Web Storageは同一ドメイン内では共通して利用が可能なようです。
https://developer.mozilla.org/en-US/docs/Web/API …

例えば以下のスクリプトは、記録されている内容をコンソール出力するものですので、ディレクトリを変えて試してみてください。
(ただしhttpアクセス時です。ローカルでfileアクセスなどする場合は同一ディレクトリのみのようです(未検証))
var ls = localStorage;
for(var key in ls){
 if (ls.hasOwnProperty(key)) console.log(key + " / " + ls[key]);
}


ところで、『訪問回数』と一口に言っても、考え方はいろいろあると思います。
 1)ページを表示すればカウントする
 2)1回/日を限度としてカウントする
 3)最後の表示から一定時間経過していたらカウントする
などなど。
なぜこのようなことを考えるかというと、1)のような方法だと、リロードしたりページ間を行き来するだけでカウントが増加してしまうので、本当に『訪問回数』を数えていることになるのだろうかという疑問があるからです。

まとまりがありませんが、考える上でのヒントになれば・・・
    • good
    • 0

お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!