www, ανακατεύθυνση και μικτό περιεχόμενο

Ενότητα 3: Διεύθυνση, https και χρήστες · Χρόνος ανάγνωσης: 9 λεπτά

Μαθησιακός στόχος: Μετά από αυτό το μάθημα θα μπορείτε να επιλέξετε μία κύρια διεύθυνση, να στείλετε όλες τις παραλλαγές εκεί με μία ανακατεύθυνση και να εντοπίσετε και να διορθώσετε το μικτό περιεχόμενο.

Βασικές έννοιες: κανονική διεύθυνση, 301 και 308, αλυσίδα ανακατευθύνσεων, μικτό περιεχόμενο (mixed content), αναζήτηση και αντικατάσταση στη βάση δεδομένων, σειριοποιημένα δεδομένα (serialized data)

Τέσσερις διευθύνσεις, ένας ιστότοπος

Ο ιστότοπός σας είναι προσβάσιμος μέσω τεσσάρων διευθύνσεων:

http://example.com
http://www.example.com
https://example.com
https://www.example.com

Για τον επισκέπτη αυτό δεν έχει σημασία, αλλά για τις μηχανές αναζήτησης πρόκειται για τέσσερις διαφορετικές διευθύνσεις με το ίδιο περιεχόμενο. Επίσης τα cookies (όπως το cookie σύνδεσής σας) ισχύουν ανά όνομα: όποιος συνδέεται στο www δεν είναι συνδεδεμένος στο domain χωρίς www. Γι' αυτό επιλέγετε μία κανονική διεύθυνση (την κύρια διεύθυνση) και ανακατευθύνετε τις άλλες τρεις εκεί.

Ποια θα επιλέξετε είναι θέμα προτίμησης (μάθημα 2.1). Το σημαντικό είναι ότι η κύρια διεύθυνση είναι παντού ίδια: στο DNS, στο πιστοποιητικό, στις Ρυθμίσεις > Γενικά (μάθημα 3.1) και στις ανακατευθύνσεις.

Ανακατεύθυνση με 301, σε ένα βήμα

Μια ανακατεύθυνση είναι μια απάντηση του server: "αυτή η σελίδα βρίσκεται κάπου αλλού". Το πρόγραμμα περιήγησης μεταβαίνει τότε αυτόματα στη νέα διεύθυνση. Ο κωδικός δηλώνει τι είδους ανακατεύθυνση είναι:

Μια μόνιμη ανακατεύθυνση ενημερώνει τις μηχανές αναζήτησης ότι η νέα διεύθυνση είναι η πραγματική. Με μια προσωρινή, συνεχίζουν να θυμούνται την παλιά διεύθυνση.

Προσέξτε επίσης την αλυσίδα. Υποθέστε ότι η κύρια διεύθυνσή σας είναι https://example.com. Τότε θέλετε:

http://www.example.com   301  https://example.com/
http://example.com       301  https://example.com/
https://www.example.com  301  https://example.com/
https://example.com      200

Κάθε παραλλαγή καταλήγει σε ένα βήμα στην κύρια διεύθυνση. Αυτό που συχνά συμβαίνει:

http://www.example.com   301  https://www.example.com/
https://www.example.com  301  https://example.com/

Αυτό λειτουργεί μεν, αλλά κοστίζει ένα επιπλέον βήμα (επιπλέον χρόνος αναμονής, ιδίως σε κινητά) και μια επιπλέον χειραψία TLS. Χειρότερο είναι ένα φαύλο κύκλο: ο web server στέλνει στο https, το WordPress στέλνει πίσω στο http επειδή οι διευθύνσεις στις ρυθμίσεις είναι ακόμα σε http, και το πρόγραμμα περιήγησης εμφανίζει "πάρα πολλές ανακατευθύνσεις". Τότε δύο ρυθμίσεις στέλνουν η μία εναντίον της άλλης. Φροντίστε ώστε μόνο ένα μέρος να κάνει την ανακατεύθυνση προς https (ο web server ή το πάνελ διαχείρισης), και οι διευθύνσεις στο WordPress να είναι ήδη στην κύρια διεύθυνση.

Το WordPress κάνει επίσης από μόνο του ανακατευθύνσεις: αν κάποιος ζητήσει https://www.example.com/contact/ ενώ η διεύθυνση του ιστότοπου είναι https://example.com, τότε το WordPress ανακατευθύνει προς https://example.com/contact/. Αυτό λειτουργεί μόνο αν το αίτημα φτάσει στο WordPress, δηλαδή αν ο web server οδηγεί και το όνομα www σε αυτόν τον ιστότοπο.

