nodejs實作圖片驗證碼

隨著網路科技的發展，圖形驗證碼（CAPTCHA）被廣泛應用在網站的登入、註冊、找回密碼等需要驗證使用者身分的地方。它透過圖形方式展示一些問答、數字、字母等讓使用者來判斷，達到防止機器人註冊、暴力破解密碼的目的。本篇文章將介紹如何用 Node.js 實作圖片驗證碼。

1. 安裝依賴

Node.js 中有許多第三方模組可以用來產生圖形驗證碼，本文將使用svg-captcha 模組，它可以產生SVG 格式的驗證碼圖片。在終端機中執行以下命令安裝它：

npm install svg-captcha

2. 建立基本的專案結構

#在工作目錄下建立一個app.js 檔案和public 資料夾，public 資料夾用來存放驗證碼圖片。以下是目錄結構：

- app.js
- public
    - captcha.svg

在app.js 檔案中，引入svg-captcha 模組並建立Express 實例：

const express = require('express')
const svgCaptcha = require('svg-captcha')

const app = express()

// 其他代码

3. 建立路由

為了實作圖片驗證碼，需要建立一個路由來產生驗證碼圖片。在app.js 檔案中建立一個路由/captcha：

app.get('/captcha', (req, res) => {
  const captcha = svgCaptcha.create()
  res.type('svg')
  res.status(200)
  res.send(captcha.data)
})

在這個路由中，呼叫svgCaptcha.create() 函數可以產生一個隨機的驗證碼字串和對應的SVG 圖片，然後將其傳送給客戶端。

4. 新增邏輯

為了使產生的驗證碼與客戶端傳回的驗證碼相匹配，需要將產生的驗證碼字串儲存在會話中，並在客戶端提交表單時進行驗證。在路由中加入以下邏輯：

app.get('/captcha', (req, res) => {
  const captcha = svgCaptcha.create()
  req.session.captcha = captcha.text
  res.type('svg')
  res.status(200)
  res.send(captcha.data)
})

app.post('/login', (req, res) => {
  const { username, password, captcha } = req.body
  const expectedCaptcha = req.session.captcha
  if (expectedCaptcha === captcha) {
    // 验证码正确，进行登录操作
  } else {
    // 验证码错误，返回错误提示
  }
})

在/captcha 路由中將產生的驗證碼字串儲存在會話中，然後在使用者提交表單時將該驗證碼字串與使用者輸入的驗證碼進行比對，如果相同則判斷驗證成功，進行後續操作。

5. 啟動伺服器

完成上述步驟後，執行下列指令來啟動伺服器：

node app.js

然後在瀏覽器中存取http: //localhost:3000/captcha，應該可以看到產生的驗證碼圖片。在登入表單中輸入驗證碼並提交表單，可以進行後續操作。

總結

使用 Node.js 實作圖片驗證碼並不難，只需要一個第三方模組即可完成。但是，為了提高驗證碼的安全性，需要注意以下幾點：

1. 產生的驗證碼字串應該足夠複雜，盡量包含大小寫字母、數字和特殊字元。
2. 應該限制驗證碼的有效期，一般 5 分鐘左右即可，以防止驗證碼被攻擊者保存後在有效期內不斷嘗試。
3. 驗證碼應該隨機生成，避免預測和複製。
4. 應該使用會話來保存驗證碼字串，不要將驗證碼直接儲存在客戶端或服務端快取中。

以上是nodejs實作圖片驗證碼的詳細內容。更多資訊請關注PHP中文網其他相關文章！