CI框架前后端分离

Ustinian007

于 2022-12-15 14:00:42 发布

阅读量859

点赞数

CC 4.0 BY-SA版权

分类专栏： php 文章标签： ci/cd php 数据库

本文链接：https://blog.youkuaiyun.com/Th_rob/article/details/128319686

php 专栏收录该内容

2 篇文章

订阅专栏

本文介绍CodeIgniter框架的基本使用，包括MVC架构的应用、数据库操作及前后端交互示例。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

前言

CodeIgniter 是一个小巧但功能强大的 PHP 框架，作为一个简单而“优雅”的工具包，它可以为开发者们建立功能完善的 Web 应用程序。CI框架采用的是MVC模式，通过CI框架，我们不必以某种方式命名数据库表，也不必根据表命名模型。这样可以提高我们的开发效率。做了一个小样例，展示利用CI如何编码数据接口,提供前端调用。本文的CI框架版本为3.1.5，最新版本已经到了4。使用文档可以看这欢迎使用 CodeIgniter — CodeIgniter 3.1.5 中文手册|用户手册|用户指南|中文文档。

搭建过程

应用结构

CI框架的初始源码主要分为三大块：system文件夹、application文件夹、index.php入口文件。CI框架的目录如下图所示：
在这里插入图片描述

主要看application目录下的东西。如图所示
在这里插入图片描述

config文件夹：主要包括路由配置(route.php)、数据库配置(database.php)、系统配置(config.php)、全局变量配置(constant.php)等。在route.php中，可以配置用户默认调用的controller文件夹下的某个文件的某个方法。在database.php，可以配置CI框架调用的数据库的IP、数据库名、数据库登入的用户名和密码、数据库端口，支持配置多个数据库（甚至多种类型的数据库）。在config.php中配置字符类型、controller前缀、允许的url格式、是否写日志及日志路径和格式、session的时间及数组名等。
log文件夹：该文件夹用于存放网站编译、执行过程中的日志文件，在config.php中可以设置该文件夹的默认命名规则、记录日志的等级，默认按天进行命名，每天一个log，记录除了notice以外的错误等级。在调试的过程中，如果想追溯变量执行过程中的具体值，可以用log_message('error',变量名)，执行到这句话的时候就会把变量打到日志中。
library 文件夹：该文件夹主要用来存放其他调用的类，这些类可以是网上的一些开源的php资源，也可以是自己编写的类。例如：php处理excel的常用类PHPExcel、PHP进行邮件发送的PHPMailer类、PHP调用图片相关的JpGraph类等，另外，我也将验证码生成类、Ajax处理类、登陆用户信息类等放置在该目录中，供controller调用。
core文件夹：这个文件夹在刚刚下载下来的源码中是空文件夹，但是这个文件夹比较关键，通常开发的时候会在该文件夹中放置两个php文件，假设项目名称叫phpthinker，则通常会新建两个文件夹，一个叫做Phpthinker_Controller.php，另一个叫做Phpthinker_Model.php。（关于文件命名规则后续内容再提及）。Phpthinker_Controller.php将继承system文件夹内的CI_Controller.php文件，Phpthinker_Controller.php的主要目的是作为其他controller的父类文件，登陆判断通常在该文件中编写，其他controller继承该文件后，就会调用该文件的登陆判断进行判断用户是否登陆，简化网站程序。Phpthinker_Model.php同理，其继承CI_Model.php，作为其他model的父类，一些常用的sql语句（如分页）可以写在该model中，供其它model调用。
controller、model、view即控制器、模型、视图，MVC的具体内容在后续文章中将会讲解，初步来说，controller用来放置处理逻辑、model用来放置数据库操作、view用来放置网站的外观。

代码演示

后端

CI框架可以不用写View部分，Controller的每一个public函数就可以看做API的调用接口。在controller目录下创建一个文件Config.php。

注意：本文启动CI应用是通过wampserver来启动的，

<?php
  defined('BASEPATH') or exit('No direct script access allowed');
  
class Config extends CI_Controller
{
  public function __construct()
  {
    parent::__construct();
    // 设置跨域请求
    header('Access-Control-Allow-Origin: * ');
    header("Access-Control-Allow-Headers: Origin, X-Requested-With, Content-Type, Accept");
    header('Content-Type:application/json;charset=utf-8');
    header('Access-Control-Allow-Methods: POST, GET, OPTIONS, PUT, DELETE');
    // 数据库连接
    // 若遇到连接error的问题，首先检查下，/config/database.php下数据库配置是否正确 
    $this->load->database();
  }
  /**
  * 详情（查询某个配置项）
  * getDetail
  */
  public function getDetail()
  {
    $id = isset($_GET['id']) ? $_GET['id'] : "";
    // 这里的config为你数据库的表名
    // $result为数据库查询结果,具体需求可以看官方文档,调用相应的api来获取需要的东西  
    $result = $this->db->query("SELECT * FROM `config`  WHERE `id` = '$id'");
    // 返回格式(JSON对象)
    echo json_encode(array('code' => 200, 'form' => $result->result_object()));
  }
}

前端

前端本文采用的是vue2.0框架，通过axios来发起请求。

<script>
  export default {
    methods: {
      async getDetail(id){
        const {data:res} =  await this.$axios({
          method:"get",
          url:"/Config/get", // axios的baseUrl为 http://localhost/CodeIgniter-3.1.5/index.php 这个地址为你应用程序的启动地址
          params:{
            id:id
          }
        })
        console.log(res)
      }
    },
  }
</script>

效果

F12利用develop tools来查看网络请求状态

总结

CI框架为 PHP 开发人员提供的一套 Web 应用程序工具包。提高了开发者的开发效率。本文中还有很多开发的小技巧还为提及，例如：php在CI中的使用规范、全局变量的命名、数据库分页操作等等。留给大家慢慢去探索，后续也会更新一些有关CI框架前后端分离的项目实战。认为该文章对您有帮助的话，可以不可以球球点个赞👍~