Πρέπει να παραδεχτούμε ότι όσον αφορά τις πιο δημοφιλείς βιβλιοθήκες Javascript, στην ιστορία της ανάπτυξής τους (9, 6 και 5 χρόνια για τις Angular, React και Vue, αντίστοιχα), συνέβησαν πολλά καλά πράγματα όσον αφορά την ασφάλεια, ειδικά όσον αφορά την ευπάθεια σε επιθέσεις XSS. Ωστόσο, αυτό το άρθρο θα συζητήσει τις μικρές παγίδες και τις αρχές που οι προγραμματιστές πρέπει ακόμα να γνωρίζουν.
XSS
Ζούμε στην εποχή των πλαισίων, όχι των γλωσσών. Αυτό συνεπάγεται ότι οι προγραμματιστές θα πρέπει να μπορούν να ανησυχούν λιγότερο για πολλές πτυχές της ανάπτυξης, συμπεριλαμβανομένης της ασφάλειας. Η πλειονότητα των σημερινών backend frameworks υλοποιεί ενότητες ασφαλείας, οι οποίες δοκιμάζονται από εξωτερικές, εξειδικευμένες εταιρείες και μεγάλες κοινωνίες. Ως εκ τούτου, μειωμένη ευαισθητοποίηση σε θέματα ασφάλειας θα μπορούσε να είναι εμφανής, για παράδειγμα μεταξύ των νέων προγραμματιστών, οι οποίοι αναλαμβάνουν μεγαλύτερη ευθύνη για τα προϊόντα, ιδίως όσον αφορά την ανεξάρτητη εργασία.
Μία από τις συνηθισμένες επιθέσεις στην πλευρά πελάτη της εφαρμογής είναι το XSS (Cross-Site Scripting). Πραγματοποιείται με την εισαγωγή εκτελέσιμων σεναρίων από την πλευρά του πελάτη σε διαδικτυακές εφαρμογές [1] και χρησιμοποιεί υλοποιημένες μεθόδους απόδοσης HTML ή Javascript κωδικός αξιολογητές που το εκτελούν. Το XSS είναι σχετικά επικερδές, καθώς μπορούν να συγκεντρωθούν πολλά διαφορετικά δεδομένα, όπως cookies συνεδρίας ή δεδομένα χρήστη, και μπορεί να εγκαταστήσει μια εφαρμογή παρακολούθησης, όπως ένα keylogger, καθιστώντας το επικίνδυνο τόσο για τους χρήστες όσο και για τους ιδιοκτήτες επιχειρήσεων. Μερικές φορές, πραγματοποιούνται και άλλες μορφές επίθεσης για να επιτραπεί το XSS στη σελίδα, όπως Έγχυση SQL.
Παράδειγμα
Η φόρμα σύνδεσης στη σελίδα εμφανίζει την παράμετρο loginName που αποστέλλεται στο πλαίσιο της αίτησης GET στην είσοδο ονόματος σύνδεσης. Η τιμή δεν επεξεργάζεται ούτε από τον διακομιστή ούτε από την πλευρά πελάτη της εφαρμογής. Με την αίτηση: http://localhost:8080/login?name=<script>alert(document.cookies)</script>
εκτελείται κώδικας και εκτίθενται δεδομένα
Αυτό είναι ένα παράδειγμα ενός ανακλώμενη επίθεση XSS, όπου τα σενάρια εισάγονται μέσω ειδικά προετοιμασμένης διεύθυνσης URL που υποβάλλεται στο θύμα και αντανακλάται από την απόκριση του διακομιστή. Άλλες γνωστές δημοφιλείς μορφές επιθέσεων είναι οι εξής:
- Αποθηκευμένο XSS εκτελείται με δεδομένα που έχουν εισαχθεί και είναι αποθηκευμένα στην πλευρά του διακομιστή, συνήθως από φόρμες που είναι διαθέσιμες στην εφαρμογή. Η εφαρμογή-πελάτης αποδίδει κώδικα που είναι αποθηκευμένος, για παράδειγμα, σε μια βάση δεδομένων.
- DOM XSS εκτελεί μια επίθεση XSS χωρίς χρήση της πλευράς διακομιστή. Στο επόμενο μέρος του άρθρου, θα επικεντρωθούμε σε αυτή τη μορφή επίθεσης.
Τρέχουσες ευπάθειες στις βιβλιοθήκες React και Vue
Για τις τρέχουσες εκδόσεις React/Vue, είχαν εντοπιστεί δύο σημαντικά προβλήματα που δεν έχουν ακόμη διορθωθεί επίσημα. Η πρώτη ευπάθεια έχει την ίδια φύση για κάθε πλαίσιο και σχετίζεται με μεθόδους που επιτρέπουν την απόδοση ακατέργαστης HTML μέσα σε πρότυπα: v-html και dangerouslySetInnerHTML, αντίστοιχα, για Vue και React. Κάθε τεκμηρίωση [2] ενημερώνει τους αναγνώστες ότι η μη συνετή χρήση μπορεί να εκθέσει τους χρήστες σε επίθεση XSS. Εάν δεν υπάρχουν άλλες επιλογές για την επίλυση του προβλήματος, βεβαιωθείτε ότι τα δεδομένα είναι φιλτραρισμένο και δραπέτευσε. Αν και είναι επικίνδυνες, δεν πρέπει να περιμένετε ότι αυτές οι μέθοδοι θα διορθωθούν. Χρησιμοποιήστε τις με δική σας ευθύνη.
Το πρώτο τρίμηνο του 2018, εντοπίστηκε ένα μεγάλο σφάλμα στο React, το οποίο επέτρεπε την άμεση εκτέλεση κώδικα με τον καθορισμό της ιδιότητας για το στοιχείο tag. Το πέρασμα κώδικα παραδείγματος μέσα σε ιδιότητες, όπως το javascript:alert(1)
και εκτελώντας ένα σύνδεσμο που έχει αποδοθεί θα εκτελέσει τον κώδικα. Αυτό το θέμα [4] είναι ακόμα ανοιχτό και δεν έχει ετοιμαστεί και συγχωνευτεί καμία διόρθωση, οπότε βεβαιωθείτε ότι ο κώδικάς σας είναι ασφαλής. Τα παραδείγματα που προτείνονται στην επίσημη συζήτηση προτείνουν κάποιους τρόπους για να ξεπεραστεί αυτό το πρόβλημα.
Αν η ενημέρωση στις τελευταίες εκδόσεις δεν είναι δυνατή, βεβαιωθείτε ότι τα παλιά ζητήματα δεν σας δημιουργούν προβλήματα, διασφαλίζοντας ότι ο κώδικάς σας δεν είναι εκτεθειμένος σε:
- παιδί κόμβος ένεση - React, χρήση του React.createElement [5]
- απόδοση από την πλευρά του διακομιστή - React/Vue [6]
- Έγχυση CSS [8]
Εξακολουθεί να αφορά τη Javascript. Εξακολουθεί να αφορά το front-end
Μην ξεχνάτε ότι, εκτός από τα ίδια τα πλαίσια ή τις βιβλιοθήκες, η Javascript ως γλώσσα έχει ορισμένες επικίνδυνες λειτουργίες, οι οποίες πρέπει να αποφεύγονται ή να χρησιμοποιούνται με προσοχή. Γενικά σχετίζονται με τον χειρισμό του DOM ή την εκτέλεση δέσμης ενεργειών. eval() αντιπροσωπεύει ναυαρχίδες αυτού του είδους και είναι εξαιρετικά επικίνδυνη, επειδή εκτελεί απευθείας δεδομένο αλφαριθμητικό κώδικα [9]. Επίσης, ρίξτε μια καλύτερη ματιά στον κώδικά σας όταν βρίσκετε μια από αυτές τις συναρτήσεις:
- document.write
- document.writeln
- (element).innerHTML
- (element).outerHTML
- (element).insertAdjacentHTML
Εδώ, η χρήση πλειοδοτών με κατάλληλο σύνολο κανόνων μπορεί να βοηθήσει στην εύρεση τέτοιων ευάλωτων σημείων. Υπάρχουν επίσης πολλοί ανοιχτοί ή εμπορικοί αναλυτές κώδικα που μπορούν να σας βοηθήσουν να εντοπίσετε κενά ασφαλείας στον κώδικα που αναπτύσσεται.
Ανεξάρτητα από το ποια βιβλιοθήκη/πλαίσιο θα επιλεγεί, πρέπει να θυμόμαστε τις βασικές αρχές που σχετίζονται με την ανάπτυξη front-end. Πρώτον, βεβαιωθείτε πάντα ότι ο εξωτερικός κώδικας που εισάγετε προέρχεται από μια αξιόπιστη πηγή. Έλεγχος τις εξαρτήσεις σας και επιλέξτε τις με σύνεση. Ορισμένες μπορεί να περιέχουν σοβαρά τρωτά σημεία, εκθέτοντας τον κώδικά σας, ακόμη και αν όλα είναι εντάξει με τον ίδιο τον κώδικα. Μπορείτε να διαβάσετε περισσότερα για την ασφάλεια των εξαρτήσεων εδώ:
https://thecodest.co/blog/security-in-javascript-packages/
Οπότε... θα πρέπει να ανησυχείτε ακόμα;
Ναι - και ενθαρρύνω έντονα όλους να μην εμπιστεύονται ποτέ εξωτερικές βιβλιοθήκες ή τον εαυτό τους όσον αφορά την ασφάλεια. Ανεξάρτητα από το πόσο ασφαλές περιμένετε να είναι το λογισμικό σας, να κάνετε πάντα μια προσπάθεια να το δοκιμάζετε όσο το δυνατόν περισσότερο όσον αφορά τις συνήθεις μορφές επιθέσεων [10].
- https://reactjs.org/docs/dom-elements.html#dangerouslysetinnerhtml
- https://vuejs.org/v2/guide/syntax.html#Raw-HTML
- https://github.com/facebook/react/issues/12441
- http://danlec.com/blog/xss-via-a-spoofed-react-element
- https://medium.com/node-security/the-most-common-xss-vulnerability-in-react-js-applications-2bdffbcc1fa0
- https://github.com/dotboris/vuejs-serverside-template-xss
- https://frontarm.com/james-k-nelson/how-can-i-use-css-in-js-securely/
- https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/eval#Do_not_ever_use_eval!
Διαβάστε περισσότερα:
5 λάθη που πρέπει να αποφύγετε κατά τη συντήρηση ενός έργου στο PHP
PHP Ανάπτυξη. Symfony Console Component - Συμβουλές και κόλπα
Γιατί χρειαζόμαστε το Symfony Polyfill (... και γιατί δεν θα έπρεπε)