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 を使用して画像検証コードを実装するのは難しくなく、必要なのはサードパーティのモジュールだけです。ただし、検証コードのセキュリティを向上させるには、次の点に注意する必要があります。
- 生成される検証コード文字列は十分に複雑であり、大文字と小文字が含まれるようにする必要があります。数字と特殊文字。
- 攻撃者が検証コードを保存し、有効期間中に継続的に試行することを防ぐために、検証コードの有効期間は通常約 5 分に制限する必要があります。
- 検証コードは、予測やコピーを避けるためにランダムに生成される必要があります。
- セッションは検証コード文字列を保存するために使用する必要があり、検証コードはクライアントまたはサーバーのキャッシュに直接保存しないでください。
以上がNodejs は画像検証コードを実装しますの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

ホットAIツール

Undresser.AI Undress
リアルなヌード写真を作成する AI 搭載アプリ

AI Clothes Remover
写真から衣服を削除するオンライン AI ツール。

Undress AI Tool
脱衣画像を無料で

Clothoff.io
AI衣類リムーバー

AI Hentai Generator
AIヘンタイを無料で生成します。

人気の記事

ホットツール

メモ帳++7.3.1
使いやすく無料のコードエディター

SublimeText3 中国語版
中国語版、とても使いやすい

ゼンドスタジオ 13.0.1
強力な PHP 統合開発環境

ドリームウィーバー CS6
ビジュアル Web 開発ツール

SublimeText3 Mac版
神レベルのコード編集ソフト(SublimeText3)

ホットトピック









この記事では、functionコンポーネントでのデータフェッチやDOM操作などの副作用を管理するためのフックであるReactの使用Effectについて説明します。メモリリークなどの問題を防ぐための使用、一般的な副作用、およびクリーンアップについて説明します。

怠zyな読み込みは、必要になるまでコンテンツの読み込みを遅延させ、初期負荷時間とサーバーの負荷を削減することにより、Webパフォーマンスとユーザーエクスペリエンスを改善します。

JavaScriptの高次関数は、抽象化、共通パターン、および最適化技術を通じて、コードの簡潔さ、再利用性、モジュール性、およびパフォーマンスを強化します。

この記事では、JavaScriptのカレーについて説明します。これは、マルチアーグメント関数を単一argument関数シーケンスに変換する手法です。 Curryingの実装、部分的なアプリケーションなどの利点、実用的な用途、コード読み取りの強化を調査します

この記事では、Virtual DOMツリーを比較してDOMを効率的に更新するReactの調整アルゴリズムについて説明します。パフォーマンスの利点、最適化技術、ユーザーエクスペリエンスへの影響について説明します。

記事では、Connect()、MapStateToprops、MapDispatchToprops、およびパフォーマンスへの影響を説明するReduxストアに反応コンポーネントをReduxストアに接続します。

この記事では、ReactのUseContextを説明しています。これにより、小道具掘削を避けることで国家管理を簡素化します。再レンダーの削減により、集中状態やパフォーマンスの改善などの利点について説明します。

記事では、PreventDefault()メソッドを使用して、イベントハンドラーのデフォルト動作の防止、ユーザーエクスペリエンスの強化などの利点、およびアクセシビリティの懸念などの潜在的な問題について説明します。
