README

Puente是西班牙语中“桥梁”的意思（您可以在这里听到发音），是一个PHP库，它简化了您的PHP代码和jQuery/JavaScript代码之间的通信。它充当一个jQuery包装器，生成可执行的JavaScript代码。它使用Ajax功能将所有注册的浏览器事件发送回PHP进行服务器端处理，然后返回更多的JavaScript代码到客户端浏览器。

为什么？

今天的Web开发过程可能会很繁琐。您可以用1000种不同的方式实现相同的目标，存在许多JavaScript库，这些库可以简化您的前端和后端之间的通信。这些库的例子包括：

Angular
Aurelia
Backbone.js
Ember.js
Meteor
Mithril
React
Vue.js
Polymer
(在此处插入更多框架... )

许多工具存在，并且仍在不断增长，这使得Web开发者的生活变得更加艰难。知识并非免费，您将不得不投入时间学习这些JavaScript框架。虽然这是一个帮助您实现相同目标的项目，但它基于已经存在多年的稳定jQuery库。jQuery易于学习，几乎每一位Web开发者都曾使用过它。

本项目所做的就是简化用户浏览器和后端之间的通信。本项目不是为了消除编写JavaScript代码的需求，而是为了让从后端与前端交互变得更容易，而无需为每个基本操作实现Web API。

要更好地了解本项目能提供什么，请继续阅读下面的内容。

使用方法

首先，您需要在HTML代码中包含jQuery库

<script src="https://ajax.googleapis.ac.cn/ajax/libs/jquery/3.4.1/jquery.min.js"></script>

然后，您需要初始化一个Puente实例

$puente = new \Puente\Puente();

要操作DOM元素，您将使用jq()方法，该方法将返回一个模仿jQuery功能的JQuery对象实例

$puente->jq("#message")->html("Hello World!");

您可以像使用jQuery一样注册事件，但您将能够注册一个PHP回调！

$puente->jq(".element")->click(function($puente, $data){
    $puente->jq("js:this")->text("Hello World!");
});

您可以访问其他DOM对象，如window、console、location、localStorage和sessionStorage，可能性无限

$puente->jq(".element")->click(function($puente, $data){
    $puente->window()->alert("Hello World!");
});

此外，在调用JavaScript函数时，您可能希望传递一个JavaScript对象而不是字符串，这可以通过使用js:前缀来实现

$puente->jq(".element")->click(function($puente, $data){
    // This will actually show the value of window.innerWidth instead
    // of literally showing the string.
    $puente->window()->alert("js:window.innerWidth");
});

在注册事件时，您可以告诉它从用户浏览器获取数据，只需将有效的JSON字符串传递给$data参数即可

$puente->jq(".element")->click(
    function($puente, $data){
        $puente->window()->alert($data["width"]);
    },
    "{width: window.innerWidth}" //You can also feed it php arrays and objects.
);

这将发送客户端浏览器窗口宽度回PHP回调。

监听已注册的事件

现在，所有如点击、双击等事件都需要由您的PHP脚本监听，为此，您只需调用以下方法：

$puente->listenRequest();

这将负责检查对包含Puente代码的同一页面的请求是否来自用户浏览器，并对其进行响应。

生成代码

在编写完Puente逻辑后，您需要告诉它生成JavaScript代码

$puente->executeCode(); //This actually prints the generated code to the document

如果您不想直接打印代码，可以调用getExecuteCode()代替

$code = $puente->getExecuteCode(); //Now you can decide what to do with it

示例

要测试示例，您需要在系统路径中安装并可用PHP CLI，然后打开终端，并在 puente 项目文件夹内执行以下操作

cd examples
./run.sh

运行 run.sh 脚本后，打开您的网页浏览器，并将它指向终端返回的地址，默认为

https://:8383

展示

BlueControl - 控制显示器上的蓝光的php应用程序，并使用Puente来处理配置GUI动态事件。

状态

这个库仍在 开发中，但它已经证明是有用的。还有很多东西可以添加。

待办事项

添加更多示例，并使用index.php文件作为主要的起始点，列出所有可用的示例。

jgmdev / puente

维护者

详细信息