Αίτημα Ajax σε άλλο τομέα. Υποβάλλει ένα αίτημα Ajax στον διακομιστή, χρησιμοποιώντας πολλές προαιρετικές παραμέτρους για τη διαμόρφωσή του
Σύνταξη και περιγραφή:
Επιστρεφόμενη τιμή: Μια παρουσία του αντικειμένου XHR (XMLHttpRequest).
Επιλογές:
async – (boolean - λογική τιμή) Η προεπιλεγμένη τιμή είναι true, και στη συνέχεια όλα τα αιτήματα εκτελούνται ασύγχρονα (Γι' αυτό χρησιμοποιείται το Ajax, ώστε οι λειτουργίες να εκτελούνται παράλληλα). Εάν ορίσετε την τιμή σε false, κάτι που είναι εξαιρετικά ανεπιθύμητο, το αίτημα θα εκτελεστεί ως σύγχρονο (Άλλες ενέργειες του προγράμματος περιήγησης ενδέχεται να αποκλειστούν κατά την εκτέλεση του σύγχρονου αιτήματος. Και γενικά το πρόγραμμα περιήγησης μπορεί να σταματήσει να αντιδρά και να αποκρίνεται).
beforeSend(XHR) – (συνάρτηση) Μια συνάρτηση που καλείται πριν από την αποστολή ενός αιτήματος. Χρησιμοποιείται για τον ορισμό πρόσθετων (προσαρμοσμένων) κεφαλίδων ή για την εκτέλεση άλλων προκαταρκτικών λειτουργιών. Αποστέλλεται μια παρουσία του αντικειμένου XHR (XMLHttpRequest) ως το μοναδικό του όρισμα. Εάν η συνάρτηση επιστρέψει false, το αίτημα ακυρώνεται.
cache – (boolean - λογική τιμή) Εάν είναι false, τότε οι σελίδες που ζητήθηκαν δεν αποθηκεύονται προσωρινά από το πρόγραμμα περιήγησης. (Το πρόγραμμα περιήγησης μπορεί να εμφανίζει αποτελέσματα από τη μνήμη cache. Για παράδειγμα, όταν τα δεδομένα στον διακομιστή απόκριση σε ένα αίτημα Ajax είναι πάντα νέα, η προσωρινή αποθήκευση παρεμβαίνει). Από προεπιλογή ισχύει για τύπους δεδομένων κειμένου, xml, html, json. Για τύπους δεδομένων "script" και "jsonp" η προεπιλεγμένη τιμή είναι false.
πλήρης (XHR, textStatus ) – (συνάρτηση) Μια συνάρτηση που καλείται στο τέλος της αίτησης, ανεξάρτητα από την επιτυχία ή την αποτυχία της (και μετά τις συναρτήσεις επιτυχίας και σφάλματος, εάν έχουν καθοριστεί). Η συνάρτηση παίρνει δύο ορίσματα: μια παρουσία του αντικειμένου XHR (XMLHttpRequest) και μια συμβολοσειρά που υποδεικνύει την κατάσταση "επιτυχίας" ή "σφάλματος" (σύμφωνα με τον κωδικό κατάστασης στην απάντηση στο αίτημα).
contentType – (string) Ο τύπος περιεχομένου στο αίτημα (κατά την αποστολή δεδομένων στον διακομιστή). Οι προεπιλογές είναι "application/x-www-form-urlencoded" (κατάλληλο για τις περισσότερες περιπτώσεις και είναι επίσης η προεπιλογή για τις υποβολές φορμών).
πλαίσιο – (αντικείμενο) Αυτό το αντικείμενο θα γίνει το πλαίσιο (αυτό) για όλες τις συναρτήσεις επανάκλησης που σχετίζονται με αυτό το αίτημα Ajax (για παράδειγμα, για τις συναρτήσεις επιτυχίας ή σφάλματος).
$.ajax(( url: "test.html",
πλαίσιο: έγγραφο.σώμα,
επιτυχία: λειτουργία())(
$(this).addClass("ολοκληρώθηκε");
}});δεδομένα – (συμβολοσειρά | αντικείμενο) Δεδομένα που αποστέλλονται με το αίτημα στον διακομιστή. Μετατρέπονται σε μια συμβολοσειρά ερωτήματος και από προεπιλογή κωδικοποιούνται σε μια μορφή που μοιάζει με URL (η παράμετρος processData είναι υπεύθυνη για την αυτόματη κωδικοποίηση στη μορφή URL).
Η συμβολοσειρά προσαρτάται στη συμβολοσειρά ερωτήματος διεύθυνσης URL εάν το αίτημα υποβληθεί χρησιμοποιώντας τη μέθοδο GET. Εάν το αίτημα εκτελείται χρησιμοποιώντας τη μέθοδο POST, τότε τα δεδομένα μεταδίδονται στο σώμα του αιτήματος.
Εάν η δεδομένη παράμετρος είναι ένα αντικείμενο ως σύνολο ζευγών ιδιοτήτων_όνομα/τιμής και η τιμή είναι ένας πίνακας, τότε το jQuery σειριοποιεί το αντικείμενο σε μια ακολουθία πολλαπλών τιμών με το ίδιο κλειδί.
Για παράδειγμα, (Foo: ["bar1", "bar2"])θα γίνει "&Foo=bar1&Foo=bar2" .
dataFilter(data, type) – (συνάρτηση) Μια συνάρτηση που καλείται εάν το αίτημα είναι επιτυχές και χρησιμοποιείται για την επεξεργασία των δεδομένων που λαμβάνονται στην απάντηση του διακομιστή στο αίτημα. Επιστρέφει τα δεδομένα που υποβλήθηκαν σε επεξεργασία σύμφωνα με την παράμετρο "dataType" και τα μεταβιβάζει στη συνάρτηση επιτυχίας. Τα δεδομένα του κειμένου και των τύπων xml μεταβιβάζονται χωρίς άμεση επεξεργασία στη συνάρτηση επιτυχίας μέσω της ιδιότητας answerText ή answerHTML του αντικειμένου XMLHttpRequest. Η συνάρτηση dataFilter παίρνει δύο ορίσματα:
- δεδομένα - ληφθέντα δεδομένα (σώμα απόκρισης διακομιστή),
- type - ο τύπος αυτών των δεδομένων (παράμετρος "dataType").
dataType – (string) Μια συμβολοσειρά που ορίζει το όνομα του τύπου δεδομένων που αναμένεται στην απόκριση διακομιστή. Εάν ο τύπος δεδομένων δεν έχει καθοριστεί, το ίδιο το jQuery προσπαθεί να τον προσδιορίσει, με βάση τον τύπο MIME της απόκρισης διακομιστή. Έγκυρες τιμές: "xml", "html", "script", "json", "jsonp", "text". (Αυτό είναι απαραίτητο για τον καθορισμό μιας μεθόδου επεξεργασίας των δεδομένων που λαμβάνονται στην απόκριση αιτήματος από τη συνάρτηση dataFilter πριν μεταφερθούν στη συνάρτηση επανάκλησης επιτυχίας.)
error(XHR, textStatus, errorThrown) – (συνάρτηση) Μια συνάρτηση που καλείται όταν το αίτημα αποτύχει (αν ο κωδικός κατάστασης στην απόκριση διακομιστή υποδεικνύει σφάλμα). Στη συνάρτηση μεταβιβάζονται τρία ορίσματα:
- XHR - μια παρουσία του αντικειμένου XMLHttpRequest,
- textStatus - μια συμβολοσειρά που περιγράφει τον τύπο του σφάλματος που παρουσιάστηκε ("timeout", "error", "notmodified" ή "parsererror"),
- errorThrown - προαιρετική παράμετρος - αντικείμενο εξαίρεσης, εάν υπάρχει (επιστρέφεται από μια παρουσία του αντικειμένου XHR).
καθολική – (boolean - λογική τιμή) Προεπιλογές σε true (επιτρέπει την κλήση διεκπεραιωτών καθολικών συμβάντων σε διάφορα στάδια ενός αιτήματος Ajax, για παράδειγμα, τις λειτουργίες ajaxStart ή ajaxStop). Η τιμή έχει οριστεί σε false για να αποτρέψει την πυροδότηση τους. (Χρησιμοποιείται για τη διαχείριση συμβάντων Ajax).
ifModified – (boolean - boolean value) Εάν οριστεί σε true, τότε το αίτημα θεωρείται επιτυχές μόνο εάν τα δεδομένα στην απόκριση έχουν αλλάξει από το τελευταίο αίτημα (το jQuery καθορίζει εάν ένα στοιχείο στη μνήμη cache του προγράμματος περιήγησης ταιριάζει με αυτό που υπάρχει στον διακομιστή ελέγχοντας η κεφαλίδα "Τελευταία τροποποίηση" με την ημερομηνία της τελευταίας τροποποίησης του περιεχομένου και στο jQuery 1.4 ελέγχεται επίσης η κεφαλίδα "Etag" - μια συμβολοσειρά με την έκδοση του στοιχείου). Η προεπιλεγμένη τιμή είναι false, δηλ. Η επιτυχία του αιτήματος δεν εξαρτάται από κεφαλίδες ή αλλαγές στην απάντηση.
jsonp – (συμβολοσειρά) Αντικαθιστά το όνομα της συνάρτησης επανάκλησης για ένα αίτημα jsonp μεταξύ τομέων. Αντικαθιστά τη λέξη-κλειδί επιστροφής κλήσης στο τμήμα "callback=?" μια συμβολοσειρά αιτήματος GET (που επισυνάπτεται στη διεύθυνση URL) ή αποστέλλεται στο σώμα αιτήματος όταν αποστέλλεται χρησιμοποιώντας τη μέθοδο POST. Από προεπιλογή, το jQuery δημιουργεί αυτόματα ένα μοναδικό όνομα για τη λειτουργία επανάκλησης.
jsonpCallback – (string) Καθορίζει το όνομα της συνάρτησης επανάκλησης για το αίτημα jsonp. Αυτή η τιμή θα χρησιμοποιηθεί αντί για το τυχαίο όνομα που δημιουργείται αυτόματα από τη βιβλιοθήκη jQuery. Η χρήση αυτής της παραμέτρου σάς επιτρέπει να αποφύγετε την προσωρινή αποθήκευση των αιτημάτων GET στο πρόγραμμα περιήγησης. Συνιστάται να επιτρέπεται στο jQuery να δημιουργεί ένα νέο όνομα για κάθε νέο αίτημα μεταξύ τομέων προς τον διακομιστή για ευκολία διαχείρισης αιτημάτων και απόκρισης.
κωδικός πρόσβασης – (string) Ο κωδικός πρόσβασης που θα χρησιμοποιηθεί ως απόκριση σε ένα αίτημα ελέγχου ταυτότητας HTTP στον διακομιστή.
processData – (boolean) Οι προεπιλογές σε true και τα δεδομένα που μεταβιβάζονται στον διακομιστή στην παράμετρο δεδομένων μετατρέπονται σε μια συμβολοσειρά ερωτήματος με τύπο περιεχομένου "Application/X-WWW-forms-urlencoded" και κωδικοποιούνται. Εάν αυτή η επεξεργασία δεν είναι επιθυμητή (όταν πρέπει να σταλούν άλλα δεδομένα στον διακομιστή, όπως ένα αντικείμενο DOMDocument ή xml), τότε μπορεί να παρακαμφθεί ορίζοντας αυτήν την παράμετρο σε false.
scriptCharset – (string) Κατά την εκτέλεση αιτημάτων GET και αιτημάτων που στοχεύουν δεδομένα "jsonp" ή "script", καθορίζει την κωδικοποίηση χαρακτήρων αιτήματος (για παράδειγμα, "UTF-8" ή "CP1251"). Χρήσιμο για διαφορές μεταξύ κωδικοποιήσεων πελάτη και διακομιστή.
success(data, textStatus, XHR ) – (συνάρτηση) Μια συνάρτηση που καλείται μετά από ένα επιτυχημένο αίτημα (εάν ο κωδικός κατάστασης στην απάντηση στο αίτημα υποδεικνύει επιτυχία). Στη συνάρτηση μεταβιβάζονται τρία ορίσματα:
- δεδομένα - δεδομένα που επιστρέφονται από τον διακομιστή στην απόκριση, προεπεξεργασμένα από τη συνάρτηση dataFilter σύμφωνα με την τιμή της παραμέτρου dataType,
- textStatus - μια συμβολοσειρά με κωδικό κατάστασης που υποδεικνύει επιτυχία,
- Το XHR είναι μια παρουσία του αντικειμένου XMLHttpRequest.
timeout – (αριθμός) Ορίζει το μέγιστο χρόνο αναμονής για μια απάντηση διακομιστή σε χιλιοστά του δευτερολέπτου. Προηγείται της ρύθμισης καθολικού ορίου χρονικού ορίου μέσω $.AjaxSetup. Εάν ξεπεραστεί το όριο χρονικού ορίου, το αίτημα ματαιώνεται και καλείται το σφάλμα λειτουργίας χειρισμού σφαλμάτων (εάν έχει εγκατασταθεί). Αυτό μπορεί να χρησιμοποιηθεί, για παράδειγμα, για να εκχωρήσετε σε ένα συγκεκριμένο αίτημα μεγαλύτερο χρονικό όριο από το χρονικό όριο που έχει οριστεί για όλα τα αιτήματα.
Παραδοσιακό – (boolean) Πρέπει να οριστεί σε true για να χρησιμοποιείται η παραδοσιακή (απλοποιημένη) σειριοποίηση δεδομένων κατά την αποστολή (χωρίς αναδρομική μετατροπή σε μια σειρά αντικειμένων ή πινάκων που μοιάζει με URL που είναι ένθετα μέσα σε άλλους πίνακες ή αντικείμενα).
type – (string) Μέθοδος HTTP για τη μετάδοση δεδομένων κατά την εκτέλεση μιας αίτησης. Από προεπιλογή, τα δεδομένα μεταφέρονται χρησιμοποιώντας τη μέθοδο GET. Συνήθως χρησιμοποιούνται GET ή POST. Μπορείτε επίσης να χρησιμοποιήσετε τις μεθόδους PUT και DELETE, αλλά αυτό δεν συνιστάται λόγω του γεγονότος ότι δεν υποστηρίζονται από όλα τα προγράμματα περιήγησης.
url – (string) Μια συμβολοσειρά που περιέχει τη διεύθυνση URL στην οποία αποστέλλεται το αίτημα. Από προεπιλογή αυτή είναι η τρέχουσα σελίδα.
όνομα χρήστη – (string) Όνομα χρήστη που θα χρησιμοποιηθεί για την εξουσιοδότηση HTTP στον διακομιστή.
xhr – (συνάρτηση) Μια συνάρτηση που καλείται να δημιουργήσει ένα αντικείμενο XMLHttpRequest. Από προεπιλογή, η δημιουργία ενός αντικειμένου XHR υλοποιείται μέσω του ActiveXObject στο πρόγραμμα περιήγησης IE ή μέσω του ενσωματωμένου αντικειμένου τύπου XMLHttpRequest σε άλλες περιπτώσεις.
επιλογές – (αντικείμενο) Ένα αντικείμενο με τη μορφή ενός συνόλου ιδιοτήτων (κλειδί: ζεύγη "τιμής") που καθορίζουν παραμέτρους για ένα αίτημα Ajax. Υπάρχουν πολλές πιθανές παράμετροι (ιδιότητες του αντικειμένου επιλογών) και συνήθως στις περισσότερες περιπτώσεις δεν χρησιμοποιούνται όλες, αλλά μόνο μερικές από αυτές. Επιπλέον, όλες αυτές οι παράμετροι είναι προαιρετικές, γιατί Η τιμή οποιουδήποτε από αυτά μπορεί να οριστεί ως προεπιλογή χρησιμοποιώντας τη μέθοδο $.ajaxSetup().
Οι ακόλουθες ιδιότητες του αντικειμένου επιλογών είναι διαθέσιμες για τη διαμόρφωση ενός αιτήματος Ajax:
2 Δεκεμβρίου 2016
Κάποτε έγραψα ένα άρθρο σχετικά με τον τρόπο δημιουργίας ενσωματωμένων γραφικών στοιχείων χρησιμοποιώντας εγγενή javascript και php. Και όλα θα ήταν καλά, αλλά ένα σημείο δεν θίχτηκε. Μπορείτε να χρησιμοποιήσετε τέτοια γραφικά στοιχεία στον δικό σας ιστότοπο, αλλά είναι πιο ενδιαφέρον να τα δημιουργήσετε για πόρους τρίτων. Αλλά σε αυτήν την περίπτωση, το πρόγραμμα περιήγησης πρέπει να φορτώσει τα απαραίτητα δεδομένα από άλλο τομέα - αυτά είναι αιτήματα Ajax μεταξύ τομέων.
Από την άποψη των προγραμματιστών front-end, τα ερωτήματα μεταξύ τομέων δεν διαφέρουν από τα κανονικά. Αλλά στο backend υπάρχει μια διαφορά. Γιατί δεν είναι όλα τόσο απλά με αυτά και πώς να τα εφαρμόσετε - διαβάστε για αυτό στο άρθρο.
Προσπάθεια λήψης δεδομένων από άλλο τομέαΓια απλότητα, ας δούμε τα αιτήματα λήψης. Ας υποθέσουμε ότι υπάρχει ένα συγκεκριμένο αρχείο html στον διακομιστή, το οποίο πρέπει να φορτώσουμε με ajax από άλλο τομέα..html. Ανοίξτε το και βεβαιωθείτε ότι είναι πραγματικά διαθέσιμο - (θα ανοίξει σε νέα καρτέλα). Αυτό είναι ένα κανονικό div με το κείμενο "περιεχόμενο από το template.html".
Τώρα ας πάρουμε αυτό το HTML χρησιμοποιώντας το Ajax απευθείας από την κονσόλα του προγράμματος περιήγησης.
Ας μην ασχοληθούμε με το native javascript, αλλά εκτελέστε το αίτημα χρησιμοποιώντας jQuery.get() και εξάγετε στην κονσόλα αυτό που λάβαμε ως απάντηση από τον διακομιστή.
$..html", function(response) (console.log(response)));
Ανοίξτε τα εργαλεία προγραμματιστή στο πρόγραμμα περιήγησής σας αυτήν τη στιγμή και εκτελέστε αυτό το αίτημα στην καρτέλα της κονσόλας.
Θα δείτε κάτι τέτοιο
Όλα είναι υπέροχα, στείλαμε ένα αίτημα και λάβαμε απάντηση. Φαίνεται, τι θα μπορούσε να είναι πιο απλό; Τώρα μεταβείτε σε οποιοδήποτε άλλο ιστότοπο όπου το jQuery είναι ενεργοποιημένο και προσπαθήστε να κάνετε το ίδιο. Απλώς όχι σε ιστότοπο https, θα μάθετε γιατί στο τέλος του άρθρου.
Για παράδειγμα, έλεγξα αιτήματα στον ποδοσφαιρικό ιστότοπο bombardir.ru. Και την ίδια στιγμή έμεινα έκπληκτος με το είδος της βλακείας που δεν πέφτει στην κονσόλα ακόμη και σε τόσο γνωστούς ιστότοπους. Ωστόσο, δεν είναι αυτό που μιλάμε.
Εκτελέστε ένα αίτημα από άλλο τομέα και θα δείτε μια όχι και τόσο ευχάριστη εικόνα στην κονσόλα. Λέει ότι είναι αδύνατο να φορτωθεί, δεν υπάρχουν δεδομένα και είναι γενικά λυπηρό.
Αν ανοίξετε την καρτέλα Δίκτυο και βρείτε το αντίστοιχο αίτημα εκεί, θα δείτε ότι ο διακομιστής μας επέστρεψε ακόμη και 200 ΟΚ 
Όμως λείπει το περιεχόμενο του αρχείου. Ποιά είναι η παγίδα?
Το αλίευμα είναι ότι η πολιτική του Διαδικτύου δεν επιτρέπει στα προγράμματα περιήγησης να αντλούν δεδομένα από οποιονδήποτε πόρο. Εκτός από τις περιπτώσεις που οι ίδιοι οι πόροι ενδιαφέρονται για τη διανομή συγκεκριμένων δεδομένων.
Αυτή είναι η περίπτωσή μας. Για να δώσετε άδεια χρήσης ενός αρχείου html από οπουδήποτε, όταν ζητάτε αυτό το αρχείο, πρέπει να στείλετε την κεφαλίδα Access-Control-Allow-Origin http: *
Τώρα το ερώτημα είναι πώς να το κάνουμε αυτό. Εάν εσείς (ή οι διαχειριστές) έχετε πρόσβαση στο nginx, τότε ένας τρόπος θα ήταν να διαμορφώσετε την προώθηση αυτής της κεφαλίδας χρησιμοποιώντας τον διακομιστή ιστού. Πηγαίνετε στους διαχειριστές με ένα αντίστοιχο αίτημα ή γκουγκλάρετε τις απαραίτητες ρυθμίσεις για τον web server σας.
Εάν αυτή η πρόσβαση δεν είναι διαθέσιμη, όπως για παράδειγμα, σχεδόν οποιοσδήποτε πάροχος φιλοξενίας έχει μια φθηνή χρέωση, τότε πρέπει να βγείτε μόνοι σας. Και εδώ είναι που η php έρχεται στη διάσωση. Η ιδέα είναι να βάλουμε την html μας σε ένα αρχείο php, το οποίο θα εισάγει την κεφαλίδα και θα επιστρέψει το απαιτούμενο περιεχόμενο.
Θα αποδειχθεί έτσι, δημιουργήστε ένα αρχείο template.php και γράψτε την εντολή php στην πρώτη γραμμή
Header("Access-Control-Allow-Origin: *");
Περιεχόμενο από template.php
Δηλαδή, τα περιεχόμενα του template.php θα είναι έτσι, μην ξεχνάτε τις ερωτήσεις και τις αγκύλες PHP 
Το αρχείο έχει δημιουργηθεί στο webdevkin και βρίσκεται (θα ανοίξει σε νέα καρτέλα). Ας προσπαθήσουμε τώρα να το ζητήσουμε από άλλο τομέα και να δούμε τι θα συμβεί
$..php", function(response) (console.log(response)));
Όπως μπορείτε να δείτε, όλα λειτουργούν καλά - το αρχείο έχει φορτωθεί! 
Ας δούμε την καρτέλα Δίκτυο.
Λάβετε υπόψη ότι η κεφαλίδα Access-Control-Allow-Origin που μας ενδιαφέρει έχει εμφανιστεί στο μπλοκ Κεφαλίδες απόκρισης: * 
Σε γενικές γραμμές, το άρθρο έχει τελειώσει. Το μόνο που μένει είναι να μαζέψω τις σκέψεις μου και να προσθέσω λίγες περισσότερες πληροφορίες.
Συνοψίζοντας και συνοψίζοντας- 1. Δεν μπορείτε απλώς να ζητήσετε πόρους από άλλο τομέα με τον Ajax
- 2. Στείλτε μια κεφαλίδα Access-Control-Allow-Origin για όλους τους πόρους στους οποίους πρέπει να έχετε πρόσβαση από οπουδήποτε
- 3. Κάντε το χρησιμοποιώντας έναν διακομιστή web ή php
- 4. Στην php, αυτή η κεφαλίδα αποστέλλεται με την κεφαλίδα εντολής ("Access-Control-Allow-Origin: *")
- 5. Access-Control-Allow-Origin: * - επιτρέπεται η πρόσβαση σε όλους τους τομείς, Access-Control-Allow-Origin: site.ru - μόνο ο τομέας site.ru
- 6. Το Access-Control-Allow-Origin αποστέλλεται στην αρχή του αρχείου php, ακόμη και πριν από την έξοδο άλλων δεδομένων (καθώς και οποιεσδήποτε άλλες κεφαλίδες http)
- 7. Το "Resource" δεν είναι μόνο ένα αρχείο με σήμανση html, αλλά και οποιαδήποτε διεύθυνση url στην οποία πηγαίνει ένα αίτημα ajax, για παράδειγμα, λήψη δεδομένων json ή μια αίτηση ανάρτησης για την προσθήκη μιας σειράς σε έναν πίνακα βάσης δεδομένων
Και το τελευταίο, το έβγαλα ξεχωριστά. Δεν ήταν μάταια που ζήτησα να εκτελέσω αιτήματα από τον ιστότοπο http. Με το https δεν θα είναι δυνατή η φόρτωση δεδομένων από το http για άλλο λόγο - μικτό περιεχόμενο. Ωστόσο, ο ιστότοπος εξακολουθεί να είναι ιστότοπος http (ενημερώθηκε: δεν είναι πλέον διαθέσιμος, μεταφέρθηκε ο ιστότοπος στο https)
Αυτό θα δείτε στην κονσόλα αν προσπαθήσετε να εκτελέσετε το ίδιο αίτημα από οποιονδήποτε ιστότοπο https. Επομένως, εάν πρόκειται να κάνετε ενσωματωμένα widget ή κάτι παρόμοιο, πρέπει οπωσδήποτε να εγκαταστήσετε ένα πιστοποιητικό SSL στον ιστότοπό σας.
Μερικές φορές χρειάζεται να στείλετε ένα αίτημα Ajax σε άλλο τομέα για να φορτώσετε δυναμικά δεδομένα από εκεί. Ωστόσο, ο ajax δεν το επιτρέπει για λόγους ασφαλείας. Αλλά σε αυτό το άρθρο θα δείξω πώς μπορεί να παρακαμφθεί αυτός ο περιορισμός.
Η βάση είναι ότι παρόλο που ο ajax δεν σας επιτρέπει να στείλετε ένα αίτημα σε άλλο τομέα, η PHP σας επιτρέπει να στείλετε οτιδήποτε και οπουδήποτε. Άρα, ο αλγόριθμος είναι ο εξής:
Εδώ είναι ένας απλός αλγόριθμος. Ας το εφαρμόσουμε γρήγορα. Λοιπόν, αμέσως ajax:
/* Αυτή η συνάρτηση δημιουργεί ένα αντικείμενο XMLHTTP μεταξύ του προγράμματος περιήγησης */
συνάρτηση getXmlHttp() (
var xmlhttp;
δοκιμάστε (
xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
) πιάσε (ε) (
δοκιμάστε (
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
) πιάσε (Ε) (
xmlhttp = false;
}
}
εάν (!xmlhttp && typeof XMLHttpRequest!="undefined") (
xmlhttp = new XMLHttpRequest();
}
επιστροφή xmlhttp;
}
συνάρτηση αποστολή() (
var xmlhttp = getXmlHttp(); // Δημιουργία αντικειμένου XMLHTTP
xmlhttp.open("POST", "test.php", true); // Ανοίξτε μια ασύγχρονη σύνδεση
xmlhttp.setRequestHeader("Content-Type", "application/x-www-form-urlencoded"); // Αποστολή κωδικοποίησης
xmlhttp.send("site=" + encodeURIcomponent("http://ya.ru/?a=5")); // Αποστολή αιτήματος POST
xmlhttp.onreadystatechange = function() ( // Αναμονή για απάντηση από τον διακομιστή
if (xmlhttp.readyState == 4) ( // Έφτασε η απάντηση
if(xmlhttp.status == 200) ( // Ο διακομιστής επέστρεψε τον κωδικό 200 (που είναι καλό)
document.getElementById("yandex").innerHTML = xmlhttp.responseText; // Εκτυπώστε την απόκριση διακομιστή
}
}
};
}
Και τώρα το αρχείο test.php, το οποίο είναι υπεύθυνο για την αποστολή ενός αιτήματος σε άλλο τομέα:
Αυτό ήταν, τώρα όταν κάνετε κλικ στο κουμπί "Αποστολή", θα ανοίξει η σελίδα "http://ya.ru/?a=5". Όπως μπορείτε να δείτε, η αποστολή ενός αιτήματος Ajax σε άλλο τομέα δεν είναι δύσκολη.
Μέθοδος HTTP για τη μετάδοση δεδομένων κατά την εκτέλεση ενός αιτήματος. Συνήθως χρησιμοποιούνται GET ή POST. Μπορείτε επίσης να χρησιμοποιήσετε τις μεθόδους PUT και DELETE, αλλά αυτό δεν συνιστάται λόγω του γεγονότος ότι δεν υποστηρίζονται από όλα τα προγράμματα περιήγησης.
$.ajax(( //... type: "POST", //... ));
$.ajax(( //... url: "/path/to/script", //... ));
Τα δεδομένα αποστέλλονται με αίτημα στον διακομιστή. Μετατρέπονται σε μια συμβολοσειρά ερωτήματος και, από προεπιλογή, κωδικοποιούνται απαραίτητα σε μορφή που μοιάζει με URL (η παράμετρος είναι υπεύθυνη για την αυτόματη κωδικοποίηση στη μορφή URL).
Η συμβολοσειρά προσαρτάται στη συμβολοσειρά ερωτήματος διεύθυνσης URL εάν το αίτημα υποβληθεί χρησιμοποιώντας τη μέθοδο GET. Εάν το αίτημα εκτελείται χρησιμοποιώντας τη μέθοδο POST, τότε τα δεδομένα μεταδίδονται στο σώμα του αιτήματος.
$.ajax(( //... δεδομένα: "value1=1&value2=2&value3=3", //... ));
Εάν η δεδομένη παράμετρος είναι ένα αντικείμενο ως σύνολο ζευγών ιδιοτήτων_όνομα/τιμής και η τιμή είναι ένας πίνακας, τότε το jQuery σειριοποιεί το αντικείμενο σε μια ακολουθία πολλαπλών τιμών με το ίδιο κλειδί.
(Foo: ["bar1", "bar2"])
&Foo=bar1&Foo=bar2
Σημαία για την εκτέλεση ασύγχρονων αιτημάτων.
$.ajax(( //... async: false, //... ));
Σημαία αποθήκευσης απόκρισης.
Οι προεπιλογές είναι true για τύπους δεδομένων κειμένου, xml, html, json. Για τύπους δεδομένων script και jsonp η προεπιλεγμένη τιμή είναι false .
Εάν οριστεί σε true , το αίτημα θεωρείται επιτυχές μόνο εάν τα δεδομένα στην απάντηση έχουν αλλάξει από το τελευταίο αίτημα (το jQuery καθορίζει εάν ένα στοιχείο στη μνήμη cache του προγράμματος περιήγησης ταιριάζει με αυτό που υπάρχει στο διακομιστή, ελέγχοντας την κεφαλίδα Τελευταία Τροποποίηση με την ημερομηνία τις τελευταίες τροποποιήσεις περιεχομένου και στο jQuery 1.4 ελέγχεται επίσης η κεφαλίδα Etag - μια συμβολοσειρά με την έκδοση του στοιχείου). Η προεπιλεγμένη τιμή είναι false, δηλ. Η επιτυχία του αιτήματος δεν εξαρτάται από κεφαλίδες ή αλλαγές στην απάντηση.
Όνομα χρήστη που θα χρησιμοποιηθεί για την εξουσιοδότηση HTTP στον διακομιστή.
Τα δεδομένα που διαβιβάζονται στον διακομιστή στην παράμετρο μετατρέπονται σε μια συμβολοσειρά ερωτήματος με τον τύπο περιεχομένου Application/X-WWW-forms-urlencoded και κωδικοποιημένο. Εάν αυτή η επεξεργασία δεν είναι επιθυμητή (όταν πρέπει να σταλούν άλλα δεδομένα στον διακομιστή, όπως ένα αντικείμενο DOMDocument ή xml), τότε μπορεί να παρακαμφθεί ορίζοντας αυτήν την παράμετρο σε false .
Κατά την εκτέλεση αιτημάτων GET και αιτημάτων που στοχεύουν δεδομένα jsonp ή script, καθορίζει την κωδικοποίηση χαρακτήρων αιτήματος (για παράδειγμα, UTF-8 ή CP1251). Χρήσιμο για διαφορές μεταξύ κωδικοποιήσεων πελάτη και διακομιστή.
Ορίζει το μέγιστο χρόνο αναμονής για μια απάντηση διακομιστή σε χιλιοστά του δευτερολέπτου. Προηγείται της ρύθμισης του καθολικού ορίου χρονικού ορίου μέσω $.AjaxSetup. Εάν ξεπεραστεί το όριο χρονικού ορίου, το αίτημα ματαιώνεται και καλείται το σφάλμα λειτουργίας χειρισμού σφαλμάτων (εάν έχει εγκατασταθεί).
| λάθος | XHR, textStatus, errorThrown | Ενεργοποιείται όταν το αίτημα αποτυγχάνει. Στη συνάρτηση μεταβιβάζονται τρία ορίσματα: textStatus - μια συμβολοσειρά που περιγράφει τον τύπο του σφάλματος που προέκυψε (χρονικό όριο, σφάλμα, μη τροποποιημένο ή σφάλμα ανάλυσης) errorThrown - προαιρετική παράμετρος, αντικείμενο εξαίρεσης, εάν υπάρχει (επιστρέφεται από μια παρουσία του αντικειμένου XHR) $.ajax(( //... error: function() ( alert("Error!"), //... )); |
| επιτυχία | δεδομένα, textStatus, XHR | Ενεργοποιείται όταν το αίτημα είναι επιτυχές. Στη συνάρτηση μεταβιβάζονται τρία ορίσματα: δεδομένα - δεδομένα που επιστρέφονται από τον διακομιστή στην απόκριση, προεπεξεργασμένα από τη συνάρτηση dataFilter σύμφωνα με την τιμή της παραμέτρου textStatus - μια συμβολοσειρά με κωδικό κατάστασης που υποδεικνύει επιτυχία XHR - μια παρουσία του αντικειμένου XMLHttpRequest $.ajax(( //... success: function() ( alert("Success!"), //... )); |
| πριν την αποστολή | XHR | Πυρκαγιά πριν σταλεί το αίτημα. Αποστέλλεται μια παρουσία του αντικειμένου XHR (XMLHttpRequest) ως το μοναδικό του όρισμα. Εάν η συνάρτηση επιστρέψει false, τότε το αίτημα ακυρώνεται. $.ajax(( //... beforeSend: function() ( alert("BeforeSend λειτούργησε!"); //... )); |
| πλήρης | XHR, κατάσταση κειμένου | Πυροδοτεί στο τέλος του αιτήματος, ανεξάρτητα από την επιτυχία ή την αποτυχία του (και επίσης μετά τις λειτουργίες και, εάν καθορίζονται). Η συνάρτηση παίρνει δύο ορίσματα: μια παρουσία του αντικειμένου XHR (XMLHttpRequest) και μια συμβολοσειρά που υποδεικνύει την κατάσταση επιτυχίας ή σφάλματος (σύμφωνα με τον κωδικό κατάστασης στην απόκριση αιτήματος) |
Αναλυτικό παράδειγμα:
συνάρτηση testAjax(id, pid) ( $.ajax(( type: "POST", data: "id=" + id + "&pid=" + pid, url: "/path/to/script/test.php", επιτυχία: function(data) ( var obj = $.parseJSON(data); //Μετατροπή του json της απάντησης διακομιστή if (obj.error == 0) ( alert("Το αίτημα ήταν επιτυχές"); ) else (ειδοποίηση (obj.error ) ));
Αίτημα με σφάλμα
Σενάριο PHP (test.php):
Ένα άλλο παράδειγμα με διαφορετική έξοδο απόκρισης:
συνάρτηση testAjax(id, pid) ( $.ajax(( type: "POST", data: "id=" + id + "&pid=" + pid, url: "/path/to/script/test.php", επιτυχία: function(data) ( $("#content").html(data); ) ) return true;
Αίτημα με σφάλμα
Απάντηση:
Σενάριο PHP (test.php):
Περισσότερες πληροφορίες μπορείτε να βρείτε στο: http://api.jquery.com/jquery.ajax/
