Javascript 客户端和服务器端编程有什么区别？

What is the difference between client-side and server-side programming?

提问by deceze

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 does this not write "bar" into my text file, but alerts "42"?

为什么这不会将“bar”写入我的文本文件，而是提醒“42”？

---

---

NB: Earlier revisions of this question were explicitly about PHP on the server and JavaScript on the client. The essential nature of the problem and solutions is the same for anypair of languages when one is running on the client and the other on the server (even if they are the same language). Please take this in to account when you see answers talking about specific languages.

注意：此问题的早期修订版明确涉及服务器上的 PHP 和客户端上的 JavaScript。当一种语言在客户端上运行而另一种在服务器上运行时（即使它们是相同的语言），问题和解决方案的本质性质对于任何一对语言都是相同的。当您看到有关特定语言的答案时，请考虑到这一点。

采纳答案by deceze

Your code is split into two entirely separate parts, the server sideand the client side.

您的代码分为两个完全独立的部分，服务器端和客户端。

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

The two sides communicate via HTTP requests and responses. PHP is executed on the server and outputs some HTML and maybe JavaScript code which is sent as 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 will happen on the server until a new HTTP request comes in.

双方通过 HTTP 请求和响应进行通信。PHP 在服务器上执行并输出一些 HTML 和 JavaScript 代码，这些代码作为响应发送到客户端，在客户端解释 HTML 并执行 JavaScript。一旦 PHP 完成输出响应，脚本就会结束，服务器上不会发生任何事情，直到新的 HTTP 请求进来。

The example code executes like this:

示例代码执行如下：

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

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

Step 1, PHP executes all code between <?php ?>tags. The result is this:

第 1 步，PHP 执行<?php ?>标签之间的所有代码。结果是这样的：

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

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

The file_put_contentscall did not result in anything, it just wrote " + foo + " into a file. The <?php echo 42; ?>call resulted in the output "42", which is now in the spot where that code used to be.

该file_put_contents呼叫并没有导致任何东西，它只是写了“+富+”到文件中。的<?php echo 42; ?>呼叫导致的输出“42”，这是现在在该代码用来为光斑。

This resulting HTML/JavaScript code is now sent to the client, where it gets evaluated. The alertcall works, while the foovariable is not used anywhere.

这个生成的 HTML/JavaScript 代码现在被发送到客户端，在那里它被评估。该alert呼叫工作，而foo变量没有任何地方使用。

All PHP code is executed on the server before the client even starts executing any of the JavaScript. There's no PHP code left in the response that JavaScript could interact with.

在客户端甚至开始执行任何 JavaScript 之前，所有 PHP 代码都会在服务器上执行。响应中没有留下 JavaScript 可以与之交互的 PHP 代码。

To call some PHP code, the client will have to send a new HTTP request to the server. This can happen using one of three possible methods:

要调用一些 PHP 代码，客户端必须向服务器发送一个新的 HTTP 请求。这可以使用以下三种可能的方法之一发生：

1. A link, which causes the browser to load a new page.
2. A form submission, which submits data to the server and loads a new page.
3. An AJAXrequest, which is a Javascript technique to make a regular HTTP request to the server (like 1. and 2. will), but without leaving the current page.

1. 一个链接，它使浏览器加载一个新页面。
2. 表单提交，将数据提交到服务器并加载新页面。
3. 一个AJAX请求，这是一个JavaScript技术，使一个普通的HTTP请求到服务器（如1和2会），而无需离开当前页面。

Here's a question outlining these method in greater detail

这是一个更详细地概述这些方法的问题

You can also use JavaScript to make the browser open a new page using window.locationor submit a form, emulating possibilities 1. and 2.

您还可以使用 JavaScript 使浏览器使用window.location或提交表单打开一个新页面，模拟可能性 1. 和 2。

回答by NullPoiиteя

To determine why PHPcode doesn't work in JavaScriptcode we need to understand what client sideand server sidelanguages are, and how they work.

要确定为什么PHP代码在JavaScript代码中不起作用，我们需要了解什么是客户端和服务器端语言，以及它们是如何工作的。

Server-side languages (PHP etc.): They retrieve records from databases, maintain state over the stateless HTTPconnection, and do a lot of things that require security. They reside on the server, these programs never have their source code exposed to the user.

