Je vais essayer une réponse plus simple:
Explication du problème
Tout d'abord, comprenons le flux d'événements lorsqu'une page est servie à partir de notre serveur:
- Tout d'abord PHP est exécuté, il génère le HTML qui est servi au client.
- Ensuite, le code HTML est livré au client, une fois PHP terminé, je voudrais souligner qu'une fois que le code quitte le serveur - PHP en a fini avec lui et ne peut plus y accéder.
- Ensuite, le code HTML avec JavaScript atteint le client, qui peut exécuter JavaScript sur ce code HTML.
Donc, vraiment, l'essentiel à retenir ici est que HTTP est sans état . Une fois qu'une requête a quitté le serveur, le serveur ne peut plus la toucher. Donc, cela laisse nos options pour:
- Envoyez plus de demandes du client une fois la demande initiale terminée.
- Encodez ce que le serveur avait à dire dans la demande initiale.
Solutions
C'est la question centrale que vous devriez vous poser:
Suis-je en train d'écrire un site Web ou une application?
Les sites Web sont principalement basés sur des pages, et les temps de chargement des pages doivent être aussi rapides que possible (par exemple, Wikipedia). Les applications Web sont plus lourdes AJAX et effectuent de nombreux allers-retours pour obtenir rapidement des informations du client (par exemple - un tableau de bord de stock).
Site Internet
L'envoi de plus de demandes du client une fois la demande initiale terminée est lent car il nécessite plus de demandes HTTP qui ont une surcharge importante. De plus, cela nécessite une asynchronisme car faire une requête AJAX nécessite un gestionnaire pour quand elle est terminée.
Je ne recommanderais pas de faire une autre demande à moins que votre site soit une application pour obtenir ces informations du serveur.
Vous voulez des temps de réponse rapides qui ont un impact énorme sur les temps de conversion et de chargement. Faire des requêtes Ajax est lent pour la disponibilité initiale dans ce cas et inutile.
Vous avez deux façons de résoudre le problème
- Définir un cookie - les cookies sont des en-têtes envoyés dans des requêtes HTTP que le serveur et le client peuvent lire.
- Encode la variable en JSON - JSON ressemble très près aux objets JavaScript et la plupart des objets JSON sont des variables JavaScript valides.
Définir un cookie n'est vraiment pas très difficile, il vous suffit de lui attribuer une valeur:
setcookie("MyCookie", $value); // Sets the cookie to the value, remember, do not
// Set it with HTTP only to true.
Ensuite, vous pouvez le lire avec JavaScript en utilisant document.cookie:
Voici un analyseur roulé à la main courte, mais la réponse que j'ai liée juste au-dessus de celle-ci en a de mieux testées:
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.
Les cookies sont bons pour un peu de données. C'est ce que font souvent les services de suivi.
Une fois que nous avons plus de données, nous pouvons les encoder avec JSON dans une variable JavaScript à la place:
<script>
var myServerData = <?=json_encode($value)?>; // Don't forget to sanitize
//server data
</script>
En supposant que $valuec'est json_encodepossible du côté PHP (c'est généralement le cas). Cette technique est ce que fait Stack Overflow avec son chat par exemple (en utilisant uniquement .NET au lieu de PHP).
Application
Si vous écrivez une application - tout à coup, le temps de chargement initial n'est pas toujours aussi important que les performances en cours de l'application, et cela commence à payer pour charger les données et le code séparément.
Ma réponse explique ici comment charger des données à l'aide d'AJAX en JavaScript:
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();
Ou avec jQuery:
$.get("/your/url").done(function(data){
// What do I do with the data?
});
Maintenant, le serveur a juste besoin de contenir une /your/urlroute / un fichier qui contient du code qui saisit les données et fait quelque chose avec, dans votre cas:
<$php
...
$val = myService->getValue(); // Makes an API and database call
echo json_encode($val); // Write it to the output
$>
De cette façon, notre fichier JavaScript demande les données et les affiche plutôt que de demander du code ou une mise en page. C'est plus propre et commence à porter ses fruits à mesure que l'application augmente. C'est également une meilleure séparation des préoccupations et cela permet de tester le code côté client sans aucune technologie côté serveur impliquée, ce qui est un autre avantage.
Postscript: Vous devez être très conscient des vecteurs d'attaque XSS lorsque vous injectez quoi que ce soit de PHP à JavaScript. Il est très difficile d'échapper correctement aux valeurs et il est sensible au contexte. Si vous ne savez pas comment gérer XSS, ou si vous ne le savez pas - veuillez lire cet article OWASP , celui-ci et cette question .
myPlugin.start(<?=$val?>intentionnelle? Est-il vrai que "cela fonctionne parfois"?