javascript - 客户端和服务器端编程有什么区别?

标签 javascript php client-side server-side

我有这个代码:

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

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

为什么这不会将“bar”写入我的文本文件,而是提示“42”?


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

最佳答案

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

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

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

示例代码执行如下:

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

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

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

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

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

file_put_contents调用没有产生任何结果,它只是将“+ foo +”写入文件。 <?php echo 42; ?>调用导致输出“42”,现在位于该代码曾经所在的位置。

生成的 HTML/JavaScript 代码现在被发送到客户端,并在客户端进行评估。 alert通话有效,而 foo变量未在任何地方使用。

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

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

  1. 导致浏览器加载新页面的链接。
  2. 表单提交,将数据提交到服务器并加载新页面。
  3. AJAX request,这是一种 Javascript 技术,用于向服务器发出常规 HTTP 请求(如 1. 和 2. will),但不会离开当前页面。

Here's a question outlining these method in greater detail

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

关于javascript - 客户端和服务器端编程有什么区别?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37935951/

相关文章:

javascript - 行动前输入需要等于零

javascript - 我们可以在 Angularjs 中 get Rest 调用的请求参数中使用变量吗?

javascript - 使用Polymer 3.0单独定义自定义元素,以便根据需求使用它们

php - 如何显示可读数组 - Laravel

php - SQL SELECT 语句中可以有循环吗?

php - 查询具有 md5 版本 id 的字段

database - 仍然是 100% 可移植的 TiddlyWiki 升级版?

javascript - 将 Jquery 中的值列表发送到 flask 模板

javascript - 在 javascript 变量中保存密码 - 安全隐患?

javascript - 衡量客户端页面加载时间的最佳方法是什么?