ホームページ > ウェブフロントエンド > jsチュートリアル > JavaScript インジェクション攻撃を検出および防止するための高度なテクニック

JavaScript インジェクション攻撃を検出および防止するための高度なテクニック

WBOY
リリース: 2024-07-18 17:33:22
オリジナル
292 人が閲覧しました

Advanced Techniques for Detecting and Preventing JavaScript Injection Attacks

導入:

JavaScript インジェクション攻撃は、Web アプリケーションに対する重大なセキュリティ脅威です。これらの攻撃は、データ侵害、不正な操作、その他のさまざまなセキュリティ問題を引き起こす可能性があります。 JavaScript インジェクション攻撃を検出して防止するための高度なテクニックについて説明します。このブログには、これらの手法を効果的に理解して実装するのに役立つ実際のサンプル コードが含まれています。

JavaScript インジェクションとは何ですか?

JavaScript インジェクションは、攻撃者が Web アプリケーションに悪意のあるコードを挿入できる場合に発生します。これは、入力フィールド、URL パラメーター、さらには Cookie などのさまざまな手段を通じて発生する可能性があります。悪意のあるコードが挿入されると、Web アプリケーションのコンテキスト内で実行される可能性があり、データの盗難、不正なアクション、その他の有害な結果につながる可能性があります。

JavaScript インジェクション攻撃の一般的なタイプ:

1.クロスサイト スクリプティング (XSS): 他のユーザーが閲覧している Web ページに悪意のあるスクリプトを挿入します。
2. DOM ベースの XSS: DOM 環境を操作して悪意のある JavaScript を実行します。
3. SQL インジェクション: データベース上で任意のクエリを実行できる SQL コマンドを挿入します。

JavaScript インジェクション攻撃の検出:

1. 入力の検証:

  • クライアント側とサーバー側の両方ですべてのユーザー入力を検証します。
  • 正規表現を使用して、入力が期待される形式を満たしていることを確認します。
function validateInput(input) {
    const regex = /^[a-zA-Z0-9_]*$/; // Example regex for alphanumeric and underscore
    return regex.test(input);
}

const userInput = document.getElementById('user-input').value;
if (!validateInput(userInput)) {
    alert('Invalid input');
}
ログイン後にコピー

2. コンテンツ セキュリティ ポリシー (CSP):

CSP を実装して、JavaScript をロードして実行できるソースを制御します。

<meta http-equiv="Content-Security-Policy" content="default-src 'self'; script-src 'self'">
ログイン後にコピー

3.ユーザー入力のエスケープ:

悪意のあるスクリプトの実行を防ぐために、すべてのユーザー入力をエスケープします。

function escapeHTML(input) {
    const div = document.createElement('div');
    div.appendChild(document.createTextNode(input));
    return div.innerHTML;
}

const safeInput = escapeHTML(userInput);
document.getElementById('output').innerHTML = safeInput;
ログイン後にコピー

JavaScript インジェクション攻撃の防止:

1. 準備済みステートメントを使用します。

SQL クエリの場合は、プリペアド ステートメントを使用して SQL インジェクションを回避します。

const query = 'SELECT * FROM users WHERE username = ?';
db.execute(query, [username], (err, results) => {
    // Handle results
});

ログイン後にコピー

2. ユーザー入力をサニタイズします。

DOMPurify などのライブラリを使用して HTML をサニタイズし、XSS 攻撃を防ぎます。

const cleanInput = DOMPurify.sanitize(userInput);
document.getElementById('output').innerHTML = cleanInput;

ログイン後にコピー

HTTP のみの Cookie:

JavaScript 経由の Cookie へのアクセスを防ぐには、HTTP のみの Cookie を使用します。

document.cookie = "sessionId=abc123; HttpOnly";
ログイン後にコピー

4. JavaScript の機能を制限する:

サブリソース整合性 (SRI) などの機能を使用して、信頼されたスクリプトのみが実行されるようにします。

<script src="https://example.com/script.js" integrity="sha384-oqVuAfXRKap7fdgcCY5uykM6+R9GqQ8K/uxAuNS8mFLdtfiP4uH90+U8IsrK4QR" crossorigin="anonymous"></script>

ログイン後にコピー

例:

JavaScript インジェクションの影響を受けやすい単純なログイン フォームを考えてみましょう。それを保護する方法は次のとおりです:

HTML:

<form id="login-form" method="POST" action="/login">
    <label for="username">Username:</label>
    <input type="text" id="username" name="username" required>
    <label for="password">Password:</label>
    <input type="password" id="password" name="password" required>
    <button type="submit">Login</button>
</form>

ログイン後にコピー

JavaScript:

document.getElementById('login-form').addEventListener('submit', function(event) {
    const username = document.getElementById('username').value;
    const password = document.getElementById('password').value;

    if (!validateInput(username) || !validateInput(password)) {
        alert('Invalid input');
        event.preventDefault();
    }
});

function validateInput(input) {
    const regex = /^[a-zA-Z0-9_]*$/;
    return regex.test(input);
}
ログイン後にコピー

サーバー側 (Node.js の例):

const express = require('express');
const app = express();
const bodyParser = require('body-parser');
const mysql = require('mysql');

const db = mysql.createConnection({
    host: 'localhost',
    user: 'root',
    password: '',
    database: 'test'
});

app.use(bodyParser.urlencoded({ extended: true }));

app.post('/login', (req, res) => {
    const username = req.body.username;
    const password = req.body.password;

    const query = 'SELECT * FROM users WHERE username = ? AND password = ?';
    db.execute(query, [username, password], (err, results) => {
        if (err) throw err;
        if (results.length > 0) {
            res.send('Login successful');
        } else {
            res.send('Invalid credentials');
        }
    });
});

app.listen(3000, () => {
    console.log('Server is running on port 3000');
});

ログイン後にコピー

結論:

JavaScript インジェクション攻撃の検出と防止は、Web アプリケーションのセキュリティを維持するために重要です。このブログで説明した手法を実装すると、このような攻撃のリスクを大幅に軽減できます。すべてのユーザー入力を検証してサニタイズし、CSP、HTTP のみの Cookie を使用し、SRI を使用して JavaScript 機能を制限することを忘れないでください。

高度な JavaScript トピックと Web セキュリティに関するさらなるブログにご期待ください。以下のコメント欄であなたの考えや経験を自由に共有してください。一緒に、より安全な Web アプリケーションを構築できます!

以上がJavaScript インジェクション攻撃を検出および防止するための高度なテクニックの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

ソース:dev.to
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート