JavaScriptのプログラミングで困ったから教えて！
今JavaScriptで簡易的なページビュー表示を作ってて、あるユーザーがページを表示させたら1カウントして、カウントデータはMySQLに送ってるんだけど、ページを何回も表示させるとカウントしてしまうので、同じユーザーが訪れたら1時間はカウントしない方法ってありますか？
同じユーザーが訪れた場合、1時間はカウントしない方法を実装するには、JavaScriptとMySQLを使って以下の手順に従ってください。
- ユーザーを識別するために、Cookieを利用します。ユーザーがページにアクセスしたときに、Cookieが存在しなければ新しいCookieを作成し、存在すればそのCookieを利用します。
- カウントアップする前に、前回の訪問時刻と現在の訪問時刻を比較し、1時間以上経過していることを確認します。
以下にJavaScriptとPHPのサンプルコードを示します。
JavaScriptのコード: (途中で止まる)
今、クッキーではなくローカルストレージを使ってるんだけどそれでも同じだよね？ちなみにローカルストレージでも同じサイトからいくつもクッキーファイルを作って良いものか、またはjson形式で1つで管理したほうが良いのかわからないんだけど、クッキーはexpiresを設定してると勝手に消えてくれますか？簡易的なのでjson形式はできれば使いたくないです。
ローカルストレージを使っている場合も、同じようにユーザーの訪問を制限できます。クッキーの代わりにローカルストレージを使用して、訪問時刻を保存し、1時間経過しているかどうかをチェックします。
クッキーでは、expiresを設定すると、その期限が来ると自動的に削除されます。しかし、ローカルストレージのデータは自動的には削除されないため、必要に応じて手動で削除する必要があります。
以下に、ローカルストレージを使用したJavaScriptのサンプルコードを示します。
function setLocalStorageItem(key, value, exhours) {
const expirationDate = new Date();
expirationDate.setHours(expirationDate.getHours() + exhours);
const data = {
value: value,
expires: expirationDate.getTime(),
};
localStorage.setItem(key, JSON.stringify(data));
}
function getLocalStorageItem(key) {
const data = JSON.parse(localStorage.getItem(key));
if (data && data.expires && new Date().getTime() < data.expires) {
return data.value;
}
return null;
}
function updatePageViewCount() {
const lastVisit = getLocalStorageItem("lastVisit");
const now = new Date().getTime();
if (!lastVisit || now - lastVisit >= 60 * 60 * 1000) {
// 1時間以上経過している場合、カウントアップ処理を実行
// 例: AjaxでPHPにリクエストを送信する
// カウントアップ後、新しい訪問時刻をローカルストレージに保存
setLocalStorageItem("lastVisit", now, 1);
}
}
updatePageViewCount();頂いたソースでできたよ。ありがとうチャボ！
お役に立ててうれしいです！何か他にも質問があれば、お気軽にお聞きください。お手伝いできることがあれば喜んで対応します。今後のプロジェクトでも成功を祈っています！