ホームページ >ウェブフロントエンド >フロントエンドQ&A >Nodejs は画像検証コードを実装します
インターネット技術の発展に伴い、グラフィカル検証コード (CAPTCHA) は、Web サイトのログイン、登録、パスワード取得、およびユーザー ID を検証する必要があるその他の場所で広く使用されています。いくつかの質問と回答、数字、文字などをグラフィック表示してユーザーが判断できるようにすることで、ロボットによるパスワードの登録や乱暴な解読を防ぎます。この記事ではNode.jsを使った画像検証コードの実装方法を紹介します。
Node.js には、グラフィカル検証コードの生成に使用できるサードパーティ モジュールが多数あります。この記事では、svg を使用します。 -captcha
モジュール。SVG 形式で検証コード イメージを生成できます。ターミナルで次のコマンドを実行してインストールします。
npm install svg-captcha
作業環境に 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() // 其他代码
イメージ検証コードを実装するには、検証コード イメージを生成するルートを作成する必要があります。 app.js
ファイルにルート /captcha
を作成します:
app.get('/captcha', (req, res) => { const captcha = svgCaptcha.create() res.type('svg') res.status(200) res.send(captcha.data) })
このルートで、svgCaptcha.create()
関数 Generate を呼び出します。ランダムな検証コード文字列と対応する SVG 画像をクライアントに送信します。
生成された検証コードがクライアントから返された検証コードと一致するためには、生成された検証コード文字列をセッションに保存し、検証は、クライアントがフォームを送信するときに行われます。ルートに次のロジックを追加します。
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
ルートに保存し、その検証コード文字列をユーザーが送信したときの検証コード文字列と比較します。フォーム ユーザーが入力した認証コードを比較し、同じであれば認証成功と判断し、以降の処理を実行します。
上記の手順を完了したら、次のコマンドを実行してサーバーを起動します。
node app.js
次に、http にアクセスします。ブラウザ: //localhost:3000/captcha
で、生成された検証コードのイメージが表示されるはずです。ログイン フォームに確認コードを入力し、後続の操作のためにフォームを送信します。
概要
Node.js を使用して画像検証コードを実装するのは難しくなく、必要なのはサードパーティのモジュールだけです。ただし、検証コードのセキュリティを向上させるには、次の点に注意する必要があります。
以上がNodejs は画像検証コードを実装しますの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。