php - 结合 Angularjs 和 CodeIgniter

Question

我正在开发一个用 CodeIgniter 编写的现有网站，我们正在考虑将 AngularJS 用于一些需要大量前端功能的页面，但我们不想(一次(还))替换所有 CodeIgniter View 。

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

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

Answer 1

听起来您希望随着 Angular 应用程序的增长逐渐减少对 CodeIgniter (CI) 路由的使用。这并不困难，但需要很多细节。哪种方法可行取决于您的项目结构。 注意:我从 Code Igniter URL 中删除了 index.php，因此下面的路径可能与默认路径不同。

1) 在根目录下安装 CodeIgniter

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

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

在 /ng 中放置一个 .htaccess 文件，内容如下:

    Order allow, deny
    Allow from all

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

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

这个方法很好，因为 CodeIgniter 可以控制是否加载初始页面(通过 CI Controller 中的一些用户身份验证代码)。如果用户未登录，他们将被重定向并且永远看不到 Angular 应用程序。

2) 目录中的 CodeIgniter

如果 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 文件夹 partials/angular-view.html 请求局部 View ，而是从 CI /myapp/someResource 请求 View 。请注意前导 /。 “someResource”可以返回一个 html 文档，或 JSON 或您首先使用 Code Igniter 所做的任何事情。

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

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