Web应用程序:在PHP和Javascript AJAX之间结合视图层

Web应用程序:在PHP和Javascript AJAX之间结合视图层,javascript,php,ajax,codeigniter,web,Javascript,Php,Ajax,Codeigniter,Web,我正在使用PHP和CodeIgniter MVC框架开发web应用程序,需要大量的实时客户端功能。这是我第一次构建大规模的客户端应用程序。因此,我将PHP与大规模Javascript模块结合在一个项目中 正如您已经知道的,MVC框架将应用程序模块分离到模型-视图-控制器中 我关心的是视图层 通过在控制器上加载一些数据,我可以通过PHP内置脚本标记在DOM上显示数据。否则,我可以使用AJAX提取数据——将控制器视为一个服务——并通过Javascript显示数据 这里有一些可视化 我可以直接从控制器

我正在使用PHP和CodeIgniter MVC框架开发web应用程序,需要大量的实时客户端功能。这是我第一次构建大规模的客户端应用程序。因此,我将PHP与大规模Javascript模块结合在一个项目中

正如您已经知道的,MVC框架将应用程序模块分离到模型-视图-控制器中

我关心的是视图层

通过在控制器上加载一些数据,我可以通过PHP内置脚本标记在DOM上显示数据。否则,我可以使用AJAX提取数据——将控制器视为一个服务——并通过Javascript显示数据

这里有一些可视化

我可以直接从控制器输入数据:

<label>Username</label> <input type="text" id="username" value="<?=$userData['username'];?>" /><br />
<label>Date of birth</label> <input type="text" id="dob" value="<?=$userData['dob'];?>" /><br />
<label>Address</label> <input type="text" id="address" value="<?=$userData['address'];?>" />
那么,对于具有复杂客户端功能的应用程序,哪种方法更好


另一方面,PHP-CI有一种默认机制,可以直接从控制器中放入数据,那么为什么要使用AJAX呢?

AJAX用于从远程服务器获取数据,而无需刷新页面。您可以使用异步从服务器获取数据,因此页面看起来是交互式的。你的两种方法都很好,可以为你工作。但为了解释这一点,让我举个例子来解释

您有一个页面,其中有5个区块、最新用户、最新新闻、最新评论、食谱和优惠。每个块都有自己的数据。现在,如果您使用该方法获取控制器中的所有数据并将其传递给视图,它将工作正常,并且不会产生这种方法的副作用

另一方面,如果您使用ajax异步调用,那么首先将加载页面,然后javascript将显示一些数据加载指示器,并且将对所有这些块的服务器进行异步调用。当数据加载到各个块时,加载指示器将隐藏。现在,在这种方法中,页面将是交互式的,并且看起来是活动的

如果你用谷歌搜索,你会发现更多的原因


我希望这会有所帮助

谢谢你的解释。所以,我应该使用AJAX进行多任务处理。但是,Javascript似乎正在接管我的PHP控制器层。在Javascript和PHP中都有应用程序控制层,这有点多余吗?Javascript漏洞又如何呢?你对此有什么看法?:)在某种意义上是的,但不确定它是否是多任务的:P。我认为您应该阅读MVC和带有CI的jQueryAjax。Ajax并没有接管您的控制器。您仍然需要创建将由ajax调用的控制器操作(函数)。Ajax只用于发送http请求,无需页面刷新,然后使用DOM将数据插入到所需位置。您可以使用一些ajax库,比如jQuery,它们为您处理了安全性问题,并且易于使用ajax调用和其他功能。谢谢,现在我有了模型视图控制器,那么Javascript属于哪一层?我认为,因为Javascript处理我的应用程序逻辑(例如,当我点击我的按钮时会发生什么),并且我正在那里进行一些验证,所以它属于控制器层。请注意,Javascript是客户端的,它不在服务器上运行,而是在浏览器中运行。JS可以写在视图文件中,也可以写在单独的JS文件中,所以我们可以说它属于视图端。js验证称为客户端验证,php(或任何其他服务器端脚本语言)验证称为服务器端验证。请注意,应用程序逻辑应该始终由控制器(请求处理)和模型(业务逻辑处理ie数据库操作)处理,而不是由JS处理。Js只是提供了一些视图支持。这是一个需要讨论的广泛话题,你必须在谷歌上对此进行一些研究。您可以阅读有关MVC和的更多信息。
$.ajax({
  type: "POST",
  url: config.indexURL + "user",                
  dataType: "json",
  success: function(data) { 
    $('#username').val(data.username);
    $('#dateOfBirth').val(data.dob);
    $('#address').val(data.address);
  }
});