Wie kann JSONP mit jQuery und PHP Cross-Origin-Request-Probleme lösen?

Cross-Origin-Anfragen mit JSONP: Ein einfaches Beispiel für jQuery und PHP

In diesem Beispiel gehen wir die Herausforderung von Cross-Origin-Anfragen an. Ursprungsanfragen mithilfe von JSONP, einer eleganten Technik, die die Kommunikation zwischen JavaScript und Webservern aus verschiedenen Domänen ermöglicht.

Stellen wir uns vor Sie möchten eine Cross-Origin-Anfrage von einem jQuery-Client an einen PHP-Server senden und eine benutzerdefinierte Antwort abrufen. Um dies zu erreichen, verwenden wir die Methode $.getJSON von jQuery, um eine JSONP-Anfrage zu initiieren.

jQuery-Skript:

$.getJSON('http://example.com/jsonp.php?callback=?', 'firstname=Jeff', function(response) {
  alert('Your name is ' + response.fullname);
});

PHP-Server Skript:

<?php $firstname = $_GET['firstname'];
if ($firstname == 'Jeff') {
  header('Content-Type: application/json');
  echo $_GET['callback'] . '(' . json_encode(['fullname' => 'Jeff Hansen']) . ')';
}
?>

Erklärung:

Wenn Sie $.getJSON mit einer URL aufrufen, die „?callback=?“ enthält, verarbeitet jQuery automatisch das JSONP Anfrage. Das serverseitige PHP-Skript antwortet mit einem JSON-Objekt, das in einen Funktionsaufruf eingeschlossen ist, der dem von jQuery bereitgestellten Rückruf entspricht. In diesem Fall wird der Rückruf als erster Parameter in der GET-Anfrage übergeben.

Handhabung von HTML-Antworten:

Wenn Sie HTML in der Antwort zurückgeben möchten , können Sie eine Funktion anstelle eines JSON-Objekts innerhalb des PHP-Skripts verwenden:

<?php $firstname = $_GET['firstname'];
if ($firstname == 'Jeff') {
  header('Content-Type: text/html');
  echo '<h1>Welcome, Jeff Hansen!';
}
?>

Und auf der jQuery-Seite können Sie die Antwort als verarbeiten so:

$.getJSON('http://example.com/jsonp.php?callback=?', 'firstname=Jeff', function(response) {
  $('#container').html(response);
});

Das obige ist der detaillierte Inhalt vonWie kann JSONP mit jQuery und PHP Cross-Origin-Request-Probleme lösen?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!