HTML - keygen 標籤

HTML <keygen> 標籤用於處理帶有證書管理系統的 Web 表單。該元素生成一個安全金鑰並提交公鑰。

使用 keygen 的主要目的是對使用者進行身份驗證，使用公鑰生成客戶端證書。提交表單時會生成私鑰和公鑰。公鑰傳輸到伺服器，私鑰保留在本地。

此標籤不再推薦，因為它在 HTML5 中已棄用。

語法

<keygen name = "name">

屬性

HTML keygen 標籤支援 HTML 的全域性和事件屬性。也接受一些特定的屬性，如下所示。

屬性	值	描述
autofocus	autofocus	指定頁面載入時 <keygen> 元素自動獲得焦點。
challenge	challenge	指定要與 PublicKeyAndChallenge 中的公鑰一起打包的挑戰字串，用於驗證表單提交。如果沒有提供挑戰字串，則將其編碼為長度為零的 IA5STRING。
disabled	disabled	指定 <keygen> 元素應被停用。
form	form_id	指定一個或多個表單。
keytype	rsa dsa ec	指定金鑰的秘密演算法。
name	autofocus	指定名稱。

HTML keygen 標籤示例

下面的例子將說明 keygen 標籤的使用。在哪裡、何時以及如何使用 keygen 標籤來對使用者進行身份驗證。

建立 Keygen 輸入元素

讓我們來看下面的例子，我們將使用 keygen 標籤。

<!DOCTYPE html>
<html>

   <head>
      <title>HTML keygen Tag</title>
   </head>

   <body>
      <form>
         <keygen name = "random_key" challenge = "0987654321">
         <input name = "firstname" value = "first name">
      </form>
   </body>

</html>

在整個表單中使用 Keygen

讓我們來看下面的例子，我們將 keygen 標籤用於登錄檔單。

<!DOCTYPE html>
<html>

<head>
    <title>HTML Form</title>
    <style>
        body {
            display: flex;
            justify-content: center;
            align-items: center;
            height: 100vh;
            background-color: #f0f0f0;
        }

        form {
            width: 600px;
            background-color: #fff;
            padding: 20px;
            border-radius: 8px;
            box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
        }

        fieldset {
            border: 1px solid black;
            padding: 10px;
            margin: 0;
        }

        legend {
            font-weight: bold;
            margin-bottom: 10px;
        }

        label {
            display: block;
            margin-bottom: 5px;
        }

        input[type="text"],
        input[type="email"],
        input[type="password"],
        textarea {
            width: calc(100% - 20px);
            padding: 8px;
            margin-bottom: 10px;
            box-sizing: border-box;
            border: 1px solid #ccc;
            border-radius: 4px;
        }

        input[type="submit"] {
            padding: 10px 20px;
            margin-left: 475px;
            border-radius: 5px;
            cursor: pointer;
            background-color: #04af2f;
        }
    </style>
</head>

<body>
    <form>
        <fieldset>
            <legend>
                Registration Form
            </legend>
            <keygen name="firstName" challenge="123">
            <label>First Name</label>
            <input type="text" name="FirstName" />
            <label>Last Name</label>
            <keygen name="lastName" challenge="456">
            <input type="text" name="LastName" />
            <label>Email id</label>
            <keygen name="emailid" challenge="789">
            <input type="email" name="email" />
            <label>Enter your password</label>
            <input type="password" name="password" />
            <label>Confirm your password</label>
            <input type="password" name="confirmPass" />
            <label>Address</label>
            <textarea name="address"></textarea>
            <input type="submit" value="Submit" />
        </fieldset>
    </form>
</body>

</html>

支援的瀏覽器

標籤
keygen	是	是	是	是	是

html_tags_reference.htm

列印頁面