Understand the difference between client-side and server-side programming

Question

I have this code:

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

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

Why doesn't this write "bar" to my text file, but instead warns "42"?

---

NOTE: An earlier revision of this question explicitly addressed PHP on the server and JavaScript on the client. When one language runs on the client and another on the server (even if they are the same language), the nature of the problem and solution is the same for any language. Consider this when you see answers that talk about a specific language.

Answer 1

To determine why PHP code is not working within JavaScript code, we need to understand what client-side and server-side are What languages ​​are and how they work.

Server-side languages ​​(PHP, etc.) : They retrieve records from the database, connect over stateless HTTP, and perform many operations that require security. They reside on the server and these programs never expose their source code to users.

So you can easily see that the server side language handles the HTTP requests and handles them, and, as @deceze said, PHP executes on the server and outputs some HTML and maybe JavaScript code, which In response to the client, the HTML is interpreted and JavaScript executed.

On the other hand, Client-side languages ​​(such as JavaScript) reside in and run in the browser. Client-side script usually refers to a type of computer program on the network that is executed on the client side by the user's web browser, rather than server-side. p>

JavaScript is visible to the user and can be easily modified, so for security we cannot rely on JavaScript.

So when you make a HTTP request to the server, the server first carefully reads the PHP file to see if there are any tasks that need to be performed, and then sends a response to the client. Again, as @deceze said, *once PHP finishes outputting the response, the script ends and nothing happens on the server until a new HTTP request comes. *

So now what should I do if I need to call PHP? It depends on how you need to do this: by reloading the page or using an AJAX call.

1. You can do this by reloading the page and sending a HTTP request
2. You can use JavaScript to make AJAX calls - this does not require reloading the page

Good Reading:

1. Wikipedia: Server Side Scripting
2. Wikipedia: Client Script
3. Madara Uchiha: Differences between client-side and server-side programming

Answer 2

Your code is divided into two completely independent parts, server-side and client-side.

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

Both parties communicate through HTTP requests and responses. PHP executes on the server and outputs some HTML and possibly JavaScript code, which is sent as a response to the client, where the HTML is interpreted and the JavaScript is executed. Once PHP has finished outputting the response, the script ends and nothing happens on the server until a new HTTP request comes.

The sample code is executed as follows:

sssccc

Step 1, PHP executes all the code between the tags. The result is this:

sssccc

file_put_contents The call produces no results, it just writes "foo" to the file. The call results in output "42", which is now located where the code originally was.

The generated HTML/JavaScript code is now sent to the client, where it is evaluated. The alert call works, while the foo variable is not used anywhere.

All PHP code is executed on the server before the client starts executing any JavaScript. There is no PHP code left in the response that JavaScript can interact with.

To call certain PHP code, the client must send a new HTTP request to the server. This can be achieved using one of three possible methods:

1. A link that causes the browser to load a new page.
2. Form submission, submits data to the server and loads a new page.
3. AJAX request, which is a Javascript technology used to generate regular HTTP requests to the server (shown in 1. and 2.) without leaving the current page.

Here is a question outlining these methods in more detail

You can also use JavaScript to have the browser open a new page or submit a form using window.location, simulating possibilities 1. and 2.