Ich werde versuchen, eine einfachere Antwort zu geben:
Erklärung des Problems
Zunächst einmal verstehen wir den Ablauf der Ereignisse, wenn eine Seite von unserem Server bereitgestellt wird:
- Zunächst wird PHP ausgeführt, es generiert das HTML, das an den Client übermittelt wird.
- Dann "endet" PHP (d. h. es läuft buchstäblich nicht mehr), wenn dieses HTML an den Client geliefert wird. Ich möchte betonen, dass PHP, sobald der Code den Server verlässt, aufgehört hat, Teil des Seitenladevorgangs zu sein, und der Server keinen Zugriff mehr darauf hat.
- Dann, wenn das HTML mit JavaScript den Client erreicht, kann dieser das JavaScript auf diesem HTML ausführen, vorausgesetzt, es handelt sich um gültiges Javascript.
Also das wirklich Wichtige hier zu merken ist, dass HTTP zustandslos ist. Sobald eine Anfrage den Server verlassen hat, kann der Server nicht mehr darauf zugreifen. Das lässt uns also folgende Optionen:
- Mehr Anfragen vom Client nach der ersten Anfrage senden.
- Die Informationen, die der Server zu übermitteln hatte, in der ersten Anfrage codieren.
Lösungen
Die Kernfrage, die du dir hier stellen solltest, ist:
Schreibe ich eine Website oder eine Anwendung?
Websites sind hauptsächlich seitenbasiert, und die Ladezeiten müssen so schnell wie möglich sein (zum Beispiel – Wikipedia). Webanwendungen sind stärker auf AJAX ausgerichtet und führen viele Abfragen durch, um schnell Informationen für den Client zu erhalten (zum Beispiel – ein Aktiendashboard).
Website
Mehr Anfragen vom Client nach der ersten Anfrage zu senden ist langsam, da es mehr HTTP-Anfragen erfordert, die einen erheblichen Overhead haben. Außerdem erfordert es Asynchronizität, da das Senden einer AJAX-Anfrage einen Handler erfordert, wenn sie abgeschlossen ist.
Ich würde empfehlen, _keine weitere Anfrage zu stellen _es sei denn, deine Seite ist eine Anwendung__, um diese Informationen vom Server zu erhalten.
Du möchtest schnelle Reaktionszeiten, die einen großen Einfluss auf die Konversion und die Ladezeiten haben. Das Senden von AJAX-Anfragen ist in diesem Fall langsam bei der ersten Uptime und unnötig.
Du hast zwei Möglichkeiten, das Problem anzugehen
- Setze ein Cookie – Cookies sind Header, die in HTTP-Anfragen gesendet werden und von Server und Client gelesen werden können.
- Codierte die Variable als JSON - JSON ähnelt sehr JavaScript-Objekten und die meisten JSON-Objekte sind gültige JavaScript-Variablen.
Das Setzen eines Cookies ist wirklich nicht sehr schwer, du weist ihm einfach einen Wert zu:
setcookie("MyCookie", $wert); // Setzt das Cookie auf den Wert, denke daran, setze es nicht auf HTTP Only auf true.
Dann kannst du es mit JavaScript lesen indem du document.cookie verwendest:
Hier ist ein eigenhändiger Parser, aber die Antwort, auf die ich gerade verlinkt habe, hat bessere getestete:
var cookies = document.cookie.split(";").
map(function(el){ return el.split("="); }).
reduce(function(prev,cur){ prev[cur[0]] = cur[1]; return prev },{});
alert(cookies["MyCookie"]); // Wert mit PHP gesetzt.
Cookies sind gut für einige Daten. Das machen Tracking-Services oft.
Sobald wir mehr Daten haben, können wir sie mit JSON in einer JavaScript-Variablen innerhalb kodieren:
var myServerData = <?=json_encode($wert)?>; // Vergiss nicht, den Serverdaten zu säubern
Vorausgesetzt, dass $wert auf der PHP-Seite json_encodefähig ist (das ist es normalerweise). Diese Technik wird zum Beispiel von Stack Overflow in seinem Chat verwendet (nur mit .NET anstelle von PHP).
Anwendung
Wenn du eine Anwendung schreibst - plötzlich ist die anfängliche Ladezeit nicht immer so wichtig wie die fortlaufende Leistung der Anwendung, und es beginnt, sich auszuzahlen, Daten und Code getrennt zu laden.
Meine Antwort hier erklärt, wie man Daten mit AJAX in JavaScript lädt:
function callback(data){
// Was mache ich mit der Antwort?
}
var httpRequest = new XMLHttpRequest;
httpRequest.onreadystatechange = function(){
if (httpRequest.readyState === 4) { // Anfrage ist abgeschlossen
if (httpRequest.status === 200) { // erfolgreich
callback(httpRequest.responseText); // Wir rufen unsere Methode auf
}
}
};
httpRequest.open('GET', "/echo/json");
httpRequest.send();
Oder mit jQuery:
$.get("/deine/url").done(function(data){
// Was mache ich mit den Daten?
});
Jetzt muss der Server nur eine Route/Datei /deine/url enthalten, die Code enthält, der die Daten abruft und etwas damit macht, in deinem Fall:
getValue(); // Macht einen API- und Datenbankaufruf
header("Content-Type: application/json"); // Informiere den Client über den Antworttyp
echo json_encode($val); // Schreibe es in die Ausgabe
Auf diese Weise fordert unsere JavaScript-Datei die Daten an und zeigt sie an, anstatt nach Code oder Layout zu fragen. Das ist sauberer und zahlt sich aus, je höher die Anwendung wird. Es ist auch eine bessere Trennung der Anliegen und ermöglicht es, den Clientseitigen Code ohne Beteiligung einer serverseitigen Technologie zu testen, was ein weiterer Vorteil ist.
Nachtrag: Du musst dich sehr bewusst sein über XSS-Angriffsmöglichkeiten, wenn du etwas von PHP nach JavaScript injizierst. Es ist sehr schwierig, Werte ordnungsgemäß zu escapen, und es ist kontextsensitiv. Wenn du unsicher bist, wie du mit XSS umgehen sollst, oder nichts davon weißt - lies bitte diesen OWASP-Artikel, diesen hier und diese Frage.