服务器端语言（PHP 等）：它们从数据库中检索记录，通过无状态HTTP连接维护状态，并做很多需要安全性的事情。它们驻留在服务器上，这些程序永远不会将源代码暴露给用户。

_{image attr}

_图像属性

So you can easily see that server side languages handle HTTP requests and process them, and, as @deceze said, PHP is executed on the server and outputs some HTML, and maybe JavaScript code, which is sent as a response to the client, where the HTML is interpreted and JavaScript is executed.

所以你可以很容易地看到服务器端语言处理 HTTP 请求并处理它们，正如@deceze 所说，PHP 在服务器上执行并输出一些 HTML，也许还有 JavaScript 代码，作为响应发送给客户端，其中解释 HTML 并执行 JavaScript。

On the other hand, Client Side Languages (like JavaScript)reside in browser and run in the browser. Client-side scriptinggenerally refers to the class of computer programs on the web that are executed client-side, by the user's web browser, instead of server-side.

另一方面，客户端语言（如 JavaScript）驻留在浏览器中并在浏览器中运行。客户端脚本通常是指 Web 上由用户的 Web 浏览器而不是服务器端在客户端执行的一类计算机程序。

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

JavaScript 对用户是可见的并且可以很容易地修改，所以为了安全我们不能依赖 JavaScript。

So when you make a HTTPrequest on server, the server first reads the PHP file carefully to see if there are any tasks that need to be executed, and sends a response to the client side. Again, as @deceze said, *Once PHP has finished outputting the response, the script ends and nothing will happen on the server until a new HTTPrequest comes in.*

所以当你在服务器端发起HTTP请求时，服务器端首先会仔细读取PHP文件，看是否有需要执行的任务，并向客户端发送响应。同样，正如@deceze 所说，*一旦 PHP 完成了响应的输出，脚本就会结束，服务器上不会发生任何事情，直到有新的HTTP请求进来。*

_{Image source}

_图片来源

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

那么现在如果我需要调用 PHP 该怎么办呢？这取决于您需要如何执行此操作：通过重新加载页面或使用 AJAX 调用。

1. You can do so by reloading the page and sending a HTTPrequest
2. You can make an AJAX call with JavaScript - this does not require reloading page

1. 您可以通过重新加载页面并发送HTTP请求来实现
2. 您可以使用 JavaScript 进行 AJAX 调用 - 这不需要重新加载页面

Good Read:

好读：

1. Wikipedia : Server-side scripting
2. Wikipedia : Client-side scripting
3. Madara Uchiha : Difference between client side and server side programming

1. 维基百科：服务器端脚本
2. 维基百科：客户端脚本
3. Madara Uchiha：客户端和服务器端编程之间的区别

回答by NitayArt

Your Javascript will execute on the client, not on the server. This means that foois not evaluated on the server side and therefore its value can't be written to a file on the server.

您的 Javascript 将在客户端上执行，而不是在服务器上。这意味着它foo不在服务器端评估，因此它的值不能写入服务器上的文件。

The best way to think about this process is as if you're generating a text file dynamically. The text you're generating only becomes executable code once the browser interprets it. Only what you place between <?phptags is evaluated on the server.

考虑此过程的最佳方式是，好像您正在动态生成文本文件。您生成的文本只有在浏览器解释后才成为可执行代码。只有您放置在<?php标签之间的内容才会在服务器上进行评估。

By the way, making a habit of embedding random pieces of PHP logic in HTML or Javascript can lead to seriously convoluted code. I speak from painful experience.

顺便说一句，养成在 HTML 或 Javascript 中嵌入随机 PHP 逻辑片段的习惯可能会导致代码非常复杂。我是从痛苦的经历中讲出来的。

回答by chandrashekar.n

In web application every task execute in a manner of request and response.

在 Web 应用程序中，每个任务都以请求和响应的方式执行。

Client side programming is with html code with Java script and its frameworks, libraries executes in the internet explorer, Mozilla, chrome browsers. In the java scenario server side programming servlets executes in the Tomcat, web-logic , j boss, WebSphere severs

客户端编程是使用带有 Java 脚本及其框架的 html 代码，库在 Internet Explorer、Mozilla、chrome 浏览器中执行。java场景中服务端编程servlets在Tomcat、web-logic、j boss、WebSphere server中执行