Ich werde eine einfachere Antwort versuchen:
Erklärung des Problems
Lassen Sie uns zunächst den Ereignisfluss verstehen, wenn eine Seite von unserem Server bereitgestellt wird:
- Zuerst wird PHP ausgeführt, es generiert den HTML-Code, der dem Client bereitgestellt wird.
- Dann wird der HTML-Code an den Client geliefert. Nachdem PHP damit fertig ist, möchte ich betonen, dass PHP damit fertig ist und nicht mehr darauf zugreifen kann, sobald der Code den Server verlässt.
- Dann erreicht der HTML-Code mit JavaScript den Client, der JavaScript für diesen HTML-Code ausführen kann.
Das Wichtigste dabei ist, dass HTTP zustandslos ist . Sobald eine Anfrage den Server verlassen hat, kann der Server sie nicht mehr berühren. Damit haben wir folgende Möglichkeiten:
- Senden Sie weitere Anfragen vom Client, nachdem die erste Anfrage abgeschlossen wurde.
- Codieren Sie, was der Server in der ersten Anfrage zu sagen hatte.
Lösungen
Das ist die Kernfrage, die Sie sich stellen sollten:
Schreibe ich eine Website oder eine Bewerbung?
Websites sind hauptsächlich seitenbasiert und die Ladezeiten der Seiten müssen so schnell wie möglich sein (z. B. Wikipedia). Webanwendungen sind AJAX-schwerer und führen viele Roundtrips durch, um dem Kunden schnelle Informationen zukommen zu lassen (z. B. ein Aktien-Dashboard).
Webseite
Das Senden weiterer Anforderungen vom Client nach Abschluss der ersten Anforderung ist langsam, da mehr HTTP-Anforderungen mit erheblichem Overhead erforderlich sind. Darüber hinaus ist Asynchronität erforderlich, da für eine AJAX-Anforderung ein Handler erforderlich ist, wenn sie abgeschlossen ist.
Ich würde nicht empfehlen, eine weitere Anfrage zu stellen, es sei denn, Ihre Site ist eine Anwendung zum Abrufen dieser Informationen vom Server.
Sie möchten schnelle Antwortzeiten, die einen großen Einfluss auf die Konvertierungs- und Ladezeiten haben. Das Erstellen von Ajax-Anforderungen ist in diesem Fall für die anfängliche Verfügbarkeit langsam und nicht erforderlich.
Sie haben zwei Möglichkeiten, um das Problem anzugehen
- Setzen Sie ein Cookie - Cookies sind Header, die in HTTP-Anforderungen gesendet werden und die sowohl der Server als auch der Client lesen können.
- Codieren Sie die Variable als JSON - JSON kommt JavaScript-Objekten sehr nahe und die meisten JSON-Objekte sind gültige JavaScript-Variablen.
Das Setzen eines Cookies ist wirklich nicht sehr schwierig. Sie weisen ihm lediglich einen Wert zu:
setcookie("MyCookie", $value); // Sets the cookie to the value, remember, do not
// Set it with HTTP only to true.
Dann können Sie es mit JavaScript lesen, indem Sie document.cookie:
Hier ist ein kurzer handgerollter Parser, aber die Antwort, die ich direkt darüber verlinkt habe, hat besser getestete:
var cookies = document.cookie.split(";").
map(function(el){ return el.split("="); }).
reduce(function(prev,cur){ prev[cur[0]] = cur[1];return prev },{});
cookies["MyCookie"] // Value set with PHP.
Cookies sind gut für ein paar Daten. Dies ist, was Tracking-Dienste oft tun.
Sobald wir mehr Daten haben, können wir sie stattdessen mit JSON in einer JavaScript-Variablen codieren:
<script>
var myServerData = <?=json_encode($value)?>; // Don't forget to sanitize
//server data
</script>
Angenommen, es $valueist json_encodeauf der PHP-Seite möglich (normalerweise). Diese Technik macht Stack Overflow beispielsweise mit seinem Chat (nur mit .NET anstelle von PHP).
Anwendung
Wenn Sie eine Anwendung schreiben, ist die anfängliche Ladezeit plötzlich nicht mehr so wichtig wie die laufende Leistung der Anwendung, und es beginnt sich auszuzahlen, Daten und Code separat zu laden.
Meine Antwort hier erklärt, wie Daten mit AJAX in JavaScript geladen werden:
function callback(data){
// What do I do with the response?
}
var httpRequest = new XMLHttpRequest;
httpRequest.onreadystatechange = function(){
if (httpRequest.readyState === 4) { // Request is done
if (httpRequest.status === 200) { // successfully
callback(httpRequest.responseText); // We're calling our method
}
}
};
httpRequest.open('GET', "/echo/json");
httpRequest.send();
Oder mit jQuery:
$.get("/your/url").done(function(data){
// What do I do with the data?
});
Jetzt muss der Server nur noch eine /your/urlRoute / Datei enthalten, die Code enthält, der die Daten erfasst und etwas damit macht, in Ihrem Fall:
<$php
...
$val = myService->getValue(); // Makes an API and database call
echo json_encode($val); // Write it to the output
$>
Auf diese Weise fragt unsere JavaScript-Datei nach den Daten und zeigt sie an, anstatt nach Code oder Layout zu fragen. Dies ist sauberer und zahlt sich aus, wenn die Anwendung höher wird. Es ist auch eine bessere Trennung von Bedenken und ermöglicht das Testen des clientseitigen Codes ohne serverseitige Technologie, was ein weiteres Plus ist.
Nachtrag: Sie müssen sich der XSS-Angriffsvektoren sehr bewusst sein, wenn Sie etwas von PHP in JavaScript einfügen. Es ist sehr schwer, Werten richtig zu entkommen, und es ist kontextsensitiv. Wenn Sie sich nicht sicher sind, wie Sie mit XSS umgehen sollen, oder wenn Sie sich dessen nicht bewusst sind, lesen Sie bitte diesen OWASP-Artikel , diesen und diese Frage .
myPlugin.start(<?=$val?>beabsichtigt? Stimmt es, dass "das manchmal funktioniert"?