Question

什么时候运行像JavaScript这样的客户端语言，什么时候运行像PHP这样的服务器端语言？我该如何混合使用？

我希望在点击我网站上的按钮时运行PHP函数，或者从PHP运行JavaScript函数;那可能吗？

Answer 1

简短的回答是否。你不能从JavaScript ^[AJAX除外]运行PHP函数，也不能从PHP运行JavaScript函数。两次运行时间是分开的。

如何？

要了解JavaScript和PHP如何合作，您首先应该了解支持Web的HTTP协议的基础知识。

上图演示了HTTP协议的基础知识。用户（您）要求客户端（您的浏览器）获取页面。然后，浏览器将向服务器（在此示例中为Google）询问该页面。服务器将回复HTML页面，客户端解析该页面，并询问正确加载页面所需的图像，字体和任何其他资源。然后，客户端将完成的页面呈现给用户。

那么JavaScript进来了哪里？

JavaScript在客户端（即浏览器）中运行。因此，在服务器的响应到达后，JavaScript将运行。让我们将它添加到我们的图表中。

JavaScript脚本在加载后立即开始运行，如果有事件侦听器等待来自用户的事件（如点击，键入或移动），它将继续运行。

PHP适合哪里？

PHP 在服务器上运行，Web服务器（负责提供Web内容的程序）将根据其配置运行PHP。 PHP将处理来自Web服务器的输入，并返回输出。该输出将返回给客户端。

更新图表：

如您所见，PHP执行不会持续存在。它被执行，然后在发送响应后结束。

正如您所看到的，PHP执行和JavaScript执行之间没有重叠，因此实际上不可能使其中一个函数基于另一个的输入工作。

但是......但是......我听说过AJAX！

AJAX只是从JavaScript 引起另一个HTTP请求。您可以将其称为一种使用JavaScript中的PHP函数的方法，但事实并非如此。

正如您所看到的，使用AJAX，JavaScript将向服务器发送请求，该服务器将调用PHP，PHP将再次运行，就像在正常请求中一样（PHP不一定知道这甚至是一个AJAX请求！并且服务器将响应返回给JavaScript，后者使用它来执行操作。

在这种情况下，PHP运行的时间和JavaScript运行的时间之间存在重叠，因为JavaScript调用了一个请求。

另见：

How to pass variables and data from PHP to JavaScript?

Answer 2

欢迎来到McBurger，一个花哨的（是的）汉堡联合。干涸的气味油脂侵入你的鼻孔，导致你的肠子混合在一起咕噜咕噜厌恶和喜悦。你耐心地在母亲身后排队等候是人类的孩子。最后，你面对面地遇到了十几岁的收银员，而不是没有一点遗憾。你点了一个汉堡（惊喜）和一些薯条。你支付了等一下你的订单。

过了一段时间，你得到了汉堡，却发现他们忘记了你的汉堡薯条！你再次走到收银台，并要求他们。你再等一下准备好炸薯条。一旦它们出现，你就会把一切都搞砸然后离开。

这与任何事情有什么关系？

愤怒的收银员是服务器，也许是运行php。

您是客户，也许是能够理解html / css / js的网络浏览器。

为了获得服务，你走近柜台并说'＃34;我想要一个汉堡＆＃34;。 McBurger 然后准备并给你一个汉堡。

为了获得服务，网络浏览器接近服务器并说“我想要这个页面＆＃34;”。然后，您的服务器会准备并为您提供一个页面。

最重要的方面是客户和客户之间没有混合 McBurger。你不会准备自己的薯条，麦克伯格不会喝你的奶昔。同样的方式，Web浏览器不会运行php，服务器也会运行不为你运行JavaScript。如果你想要McBurger给你他们着名的焦糖冰淇淋，你必须靠近柜台并要求一个。如果你想要你的网页要在单击按钮时将某些内容保存到数据库，您必须接近服务器并要求它这样做。

你和麦克伯格通过声音交流。浏览器和服务器通过HTTP进行通信。

让我们来看看HTTP。

兔子，你带我去哪儿了？

如果你在几乎任何Linux发行版或Mac上运行，你就安装了netcat。如果您在Windows上，抱歉，您将不得不接受下一节的话，或者下载某种类型的nc端口或telnet客户端。

无论如何，打开你最喜欢的终端，让我们在端口80（默认的http端口）上与某个服务器通话：

