Κοινή χρήση τεχνολογίας

Ερώτηση διεπαφής συνέντευξης 50 (Ποια κοινά μέτρα ασφαλείας front-end μπορούν να αποτρέψουν επιθέσεις CSRF;)

2024-07-12

한어Русский языкEnglishFrançaisIndonesianSanskrit日本語DeutschPortuguêsΕλληνικάespañolItalianoSuomalainenLatina

Εισαγάγετε την περιγραφή της εικόνας εδώ
Προκειμένου να αποφευχθούν επιθέσεις πλαστογράφησης αιτημάτων διασταυρούμενης τοποθεσίας (CSRF), μπορούν να ληφθούν τα ακόλουθα κοινά μέτρα ασφαλείας κατά την ανάπτυξη του front-end:

1. Χρησιμοποιήστε το CSRF Token

Αυτός είναι ένας από τους πιο συχνά χρησιμοποιούμενους αμυντικούς μηχανισμούς.

  • Δημιουργία διακριτικού: Αφού συνδεθεί ο χρήστης, ο διακομιστής δημιουργεί ένα τυχαίο, απρόβλεπτο διακριτικό CSRF και το αποθηκεύει στην πλευρά του διακομιστή. Ταυτόχρονα, αποστέλλεται στον πελάτη μέσω της κεφαλίδας Set-Cookie και αποθηκεύεται στο Cookie του χρήστη.

  • Ενσωματωμένο διακριτικό φόρμας: Σε κάθε φόρμα HTML που χρειάζεται προστασία, προσθέστε ένα κρυφό πεδίο (<input type="hidden">), η τιμή του ορίζεται στο CSRF Token που διαβάζεται από το cookie.

  • VerifyToken : Όταν υποβληθεί η φόρμα, το backend θα λάβει τα δεδομένα της φόρμας και το Token στο cookie (λόγω της πολιτικής ίδιας προέλευσης, το πρόγραμμα περιήγησης θα στείλει αυτόματα το cookie). Η πλευρά του διακομιστή επαληθεύει εάν το Token στη φόρμα είναι συνεπές με το Token που είναι αποθηκευμένο στην πλευρά του διακομιστή ή στην περίοδο λειτουργίας. Εάν είναι ασυνεπείς, το αίτημα απορρίπτεται.

2. Επαληθεύστε το HTTP Referer and Origin Header

Αν και δεν είναι απολύτως αξιόπιστο επειδή το Referer and Origin μπορεί να παραβιαστεί ή να λείπει, μπορεί να χρησιμοποιηθεί ως βοηθητικό μέσο σε ορισμένα σενάρια.

  • Ελέγξτε το Referer : Επαληθεύστε το πεδίο Referer στην κεφαλίδα αιτήματος HTTP για να βεβαιωθείτε ότι το αίτημα ξεκινά από το αναμενόμενο όνομα τομέα. Ωστόσο, θα πρέπει να σημειωθεί ότι αυτή η μέθοδος έχει περιορισμούς, για παράδειγμα, σε ένα αίτημα υποβάθμισης από HTTPS σε HTTP, το Referer δεν θα σταλεί.

  • Ελέγξτε την κεφαλίδα προέλευσης: Παρόμοια με το Referer, η κεφαλίδα Origin παρέχει πληροφορίες σχετικά με την πηγή του αιτήματος, αλλά αποστέλλεται μόνο όταν χρησιμοποιείται XMLHttpRequest ή Fetch API.

3. Χρησιμοποιήστε το χαρακτηριστικό Cookie SameSite

Για εκείνα τα cookie που δεν απαιτούν πρόσβαση μεταξύ τοποθεσιών, το χαρακτηριστικό SameSite μπορεί να ρυθμιστεί για ενίσχυση της ασφάλειας.

  • SameSite=Λαξ: Το cookie αποστέλλεται μόνο σε αιτήματα στον ίδιο ιστότοπο, προστατεύοντας εν μέρει από CSRF.
  • SameSite=Αυστηρό: Τα cookies αποστέλλονται μόνο στον ίδιο ιστότοπο και στην ίδια πλοήγηση σελίδας, παρέχοντας ισχυρότερη προστασία, αλλά ενδέχεται να επηρεάσουν ορισμένες αναμενόμενες λειτουργίες μεταξύ υποτομέων.
  • SameSite=Καμία: Πρέπει να χρησιμοποιούνται με το χαρακτηριστικό Secure για cookie που πρέπει να είναι μεταξύ των ιστοτόπων για να προσαρμοστούν στις απαιτήσεις των σύγχρονων προγραμμάτων περιήγησης.

4. Επαλήθευση κεφαλίδας προσαρμοσμένου αιτήματος

Προσθέστε μια προσαρμοσμένη κεφαλίδα HTTP στο αίτημα AJAX (π.χX-Requested-With: XMLHttpRequest ), και στη συνέχεια επαληθεύστε την ύπαρξη και την τιμή αυτής της κεφαλίδας στην πλευρά του διακομιστή. Επειδή η JavaScript μπορεί να ορίσει ελεύθερα την κεφαλίδα του XMLHttpRequest, αλλά η τυπική υποβολή φόρμας δεν μπορεί, αυτό μπορεί να διακρίνει αιτήματα που ξεκινούν από σενάρια.

Δείγμα κώδικα (υλοποίηση διακριτικού CSRF):

Πλευρά διακομιστή (ψευδοκώδικας):

// 生成并设置Token
function generateCsrfToken() {
    return crypto.randomBytes(32).toString('hex');
}

app.post('/login', (req, res) => {
    const token = generateCsrfToken();
    res.cookie('csrfToken', token, { httpOnly: true, secure: true, sameSite: 'strict' });
    // 存储token到session或其他存储机制
});

app.post('/submitForm', (req, res) => {
    if (req.body.csrfToken === req.cookies.csrfToken) {
        // 请求合法,处理逻辑...
    } else {
        // CSRF攻击检测,拒绝请求
        res.status(403).send('Forbidden');
    }
});
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16
  • 17
  • 18
  • 19

HTML διεπαφής:

<form action="/submitForm" method="POST">
    <!-- 其他表单字段... -->
    <input type="hidden" name="csrfToken" value="{{csrfToken}}">
    <button type="submit">Submit</button>
</form>
  • 1
  • 2
  • 3
  • 4
  • 5

Λάβετε υπόψη ότι ο παραπάνω κώδικας είναι μόνο ένα παράδειγμα και η πραγματική εφαρμογή πρέπει να προσαρμοστεί σύμφωνα με το πλαίσιο υποστήριξης και τη γλώσσα που χρησιμοποιείται.