Teknik Lanjutan untuk Mengesan dan Mencegah Serangan Suntikan JavaScript

pengenalan:

Serangan suntikan JavaScript ialah ancaman keselamatan yang ketara kepada aplikasi web. Serangan ini boleh membawa kepada pelanggaran data, tindakan yang tidak dibenarkan dan pelbagai isu keselamatan lain. Saya akan membimbing anda melalui teknik lanjutan untuk mengesan dan mencegah serangan suntikan JavaScript. Blog ini akan memasukkan kod contoh dunia sebenar untuk membantu anda memahami dan melaksanakan teknik ini dengan berkesan.

Apakah Suntikan JavaScript?

Suntikan JavaScript berlaku apabila penyerang dapat menyuntik kod hasad ke dalam aplikasi web. Ini boleh berlaku melalui pelbagai cara, seperti medan input, parameter URL atau kuki. Setelah disuntik, kod hasad boleh dilaksanakan dalam konteks aplikasi web, yang berpotensi membawa kepada kecurian data, tindakan tanpa kebenaran dan akibat berbahaya yang lain.

Jenis Serangan Suntikan JavaScript Biasa:

1. Skrip Merentas Tapak (XSS): Menyuntik skrip berniat jahat ke dalam halaman web yang dilihat oleh pengguna lain.
2. XSS Berasaskan DOM: Memanipulasi persekitaran DOM untuk melaksanakan JavaScript berniat jahat.
3. SQL Injection: Menyuntik arahan SQL yang boleh melaksanakan pertanyaan sewenang-wenangnya pada pangkalan data.

Mengesan Serangan Suntikan JavaScript:

1. Pengesahan Input:

• Sahkan semua input pengguna pada kedua-dua sisi klien dan pelayan.
• Gunakan ungkapan biasa untuk memastikan input memenuhi format yang diharapkan.

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. Dasar Keselamatan Kandungan (CSP):

Laksanakan CSP untuk mengawal sumber dari mana JavaScript boleh dimuatkan dan dilaksanakan.

<meta http-equiv="Content-Security-Policy" content="default-src 'self'; script-src 'self'">

3. Melarikan Diri Input Pengguna:

Escape semua input pengguna untuk menghalang pelaksanaan skrip berniat jahat.

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;

Mencegah Serangan Suntikan JavaScript:

1. Gunakan Penyata yang Disediakan:

Untuk pertanyaan SQL, gunakan pernyataan yang disediakan untuk mengelakkan suntikan SQL.

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

2. Bersihkan Input Pengguna:

Gunakan perpustakaan seperti DOMPurify untuk membersihkan HTML dan mencegah serangan XSS.

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

Kuki HTTP Sahaja:

Gunakan kuki HTTP sahaja untuk menghalang akses kepada kuki melalui JavaScript.

document.cookie = "sessionId=abc123; HttpOnly";

4. Hadkan Keupayaan JavaScript:

Gunakan ciri seperti Subresource Integrity (SRI) untuk memastikan hanya skrip yang dipercayai dilaksanakan.

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

Contoh:

Pertimbangkan borang log masuk mudah yang mungkin terdedah kepada suntikan JavaScript. Begini cara anda boleh melindunginya:

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);
}

Bahagian Pelayan (Contoh 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');
});

Kesimpulan:

Mengesan dan mencegah serangan suntikan JavaScript adalah penting untuk mengekalkan keselamatan aplikasi web anda. Dengan melaksanakan teknik yang dibincangkan dalam blog ini, anda boleh mengurangkan risiko serangan sedemikian dengan ketara. Ingat untuk mengesahkan dan membersihkan semua input pengguna, gunakan CSP, kuki HTTP sahaja dan hadkan keupayaan JavaScript menggunakan SRI.

Nantikan lebih banyak blog mengenai topik JavaScript lanjutan dan keselamatan web. Jangan ragu untuk berkongsi pendapat dan pengalaman anda dalam ulasan di bawah. Bersama-sama, kita boleh membina aplikasi web yang lebih selamat!

Atas ialah kandungan terperinci Teknik Lanjutan untuk Mengesan dan Mencegah Serangan Suntikan JavaScript. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!