Τι είναι τα αόρατα χαρακτήρες;

Τα αόρατα χαρακτήρες είναι σημεία κώδικα Unicode που δεν έχουν ορατό γλυφό αλλά εξακολουθούν να καταλαμβάνουν χώρο σε μια συμβολοσειρά και επηρεάζουν τον τρόπο με τον οποίο το λογισμικό επεξεργάζεται ή αποδίδει κείμενο. Περιλαμβάνουν χαρακτήρες ελέγχου (όπως tab και line feed), χαρακτήρες μορφοποίησης (όπως zero-width joiners και directional marks), διάφορες παραλλαγές κενού διαστήματος και ειδικούς δείκτες όπως το Byte Order Mark (BOM). Επειδή δεν φαίνονται, είναι εξαιρετικά δύσκολο να τα εντοπίσετε σε έναν απλό επεξεργαστή κειμένου και είναι μια συνηθισμένη πηγή λεπτών σφαλμάτων, σπασμένων διατάξεων και σφαλμάτων επεξεργασίας δεδομένων.

Περιγραφή εργαλείου

Το Invisible Characters Viewer είναι ένας διαδραστικός επεξεργαστής κειμένου που αποδίδει κάθε αόρατο χαρακτήρα ως ορατό σύμβολο, στη θέση του. Επικολλήστε ή πληκτρολογήστε οποιοδήποτε κείμενο και κάθε κρυμμένος χαρακτήρας αντικαθίσταται αμέσως από ένα μικρό συμβολικό γλυφό — τα tabs εμφανίζονται ως →, τα κενά διαστήματα ως ·, τα zero-width spaces ως ·, τα directional marks ως → / ←, το BOM ως ▯, και ούτω καθεξής. Όταν περνάτε το ποντίκι πάνω από οποιοδήποτε γλυφό, εμφανίζεται ένα tooltip με το πλήρες όνομα του χαρακτήρα και το σημείο κώδικα Unicode. Τίποτα δεν φεύγει από τον επεξεργαστή· όλη η απόδοση γίνεται τοπικά στο πρόγραμμα περιήγησής σας.

Παραδείγματα

Κείμενο εισόδου (raw) Τι βλέπετε στο viewer
Hello\u200BWorld (zero-width space μεταξύ λέξεων) Hello·World με το γλυφό · να σημειώνει U+200B
\u202Eright-to-left override →right-to-left override με το directional glyph στην αρχή
line one\r\nline two Carriage-return και line-feed glyphs πριν από τη νέα γραμμή
\uFEFFstart of file ▯start of file που δείχνει το BOM στη θέση 0

Χαρακτηριστικά

  • Inline rendering: Τα αόρατα χαρακτήρες εμφανίζονται ως γλυφά απευθείας μέσα στον επεξεργαστή και όχι σε ξεχωριστό πάνελ, ώστε να τα δείτε στο πλαίσιο του περιβάλλοντος κειμένου
  • Ευρεία κάλυψη χαρακτήρων: Χειρίζεται χαρακτήρες ελέγχου C0 και C1, όλους τους ονοματισμένους χαρακτήρες μορφοποίησης Unicode, παραλλαγές κενού διαστήματος Unicode (en space, em space, hair space, narrow no-break space, κ.λπ.), χαρακτήρες κατευθυντικής μορφοποίησης, variation selectors, tag characters και BOM
  • Tooltips: Όταν περνάτε το ποντίκι πάνω από οποιοδήποτε γλυφό, εμφανίζεται το πλήρες όνομα Unicode του χαρακτήρα και το σημείο κώδικα (π.χ. Zero Width Space — U+200B)
  • Επισήμανση κανονικού κενού διαστήματος: Τα κανονικά κενά διαστήματα και τα tabs επισημαίνονται χρησιμοποιώντας τους ενσωματωμένους δείκτες κενού διαστήματος του CodeMirror, διατηρώντας τα οπτικά διακριτά από το κανονικό κείμενο
  • Λειτουργία απλού κειμένου: Ο επεξεργαστής παραμένει σε λειτουργία απλού κειμένου, ώστε οι ειδικοί χαρακτήρες να μην επανερμηνεύονται ή τροποποιούνται ποτέ καθώς πληκτρολογείτε

Περιπτώσεις χρήσης

  • Αποσφαλμάτωση αντικειμένων αντιγραφής-επικόλλησης: Το κείμενο που αντιγράφεται από PDF, ιστοσελίδες ή επεξεργαστές κειμένου συχνά φέρει zero-width spaces, soft hyphens ή non-breaking spaces που προκαλούν αναντιστοιχίες σε συγκρίσεις συμβολοσειρών και αποτελέσματα αναζήτησης
  • Επιθεώρηση αρχείων δεδομένων: Επικολλήστε CSV, JSON ή έξοδο αρχείου καταγραφής για να εντοπίσετε απροσδόκητους χαρακτήρες ελέγχου (null bytes, carriage returns, BOM) πριν εισάγετε δεδομένα σε μια βάση δεδομένων ή parser
  • Αποσφαλμάτωση ιστού και κώδικα: Ελέγξτε την εισαγωγή που παρέχεται από τον χρήστη ή τις απαντήσεις API για κρυμμένα directional marks ή χαρακτήρες μορφοποίησης που ενδέχεται να σπάσουν την απόδοση ή να προκαλέσουν προβλήματα ασφαλείας

Πώς λειτουργεί

Το εργαλείο χρησιμοποιεί CodeMirror 6 με μια προσαρμοσμένη επέκταση που επαναλαμβάνεται σε κάθε χαρακτήρα στο ορατό viewport του επεξεργαστή. Για κάθε σημείο κώδικα, ελέγχει έναν πίνακα αναζήτησης γνωστών αόρατων χαρακτήρων, δοκιμάζει έναντι κλάσεων ιδιοτήτων Unicode \p{Cc} (control) και \p{Cf} (format), και ανιχνεύει variation selectors και εύρη tag characters. Οι χαρακτήρες που ταιριάζουν αντικαθίστανται από inline decoration widgets που δείχνουν το αντίστοιχο σύμβολο γλυφό. Τα κανονικά κενά διαστήματα και τα tabs ανατίθενται στην ενσωματωμένη επέκταση highlightWhitespace του CodeMirror.