Μικτό περιεχόμενο

Το μικτό περιεχόμενο (mixed content) είναι μια σελίδα https που φορτώνει στοιχεία μέσω http://: μια εικόνα, ένα stylesheet, ένα script, μια γραμματοσειρά ή ένα ενσωματωμένο βίντεο. Το πρόγραμμα περιήγησης το θεωρεί ανασφαλές, επειδή αυτά τα στοιχεία μπορούν να αλλοιωθούν στη διαδρομή.

• Scripts, stylesheets και iframes μέσω http αποκλείονται από τα προγράμματα περιήγησης. Ο ιστότοπός σας τότε φαίνεται «σπασμένος» ή μια λειτουργία δεν δουλεύει.
• Εικόνες, ήχος και βίντεο μέσω http τα σύγχρονα προγράμματα περιήγησης προσπαθούν αυτόματα να τα ανακτήσουν μέσω https· αν αυτό αποτύχει, αποκλείονται. Το λουκέτο μπορεί τότε να εμφανίσει μια προειδοποίηση.

Από πού προέρχεται:

1. Παλιοί σύνδεσμοι στο περιεχόμενό σας: ένας ιστότοπος που παλαιότερα ήταν σε http έχει σε χιλιάδες άρθρα <img src="http://example.com/wp-content/uploads/...">. Το WordPress αποθηκεύει αυτούς τους συνδέσμους κυριολεκτικά στη βάση δεδομένων.
2. Ρυθμίσεις θέματος εμφάνισης ή πρόσθετου με μια πλήρη διεύθυνση, για παράδειγμα ένα λογότυπο ή φόντο με http://.
3. Εξωτερικά στοιχεία από άλλον ιστότοπο που είναι προσβάσιμα μόνο μέσω http. Αυτά πρέπει να τα αντικαταστήσετε ή να τα αφαιρέσετε.
4. Διευθύνσεις στις Ρυθμίσεις > Γενικά που εξακολουθούν να είναι σε http (μάθημα 3.1).

Πώς θα το εντοπίσετε

Ανοίξτε τη σελίδα, πατήστε F12 και κοιτάξτε στην καρτέλα Console. Το πρόγραμμα περιήγησης αναφέρει κάθε μικτό περιεχόμενο με τη διεύθυνση του στοιχείου. Ή αναζητήστε στον πηγαίο κώδικα της σελίδας (Ctrl+U) τα src="http:// και href="http://. Σύνδεσμοι προς άλλους ιστότοπους σε απλό κείμενο (<a href="http://...">) δεν αποτελούν μικτό περιεχόμενο· το θέμα αφορά πράγματα που η σελίδα φορτώνει.

Αναζήτηση και αντικατάσταση, αλλά σωστά

Η λύση για τους παλιούς συνδέσμους στο περιεχόμενό σας είναι να αντικαταστήσετε όλα τα http://example.com στη βάση δεδομένων με https://example.com. Ο πειρασμός είναι μια εντολή SQL όπως:

UPDATE wp_options SET option_value = REPLACE(option_value, 'http://example.com', 'https://example.com');

Μην το κάνετε αυτό. Πολλές ρυθμίσεις θεμάτων εμφάνισης, πρόσθετων και widgets είναι αποθηκευμένες με σειριοποίηση (serialized). Αυτό φαίνεται ως εξής:

s:27:"http://example.com/logo.png";

Το s:27 σημαίνει: ακολουθεί ένα κείμενο 27 χαρακτήρων. Μετά από μια απλή αντικατάσταση το κείμενο έχει 28 χαρακτήρες (προστέθηκε ένα s), αλλά εξακολουθεί να γράφει 27. Η PHP τότε δεν μπορεί πια να διαβάσει τη τιμή και η ρύθμιση εξαφανίζεται σιωπηλά: ένα άδειο μενού, ένα λογότυπο που χάθηκε, widgets που έχουν εξαφανιστεί.

Χρησιμοποιήστε ένα εργαλείο που ενημερώνει αυτά τα μήκη:

• WP-CLI: πρώτα ελέγξτε, μετά εκτελέστε.

wp search-replace 'http://example.com' 'https://example.com' --all-tables --dry-run
wp search-replace 'http://example.com' 'https://example.com' --all-tables

