Πώς εμφανίζετε έναν ιστότοπο;

Η εμφάνιση ενός ιστότοπου περιλαμβάνει διάφορα στρώματα, από τον διακομιστή που φιλοξενεί τον ιστότοπο στον πρόγραμμα περιήγησής σας, ερμηνεύοντας τον κώδικα και την απόδοση στην οθόνη σας. Ακολουθεί μια ανάλυση της διαδικασίας:

1. Ζητώντας τον ιστότοπο (ξεκινάτε τη διαδικασία):

* Πληκτρολογώντας τη διεύθυνση URL (ή κάνοντας κλικ σε σύνδεσμο): Εισάγετε μια διεύθυνση ιστότοπου (Uniform Resource Locator ή URL) όπως το `www.example.com 'στη γραμμή διευθύνσεων του προγράμματος περιήγησης σας ή κάντε κλικ σε μια υπερσύνδεση.

* αναζήτηση DNS: Το πρόγραμμα περιήγησής σας (ή το λειτουργικό σύστημα) χρησιμοποιεί το σύστημα ονόματος τομέα (DNS) για να μεταφράσει τη διεύθυνση URL αναγνώσιμη από τον άνθρωπο (π.χ., www.example.com`) στη διεύθυνση IP του διακομιστή που φιλοξενεί τον ιστότοπο (π.χ. 192.0.2.1`). Σκεφτείτε το DNS ως τηλεφωνικό κατάλογο για το Διαδίκτυο. Ο υπολογιστής σας στέλνει ένα αίτημα σε διακομιστή DNS (που συνήθως παρέχεται από τον πάροχο υπηρεσιών Διαδικτύου) για να βρείτε τη διεύθυνση IP που σχετίζεται με το όνομα τομέα.

2. Απάντηση διακομιστή:

* Αίτημα HTTP: Το πρόγραμμα περιήγησής σας στέλνει ένα αίτημα HTTP (πρωτόκολλο μεταφοράς HyperText) στον διακομιστή στη διεύθυνση IP που ανακτήθηκε. Αυτό το αίτημα καθορίζει αυτό που ζητάτε (συνήθως η κύρια ιστοσελίδα, συχνά `index.html` ή παρόμοια). Η μέθοδος αίτησης είναι συνήθως `get` (για να ανακτήσετε έναν πόρο), αλλά μπορεί επίσης να είναι` post '(για να υποβάλετε δεδομένα), `put`,` delete', κλπ.

* Επεξεργασία διακομιστή: Ο διακομιστής ιστού λαμβάνει το αίτημα HTTP. Προσδιορίζει τον πόρο που ζητείται (π.χ. `index.html`). Ο διακομιστής μπορεί:

* Σερβίρετε απευθείας ένα στατικό αρχείο (όπως `index.html`,` image.jpg`, `style.css`).

* Εκτελέστε τον κωδικό διακομιστή (PHP, Python, Java, Node.js κ.λπ.) για τη δημιουργία δυναμικού περιεχομένου. Αυτός ο κωδικός ενδέχεται να έχει πρόσβαση σε βάσεις δεδομένων, λογαριασμούς χρηστών ή άλλες πηγές δεδομένων.

* Εκτελέστε ελέγχους ελέγχου ταυτότητας και εξουσιοδότησης για να βεβαιωθείτε ότι έχετε άδεια πρόσβασης στον αιτούντα πόρο.

* απάντηση HTTP: Ο διακομιστής προετοιμάζει μια απάντηση HTTP, η οποία περιλαμβάνει:

* Κωδικός κατάστασης: Ένας κωδικός που υποδεικνύει την επιτυχία ή την αποτυχία του αιτήματος (π.χ., 200 OK, 404 δεν βρέθηκε, 500 εσωτερικό σφάλμα διακομιστή).

* κεφαλίδες: Μεταδεδομένα σχετικά με την απόκριση (π.χ. τύπος περιεχομένου, κωδικοποίηση χαρακτήρων, οδηγίες προσωρινής αποθήκευσης). Η κεφαλίδα "τύπου περιεχομένου" είναι ιδιαίτερα σημαντική, καθώς λέει στο πρόγραμμα περιήγησης τι είδους δεδομένα αναμένεται (π.χ., `text/html`,` image/jpeg`, `application/javascript ').

* σώμα: Το πραγματικό περιεχόμενο της ιστοσελίδας (HTML, CSS, JavaScript, εικόνες κ.λπ.).

3. Απόδοση του προγράμματος περιήγησης:

* Λήψη της απάντησης: Το πρόγραμμα περιήγησής σας λαμβάνει την απάντηση HTTP από το διακομιστή.

* Αναλύοντας html: Το πρόγραμμα περιήγησης αναλύει τον κώδικα HTML στο σώμα απόκρισης. Η HTML (γλώσσα σήμανσης HyperText) ορίζει τη δομή και το περιεχόμενο της ιστοσελίδας (επικεφαλίδες, παραγράφους, εικόνες, συνδέσμους κ.λπ.). Το πρόγραμμα περιήγησης δημιουργεί ένα μοντέλο αντικειμένου εγγράφων (DOM), το οποίο είναι μια δέντρο που μοιάζει με τη δομή HTML.

* Αναφορά CSS: Το πρόγραμμα περιήγησης αναλύει οποιοδήποτε κώδικα CSS (φύλλα στυλ), είτε ενσωματωμένο απευθείας στο HTML (χρησιμοποιώντας `` ετικέτες) ή συνδεδεμένο από εξωτερικά αρχεία CSS. Το CSS ορίζει το οπτικό στυλ της ιστοσελίδας (χρώματα, γραμματοσειρές, διάταξη κ.λπ.). Το πρόγραμμα περιήγησης δημιουργεί ένα μοντέλο αντικειμένου CSS (CSSOM) και το συνδυάζει με το DOM για να δημιουργήσει ένα δέντρο απόδοσης.

* Εκτέλεση Javascript: Το πρόγραμμα περιήγησης εκτελεί οποιονδήποτε κώδικα JavaScript, είτε ενσωματωμένο στο HTML (χρησιμοποιώντας `