使用 javascript 創建驗證碼：創建畫布并生成隨機字符串；繪制扭曲的文本；添加雜色和扭曲以增加難度；輸出驗證碼。
如何使用 JavaScript 創建驗證碼
驗證碼是扭曲的字母或數字，用于驗證用戶的身份并防止機器人訪問網站。下面是使用 JavaScript 創建驗證碼的步驟：
1. 創建畫布
首先，你需要創建一個畫布元素，它將用于顯示驗證碼。
const canvas = document.createElement("canvas");
canvas.width = 100;
canvas.height = 50;
const ctx = canvas.getContext("2d");
登錄后復制
2. 生成隨機字符串
接下來，你需要生成一個包含隨機字母和數字的字符串。
function generateString(length) {
const chars = "ABCDEFGHIJKLMNOPQRSTUVWXYZ1234567890";
let result = "";
for (let i = 0; i <p><strong>3. 繪制文本</strong></p><p>使用生成的字符串，你可以使用 fillText() 方法將其繪制到畫布上。</p><pre class="brush:php;toolbar:false">const text = generateString(6);
ctx.font = "bold 16px Arial";
ctx.fillText(text, 10, 25);
登錄后復制
4. 添加雜色和扭曲
為了使驗證碼更難破解，你可以添加雜色和扭曲。
// 添加雜色
for (let i = 0; i <p><strong>5. 輸出驗證碼</strong></p><p>最后，使用 toDataURL() 方法將畫布的內容轉換為 base64 編碼的字符串，并將其作為驗證碼輸出。</p><pre class="brush:php;toolbar:false">const captcha = canvas.toDataURL("image/png");
登錄后復制
至此，你就使用 JavaScript 創建了一個驗證碼。你可以將其嵌入到你的網站中，以驗證用戶的身份。