Με το --dry-run βλέπετε πόσες αντικαταστάσεις θα γίνονταν ανά πίνακα, χωρίς να αλλάξει τίποτα.

• Ένα πρόσθετο αναζήτησης και αντικατάστασης που υποστηρίζει σειριοποιημένα δεδομένα (υπάρχουν πολλά στον κατάλογο πρόσθετων του wordpress.org). Αφαιρέστε το πρόσθετο ξανά μετά τη χρήση του.

Δημιουργήστε πάντα πρώτα ένα αντίγραφο ασφαλείας (μάθημα 8.1). Μην αντικαθιστάτε ποτέ κάτι όπως example.com χωρίς το http:// μπροστά του: τότε επηρεάζετε και διευθύνσεις email και άλλα κείμενα.

Στην πράξη: έτσι φαίνεται σε ένα πάνελ διαχείρισης

Ως παράδειγμα χρησιμοποιούμε το DirectAdmin. Άλλα πάνελ διαχείρισης έχουν έναν παρόμοιο διακόπτη για "πάντα https".

1. Ενεργοποιήστε στις ρυθμίσεις domain την επιλογή Forceer SSL met https omleiding (μάθημα 3.1).
2. Επιλέξτε στο domain αν το www πρέπει να οδηγεί στο domain χωρίς www ή αντίστροφα (στο DirectAdmin στις ρυθμίσεις domain· διαφορετικά με μια ανακατεύθυνση μέσω Site Omleiden ή .htaccess).
3. Ελέγξτε την αλυσίδα με την παρακάτω άσκηση ή με τα εργαλεία ανάπτυξης του προγράμματος περιήγησής σας (καρτέλα Δίκτυο, με επιλεγμένο το "Διατήρηση αρχείου καταγραφής").

Σύνοψη

• Επιλέξτε μία κανονική διεύθυνση και αφήστε τις άλλες τρεις παραλλαγές να οδηγούν εκεί με μια 301 (ή 308), σε ένα βήμα.
• Αφήστε μόνο ένα μέρος να κάνει την ανακατεύθυνση προς https· διαφορετικά θα δημιουργηθεί φαύλος κύκλος.
• Το μικτό περιεχόμενο είναι μια σελίδα https που φορτώνει στοιχεία μέσω http· η κονσόλα του προγράμματος περιήγησης δείχνει ποια.
• Παλιούς συνδέσμους στη βάση δεδομένων τους αντικαθιστάτε με wp search-replace ή ένα πρόσθετο που κατανοεί τα σειριοποιημένα δεδομένα, ποτέ με μια απλή SQL-REPLACE.
• Πάντα πρώτα ένα αντίγραφο ασφαλείας, και πρώτα μια δοκιμή.

Κουίζ

Άσκηση

Άσκηση A3.2: Μία κύρια διεύθυνση και κανένα μικτό περιεχόμενο (mixed content). Συμπληρώστε το domain σας. Το πρόγραμμα ανοίγει τις τέσσερις παραλλαγές (http και https, με και χωρίς www) και ακολουθεί τις ανακατευθύνσεις. Σωστό είναι: και οι τέσσερις καταλήγουν στην ίδια διεύθυνση με https, με το πολύ μία ανακατεύθυνση ανά παραλλαγή και μόνο μόνιμους κωδικούς (301 ή 308). Στη συνέχεια το πρόγραμμα διαβάζει το HTML της αρχικής σελίδας και αναζητά scripts, stylesheets, εικόνες, iframes και γραμματοσειρές που φορτώνονται μέσω http://.

Περαιτέρω ανάγνωση

Αυτά τα άρθρα περιγράφουν τα βήματα στα πάνελ διαχείρισης του WebOké· σε άλλα πάνελ διαχείρισης λειτουργούν με παρόμοιο τρόπο.

• Εγχειρίδιο DirectAdmin 6.4: Επισκέπτες πάντα προς https
• Εγχειρίδιο DirectAdmin 4.7: Ανακατεύθυνση ιστότοπου: προώθηση domain ή σελίδας
• Υποχρεωτική ανακατεύθυνση επισκεπτών σε https
• Δωρεάν μάθημα DNS 3.4: www, ανακατεύθυνση και τι δεν κάνει το DNS
• Μικτό περιεχόμενο (MDN, Αγγλικά): https://developer.mozilla.org/en-US/docs/Web/Security/Mixed_content
• wp search-replace (developer.wordpress.org, Αγγλικά): https://developer.wordpress.org/cli/commands/search-replace/