Mit der rasanten Entwicklung des mobilen Internets beginnen immer mehr Websites, Web-APIs zur Bereitstellung von Datendiensten zu verwenden. Wenn wir die Web-API verwenden, um Daten im Front-End abzurufen, verwenden wir normalerweise AJAX, um asynchrone Anforderungen zu stellen. Aufgrund der Einschränkungen der Browser-Richtlinie „Same Origin“ kann AJAX jedoch nur Daten vom Server „Same Origin“ anfordern, was den Umfang der Möglichkeiten des Front-Ends, Daten abzurufen, einschränkt.
Um domänenübergreifende Probleme zu lösen, wurde die JSONP-Technologie entwickelt. Erfahren Sie mehr über die Anwendung von jsonP bei der Front-End-Datenerfassung.
1. JSONP-Prinzip
JSONP (JSON mit Auffüllung) ist eine domänenübergreifende Datenübertragungsmethode, die domänenübergreifende Datenanfragen durchführt und JSON-Daten durch dynamisches Hinzufügen von Skript-Tags erhält. Das Prinzip der Verwendung von JSONP im Front-End lautet wie folgt:
Zunächst initiiert das Front-End eine JSONP-Anfrage an den Server, und die Anfrageadresse ist eine domänenübergreifende Adresse. Die URL der JSONP-Anfrage muss einen Callback-Parameter enthalten. Das Backend generiert die Antwort-JSON-Daten und gibt sie in Form eines Funktionsaufrufs an das Frontend zurück.
Der spezifische Prozess ist in der folgenden Abbildung dargestellt:
2. Der Server antwortet auf die JSONP-Anfrage
Das aktuelle Ende initiiert eine JSONP-Anfrage und der Server muss korrekt auf die Anfrage antworten. Für JSONP-Anfragen muss der Server eine JavaScript-Funktion mit einem angegebenen Namen zurückgeben und die vom Server generierten JSON-Daten aufrufen, wenn die Funktion aufgerufen wird. Das Folgende ist ein Beispiel für eine JSONP-Antwort:
Zusammenfassend muss der Server die folgenden Punkte implementieren:
3. Front-End-Verarbeitung der JSONP-Antwort
Wenn der Server korrekt auf die JSONP-Anfrage antwortet, muss das Front-End die Antwortdaten korrekt verarbeiten. Was das Frontend tun muss, ist wie folgt:
Das Folgende ist ein Beispiel für die JSONP-Verarbeitung:
Abschließend müssen wir noch etwas beachten: Wenn eine JSONP-Anfrage gestellt wird, werden die Antwortdaten in Form von JavaScript zurückgegeben, wenn die zurückgegebenen Daten JavaScript-Anweisungen enthalten , dann ist eine Escape-Verarbeitung erforderlich, andernfalls wirkt sich dies auf die Ausführung des Front-End-Codes aus. Zu den gängigen Escape-Funktionen gehören die Funktion $.parseJSON() von jQuery und die Funktion JSON.parse() von JavaScript.
Fortsetzung folgt...
Das obige ist der detaillierte Inhalt vonPHP JSONP konvertiert JSON-Daten. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!