HTML數字驗證碼是一種常見的用于網站驗證用戶身份的技術。在網站表單中,使用數字驗證碼可以防止機器人或者自動化程序使用惡意方式大量提交表單,保證網站服務的穩定和安全性。下面介紹一下如何編寫HTML數字驗證碼代碼。
<html> <head> <title>HTML數字驗證碼</title> </head> <body> <h1>數字驗證碼示例</h1> <form method="post" action="submit.php"> <label for="code">驗證碼</label> <input type="text" id="code" name="code" maxlength="4" size="5" /> <img src="code.php" alt="驗證碼" /> <br /> <input type="submit" value="提交" /> </form> </body> </html>
在這段代碼中,我們首先創建了一個HTML表單,用于讓用戶輸入數字驗證碼。在表單中,我們加入了一個文本框,用于輸入驗證碼,以及一個“提交”按鈕。此外,我們還插入了一個圖片元素,用于顯示數字驗證碼。
此外,我們還需要創建一個PHP腳本,用于生成和輸出數字驗證碼圖片。下面是一個簡單的示例:
<?php session_start(); $code = ''; // 隨機生成4個數字作為驗證碼 for ($i = 0; $i < 4; $i++) { $code .= rand(0, 9); } // 將驗證碼保存到session中 $_SESSION['code'] = $code; // 創建一張包含驗證碼的圖片 $im = imagecreatetruecolor(100, 30); $bg = imagecolorallocate($im, 255, 255, 255); $textcolor = imagecolorallocate($im, 0, 0, 0); imagefilledrectangle($im, 0, 0, 100, 30, $bg); imagestring($im, 5, 20, 8, $code, $textcolor); // 輸出圖像 header('Content-type: image/png'); imagepng($im); imagedestroy($im); ?>
在這個PHP腳本中,我們首先使用sesson_start()函數開啟和session相關的操作。然后,我們使用rand()函數隨機生成4個數字,作為驗證碼。將驗證碼保存到session中,以備后續驗證時使用。
接下來,我們使用GD庫中的函數,創建一張包含驗證碼的圖片。在調用imagestring()函數時,我們將驗證碼輸出到了圖片中。
最后,我們使用header()函數設置返回類型,將生成的圖片輸出到瀏覽器。