结合 Angularjs 和 CodeIgniter

php javascript angularjs codeigniter

2022-08-30 21:01:11

我正在开发一个用CodeIgniter编写的现有站点，我们正在考虑将AngularJS用于一些需要大量前端功能的页面，但我们不想替换所有CodeIgniter视图（一次（尚未））。

所以我点击一个由angular的路由器控制的链接，它由javascript处理，但下一个链接可能是一个“正常”请求，应该由CodeIgniter框架处理。

有没有一些优雅的方式来结合这两种方法？我真的不介意一些额外的客户端开销，因为该网站尚未在生产环境中运行。

答案 1

这听起来像是您希望随着角度应用程序的增长逐渐减少对 CodeIgniter （CI）路由的使用。这并不难，但需要很多细节。哪种方法有效取决于您的项目结构。注意：我从代码点火器URL中删除了索引.php，因此下面的路径可能与默认值不同。

1）代码标志安装在根目录

如果 CI 安装在服务器的根目录上，则可以在 CI 中创建一个文件夹（例如，我有一个“ng”文件夹）。您的项目将如下所示：

    /controllers
    /models
    /ng
    (etc)
    /index.php (code igniter index file)

将 .htaccess 文件放在其中，其中包含以下内容：/ng

    Order allow, deny
    Allow from all

这允许直接访问其中的文件，而不是通过CI的路由系统将这些请求发送回去。例如，您现在可以直接加载它：/ngexample.com/ng/partials/angular-view.html

主网页仍将由CodeIgniter创建，但它现在可以包含Angular资源，例如部分视图等。最终，您可以通过返回一个简单的页面来替换CodeIgniter正在做的大部分工作，并让Angular加载部分视图，就像它的设计一样。/ng

此方法很好，因为CodeIgniter可以控制是否加载初始页面（通过CI控制器中的一些用户身份验证代码）。如果用户未登录，则会重定向他们，并且永远不会看到 Angular 应用。

2） CodeIgniter in Directory

如果 CI 安装在某个目录中，例如，您只需在其旁边创建一个目录，example.com/myapp/(code igniter)example.com/myappNg/

    /myapp/
    /myapp/controllers/
    /myapp/models/
    /myapp/(etc)
    /myapp/index.php (code igniter index file)
    /myappNg/
    /myappNg/partials/
    /myappNg/js/
    /myappNg/(etc)

现在，在 Angular 应用程序中，您可以通过创建相对于域根目录（而不是相对于 Angular 应用）的路径，从 CI 请求资源。例如，在Angular中，您将不再从 Angular文件夹请求部分视图，而是希望从CI请求视图。请注意前导。“someResource”可以返回一个html文档，或JSON或你首先使用Code Igniter所做的任何事情。partials/angular-view.html/myapp/someResource/

最终，您可以替换引用的路径数。一旦您不再将CI用于任何内容，您只需将Angular索引放入.html，它将继续引用您在./myapp//myapp//myappNg/

TL;DR 使您的 Angular 应用程序完全可用，并将其与 CodeIgniter 分离。逐渐转向使用Angular分视图和其他JSON源，而不是链接到CodeIgniter页面。最终将 CodeIgniter 端点替换为引导 Angular 的 HTML 文件。

答案 2

最好的办法是将后端代码与角度代码分开，并将代码使用Inginter代码作为API。

/Codeigniter Code /Angular Code

由于CodeIgniter附带了其安全功能，因此这应该是您最好的选择