HTML、CSS、JavaScript のみを使用してページをパスワード保護するにはどうすればよいですか?

パスワード保護は、機密情報が含まれる Web ページや、アクセスに認証が必要な Web ページにとって重要なセキュリティ対策です。サーバー側の言語を使用せずに Web ページのセキュリティをさらに強化したい場合は、HTML、CSS、JavaScript を使用してページをパスワードで保護できます。

この記事では、保護されたページのコンテンツを表示するためにユーザーにパスワードの入力を要求する簡単なフォームを作成する方法を説明します。パスワードを使用してページを保護する方法をよりよく理解するために、次の例を見てみましょう。

以下の例では、スクリプトを実行して Web ページを保護しています。ユーザーが Web ページにアクセスしようとすると、パスワードの入力を求められます。

スクリプトが実行されると、パスワードを要求するアラートを示す出力が生成されます。ユーザーがパスワード (「チュートリアル」) と一致するとメッセージが表示され、一致しない場合は Web ページに間違ったパスワードが表示されます。

Web ページとボタンのクリックを保護するためにパスワードを入力するための入力フィールドを作成する次の例を考えてみましょう。

上記のスクリプトを実行すると、出力ウィンドウがポップアップ表示され、パスワードを入力するための入力フィールドと Web ページ上のクリック ボタンが表示されます。ユーザーがパスワード (12345) と一致すると、テキストで構成されるフォームが開きますが、一致しない場合は、間違ったパスワードが表示されます。

次の例を実行します。ここでは、スクリプトの実行後に Web ページのコンテンツが表示されないように保護するスクリプトを実行します。

スクリプトが実行されると、パスワードを入力するための入力フィールドと Web ページ上の切り替えチェックボックスを示す出力が生成されます。ユーザーがパスワード (54) と一致し、チェックボックスを切り替えると、Web ページ内のコンテンツが表示されます。

以上がHTML、CSS、JavaScript のみを使用してページをパスワード保護するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。