Quelle est la différence entre la programmation côté client et côté serveur?

J'ai ce code:

<script type="text/javascript">
    var foo = 'bar';
    <?php
        file_put_contents('foo.txt', ' + foo + ');
    ?>

    var baz = <?php echo 42; ?>;
    alert(baz);
</script>

Pourquoi cela n'écrit-il pas "bar" dans mon fichier texte, mais alerte "42"?

NB: Les révisions antérieures de cette question concernaient explicitement PHP sur le serveur et JavaScript sur le client. La nature essentielle du problème et des solutions est la même pour n'importe quelle paire de langues lorsque l'une s'exécute sur le client et l'autre sur le serveur (même si elles sont la même langue). Veuillez en tenir compte lorsque vous verrez des réponses parler de langues spécifiques.

Votre code est divisé en deux parties entièrement distinctes, le côté serveur et le côté client .

                    |
               ---------->
              HTTP request
                    |
+--------------+    |    +--------------+
|              |    |    |              |
|    browser   |    |    |  web  server |
| (JavaScript) |    |    |  (PHP etc.)  |
|              |    |    |              |
+--------------+    |    +--------------+
                    |
  client side       |      server side
                    |
               <----------
          HTML, CSS, JavaScript
                    |

Les deux parties communiquent via des requêtes et des réponses HTTP. PHP est exécuté sur le serveur et génère du code HTML et peut-être du code JavaScript qui est envoyé en réponse au client où le code HTML est interprété et le code JavaScript est exécuté. Une fois que PHP a terminé la sortie de la réponse, le script se termine et rien ne se passera sur le serveur jusqu'à ce qu'une nouvelle requête HTTP arrive.

L'exemple de code s'exécute comme ceci:

<script type="text/javascript">
    var foo = 'bar';
    <?php
        file_put_contents('foo.txt', ' + foo + ');
    ?>

    var baz = <?php echo 42; ?>;
    alert(baz);
</script>

Étape 1, PHP exécute tout le code entre les <?php ?>balises. Le résultat est le suivant:

<script type="text/javascript">
    var foo = 'bar';

    var baz = 42;
    alert(baz);
</script>

L' file_put_contentsappel n'a abouti à rien, il a juste écrit "+ foo +" dans un fichier. L' <?php echo 42; ?>appel a abouti à la sortie "42", qui est maintenant à l'endroit où se trouvait ce code.

Ce code HTML / JavaScript résultant est maintenant envoyé au client, où il est évalué. L' alertappel fonctionne, tandis que la foovariable n'est utilisée nulle part.

Tout le code PHP est exécuté sur le serveur avant même que le client ne commence à exécuter le code JavaScript. Il n'y a plus de code PHP dans la réponse avec lequel JavaScript pourrait interagir.

Pour appeler du code PHP, le client devra envoyer une nouvelle requête HTTP au serveur. Cela peut se produire en utilisant l'une des trois méthodes possibles:

1. Un lien, qui amène le navigateur à charger une nouvelle page.
2. Une soumission de formulaire, qui soumet des données au serveur et charge une nouvelle page.
3. Une requête AJAX , qui est une technique Javascript pour faire une requête HTTP régulière au serveur (comme 1. et 2. le fera), mais sans quitter la page courante.

Voici une question décrivant ces méthodes plus en détail

Vous pouvez également utiliser JavaScript pour que le navigateur ouvre une nouvelle page en utilisant window.locationou soumettre un formulaire, en émulant les possibilités 1. et 2.

Pour déterminer pourquoi le code PHP ne fonctionne pas dans le code JavaScript , nous devons comprendre ce que sont les langages côté client et côté serveur , et comment ils fonctionnent.

Langages côté serveur (PHP, etc.) : ils récupèrent les enregistrements des bases de données, maintiennent l'état sur la connexion HTTP sans état et font beaucoup de choses qui nécessitent une sécurité. Ils résident sur le serveur, ces programmes n'ont jamais leur code source exposé à l'utilisateur.

_{image attr}

Ainsi, vous pouvez facilement voir que les langages côté serveur gèrent les requêtes HTTP et les traitent, et, comme @deceze l'a dit, PHP est exécuté sur le serveur et génère du code HTML, et peut-être du code JavaScript, qui est envoyé en réponse au client, où le HTML est interprété et JavaScript est exécuté.

D'un autre côté, les langages côté client (comme JavaScript) résident dans le navigateur et s'exécutent dans le navigateur. Les scripts côté client se réfèrent généralement à la classe de programmes informatiques sur le Web qui sont exécutés côté client, par le navigateur Web de l'utilisateur, au lieu du côté serveur .

JavaScript est visible pour l'utilisateur et peut être facilement modifié, donc pour des questions de sécurité, nous ne devons pas compter sur JavaScript.

Ainsi, lorsque vous effectuez une requête HTTP sur le serveur, le serveur lit d'abord attentivement le fichier PHP pour voir s'il y a des tâches à exécuter et envoie une réponse du côté client. Encore une fois, comme l'a dit @deceze, * Une fois que PHP a terminé la sortie de la réponse, le script se termine et rien ne se passera sur le serveur jusqu'à ce qu'une nouvelle requête HTTP arrive. *

_{Source d'image}

Alors maintenant, que puis-je faire si j'ai besoin d'appeler PHP? Cela dépend de la façon dont vous devez le faire: soit en rechargeant la page, soit en utilisant un appel AJAX.

1. Vous pouvez le faire en rechargeant la page et en envoyant une requête HTTP
2. Vous pouvez passer un appel AJAX avec JavaScript - cela ne nécessite pas de recharger la page

Bonne lecture:

1. Wikipédia: scripts côté serveur
2. Wikipédia: script côté client
3. Madara Uchiha: Différence entre la programmation côté client et côté serveur

Votre Javascript s'exécutera sur le client, pas sur le serveur. Cela signifie que foon'est pas évalué côté serveur et que sa valeur ne peut donc pas être écrite dans un fichier sur le serveur.

La meilleure façon de penser à ce processus est comme si vous génériez un fichier texte dynamiquement. Le texte que vous générez ne devient du code exécutable qu'une fois que le navigateur l'a interprété. Seul ce que vous placez entre les <?phpbalises est évalué sur le serveur.

Soit dit en passant, prendre l'habitude d'incorporer des éléments aléatoires de la logique PHP dans HTML ou Javascript peut conduire à un code très compliqué. Je parle d'une expérience douloureuse.

Dans l'application Web, chaque tâche s'exécute d'une manière de demande et de réponse.

La programmation côté client est avec du code html avec un script Java et ses frameworks, les bibliothèques s'exécutent dans les navigateurs Internet Explorer, Mozilla, Chrome. Dans le scénario Java, les servlets de programmation côté serveur s'exécutent dans les serveurs Tomcat, Web-Logic, J Boss et WebSphere.