% nc www.stackoverflow.com 80

＆＃34; Welp，没有做任何事情，在我面前只是空洞的提示！＆＃34;

不要担心，我在这些答案中与之交谈的随机人员，我们只是对服务器说了什么！在McBurger，这相当于走到柜台，专心盯着收银员。

只需。

凝视。

我们必须快速开始使用我们的声带，否则他们会打电话给安全人员。我无法回到那个地狱的玛莎身上，我只是...... 无法。

...无论如何，我们需要告诉收银员我们想要一个汉堡。在http中，发出GET请求：

% nc www.stackoverflow.com 80
GET / HTTP/1.1

点击输入两次，然后欢呼，我们得到了一些输出！

HTTP/1.1 400 Bad Request
Content-Type: text/html; charset=us-ascii
Date: Sat, 02 Aug 2014 10:55:16 GMT
Content-Length: 334

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN""http://www.w3.org/TR/html4/strict.dtd">
<HTML><HEAD><TITLE>Bad Request</TITLE>
<META HTTP-EQUIV="Content-Type" Content="text/html; charset=us-ascii"></HEAD>
<BODY><h2>Bad Request - Invalid Hostname</h2>
<hr><p>HTTP Error 400. The request hostname is invalid.</p>
</BODY></HTML>

那不是好事。很多东西我都不明白，但它说请求主机名无效。让我们再试一次，这次我们只给它一个主持人：

% nc www.stackoverflow.com 80
GET / HTTP/1.1
Host: stackoverflow.com

按两次进入，＆＃34;圣洁的bajesus，这是很多输出！＆＃34;是的人，就是这样。

兔子，这有什么关系？

那么这与php和一些流程图有什么联系呢？仍然认为你可以点击运行PHP？让我们来写一个'＃34; hello world＆＃34;在PHP中，看看为什么它不可能。

仅仅为了这个场合，我安装了php并写了一些文件：

# example.php
<?php
echo 'Hi mom!';
?>

很酷，让我们做一个请求，看看发生了什么：

% nc localhost 80
GET /example.php HTTP/1.1
Host: localhost

仪式二输入键和：

HTTP/1.1 200 OK
Server: nginx/1.2.1
Date: Sat, 02 Aug 2014 11:00:52 GMT
Content-Type: text/html

Hi mom!

恭喜，我们有自己的汉堡包！我们有一台服务器，我们可以响应客户！欢乐世界！

这里发生的是这次谈话：

我：给我/example.php。
服务器：好的。嘿php，运行example.php
php：无论如何。输出为Hi mom!
服务器：你去客户端，Hi mom!
我：谢谢你！

总结

服务器和客户端是两个独立的存在。
他们通过HTTP进行通信。
如果客户想要什么，它必须向服务器询问。
- 通过HTTP请求执行的操作。

无耻的自我推销：如果你想知道如何从javascript创建http请求，你可以参考my gist on the matter（警告：包含咒骂词的痕迹）。

Answer 3

另一个答案很好，但我会尝试一种更简单的方法..

您的浏览器会从服务器收到一页HTML和JavaScript。 PHP正在服务器上组装发送到浏览器的最终页面。它可以检查一些数据库，并进行一些计算，也可以与API连接，但最后它需要所有信息并在一个充满代码的页面上“打印出来”然后发送到您的浏览器。

浏览器获取页面，如果页面上有任何Javascript，或者是否有SCRIPT标记引入其他.js文件，它会读取所有内容然后执行Javascript。

因此，您的页面由PHP“构建”，它可以包含Javascript，以某种方式将由浏览器执行，但这两个过程通常是分开的。

通过在页面上输出特定的JS代码，您可以让PHP与Javascript“交谈”。

您可以通过在页面执行时使用AJAX联系服务器来使Javascript与PHP“对话”。服务器可以提供回复信息，然后再使用Javascript将其集成回页面。

但一般来说，这两个过程都在他们自己的世界中运行。

您可以使用AJAX“按钮启动PHP代码”。

从“内部”PHP运行Javascript并没有真正完成。

JavaScript何时何地运行，PHP如何？我能把两者结合起来吗？

3 个答案:

如何？

那么JavaScript进来了哪里？

PHP适合哪里？

但是......但是......我听说过AJAX！

另见：

这与任何事情有什么关系？

兔子，你带我去哪儿了？

兔子，这有什么关系？

总结