HTML
 Computer >> コンピューター >  >> プログラミング >> HTML

HTMLのnavigator.cookieEnabledプロパティとは?使い方とサンプルコードを解説

HTMLの navigator.cookieEnabled プロパティは、ブラウザでCookieが有効になっているかどうかを示す真偽値(boolean)を返します。戻り値が true の場合はCookieが有効、false の場合は無効であることを意味します。

構文

基本的な構文は以下のとおりです。

navigator.cookieEnabled

実装例

ここでは、ボタンをクリックすると現在のブラウザでCookieが有効かどうかを表示する簡単なデモを紹介します。

<!DOCTYPE html>
<html>
<style>
    body {
        color: #000;
        height: 100vh;
        background: linear-gradient(62deg, #FBAB7E 0%, #F7CE68 100%) no-repeat;
        text-align: center;
    }
    .btn {
        background: #db133a;
        border: none;
        height: 2rem;
        border-radius: 20px;
        width: 330px;
        display: block;
        color: #fff;
        outline: none;
        cursor: pointer;
        margin: 1rem auto;
    }
    .show {
        font-size: 1.5rem;
        color: #fff;
    }
</style>
<body>
<h1>HTML navigator cookieEnabledプロパティ デモ</h1>
<button class="btn" onclick="display()">ブラウザのCookie情報を表示</button>
<div class="show"></div>
<script>
    function display() {
        document.querySelector(".show").innerHTML = "<p>ブラウザのCookieは有効ですか?</p>" + "<p>" + navigator.cookieEnabled + "</p>";
    }
</script>
</body>
</html>

実行結果

ページ上の「ブラウザのCookie情報を表示」ボタンをクリックすると、ブラウザでCookieが有効になっているかどうかが画面に表示されます。

補足ポイント

  • navigator.cookieEnabled はすべての主要なモダンブラウザ(Chrome、Firefox、Safari、Edgeなど)でサポートされています。
  • ユーザーがブラウザ設定やプライバシー拡張機能によってCookieを無効化している場合、このプロパティは false を返します。
  • ログイン状態の維持やカート機能など、Cookieに依存する機能を実装する前に、このプロパティを使って事前チェックを行うとユーザー体験の向上につながります。
  1. HTMLのnavigator.platformプロパティとは?使い方とサンプルコードを解説

    HTMLのnavigator.platformプロパティは、ブラウザがコンパイルされた(動作している)プラットフォームの情報を文字列として返します。このプロパティを利用することで、JavaScriptからユーザーのOS環境に関する情報を取得できます。 構文 navigator.platformプロパティの構文は以下の通りです。 navigator.platform 戻り値 このプロパティは、プラットフォーム名を表す文字列を返します。主な戻り値の例は以下の通りです。 Windows環境:「Win32」 Mac環境:「MacIntel」 Linux環境:「Linux x86_64」など HTM

  2. HTMLのnavigator.onLineプロパティでブラウザのオンライン・オフライン状態を判定する方法

    navigator.onLineプロパティは、ブラウザが現在オンライン状態かオフライン状態かを示す真偽値(boolean)を返します。このプロパティを活用すれば、ユーザーのネットワーク接続状況をJavaScriptで簡単に検出し、それに応じた処理を実装することができます。 構文 基本的な構文は以下のとおりです。 navigator.onLine 戻り値は次のようになります。 オンラインの場合:true オフラインの場合:false サンプルコード ここでは、HTMLのnavigator onLineプロパティを使用した具体的な例を紹介します。ボタンをクリックすると、ブラウザがオンラインかオ