如何在 CodeIgniter 中上传图像和文件（附示例）

CodeIgniter 文件上传

文件管理对于大多数 Web 应用程序来说都是必不可少的。如果您正在开发内容管理系统，那么您将需要能够上传图像、word 文档、pdf 报告等。如果您正在开发会员网站，您可能需要采取措施让人们上传他们的个人资料图片。CodeIgniter 的文件上传类使我们可以轻松完成上述所有操作。

在本教程中，我们将介绍如何使用文件上传库来加载文件。

在 CodeIgniter 中上传图像

文件上传笨有两个主要部分。前端和后端。前端由使用表单输入类型文件的 HTML 表单处理。在后端，文件上传库处理从表单提交的输入并将其写入上传目录。

让我们从输入表格开始。

在 application/views 目录中创建一个名为 files 的新目录

在 application/views/files 中添加以下文件

upload_form.php – 此视图包含具有文件输入类型的 HTML 表单，并将选定的文件提交到服务器进行处理
upload_result.php – 此视图显示上传图像的结果，包括我们可以单击查看结果的链接。

将以下代码添加到 upload_form.php

<!DOCTYPE html>
<html>
<head>
    <title>CodeIgniter Image Upload</title>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body>
    <div>
        <h3>Select an image from your computer and upload it to the cloud</h3>
        <?php
                if (isset($error)){
                    echo $error;
                }
            ?>
            <form method="post" action="<?=base_url('store-image')?>" enctype="multipart/form-data">
                <input type="file" id="profile_image" name="profile_image" size="33" />
                <input type="submit" value="Upload Image" />
            </form>
    </div>
</body>
</html>

这里，

if (isset($error)){…} 检查是否设置了错误变量。如果结果为真，则将上传库返回的错误显示给用户。
该类型文件允许用户浏览他们的计算机并选择要上传的文件。

将以下代码添加到 upload_result.php

<!DOCTYPE html>
<html>
<head>
    <title>Image Upload Results</title>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body>
    <div>
        <h3>Congratulations, the image has successfully been uploaded</h3>
        <p>Click here to view the image you just uploaded
            <?=anchor('images/'.$image_metadata['file_name'], 'View My Image!')?>
        </p>

        <p>
            <?php echo anchor('upload-image', 'Go back to Image Upload'); ?>
        </p>
    </div>
</body>
</html>

这里，

使用锚点助手在图片目录中创建指向新上传文件的链接。文件上传成功后，将通过传递到视图的图片元数据检索名称。

现在让我们创建响应图像上传的控制器

在 application/controllers 中添加新文件 ImageUploadController.php

将以下代码添加到 ImageUploadController.php

<?php

defined('BASEPATH') OR exit('No direct script access allowed');

class ImageUploadController extends CI_Controller {

    public function __construct() {
        parent::__construct();
        $this->load->helper('url', 'form');
    }

    public function index() {
        $this->load->view('files/upload_form');
    }

    public function store() {
        $config['upload_path'] = './images/';
        $config['allowed_types'] = 'gif|jpg|png';
        $config['max_size'] = 2000;
        $config['max_width'] = 1500;
        $config['max_height'] = 1500;

        $this->load->library('upload', $config);

        if (!$this->upload->do_upload('profile_image')) {
            $error = array('error' => $this->upload->display_errors());

            $this->load->view('files/upload_form', $error);
        } else {
            $data = array('image_metadata' => $this->upload->data());

            $this->load->view('files/upload_result', $data);
        }
    }

}

这里，

class ImageUploadController extends CI_Controller {…} 定义我们的控制器类并扩展基控制器 CI_Controller
public function __construct() {…} 初始化父构造函数方法并加载 url 和表单助手
public function index() {…} 定义用于显示图片上传表单的 index 方法
public function store() {…} 定义上传图像并将其存储在 Web 应用程序服务器上的方法。

$config['upload_path'] = './images/'; 设置应上传图像的目录
$config['allowed_types'] = 'gif|jpg|png'; 定义可接受的文件扩展名。出于安全原因，这很重要。允许的类型确保只上传图像，而不能上传其他文件类型（如 php），因为它们有可能危害服务器。
$config['max_size'] = 2000; 设置最大文件大小（以千字节为单位）。在我们的示例中，可以上传的最大文件大小为 2,000kb，接近 2MB。如果用户尝试上传大于 2,000kb 的文件，则图像将无法上传，并且库将返回错误消息。
$config['max_width'] = 1500; 设置图像的最大宽度，在我们的例子中为 1,500 像素。任何大于该宽度的宽度都会导致错误
$config['max_height'] = 1500; 定义可接受的最大高度。
$this->load->library('upload', $config); 加载上传库并使用我们上面定义的数组 $config 初始化它。
if (!$this->upload->do_upload('profile_image')) {…} 尝试上传提交的图像，在我们的例子中名为 profile_image
$error = array('error' => $this->upload->display_errors()); 设置上传失败时的错误消息
$this->load->view('files/upload_form', $error);加载文件上传表单，并显示从上传库返回的错误消息
$data = array('image_metadata' => $this->upload->data()); 如果上传成功，则设置图像元数据
$this->load->view('files/upload_result', $data); 加载上传成功的视图并传递上传文件的元数据。

这就是控制器的全部内容。现在让我们创建将要上传图片的目录。在应用程序的根目录中创建一个新目录“images”

最后，我们将在 routes.php 文件中添加两个路由，用于显示表单和显示结果

Open application/config/routes.php
Add the following routes
$route['upload-image'] = 'imageuploadcontroller';
$route['store-image'] = 'imageuploadcontroller/store';

这里，

$route['upload-image'] = 'imageuploadcontroller';定义调用ImageUploadController的index方法的URL upload-image
$route['store-image'] = 'imageuploadcontroller/store';定义接受用户选择的文件并上传到服务器的store-image的URL。

测试应用程序

让我们启动内置的 PHP 服务器

打开终端/命令行并浏览到应用程序的根目录。在我的例子中，根目录位于驱动器 C:\Sites\ci-app

cd C:\Sites\ci-app

使用以下命令启动服务器

php -S localhost:3000

在您的 Web 浏览器中加载以下 URL： http://localhost:3000/upload-image

你将能够看到以下结果

点击选择文件

您应该能够看到类似以下内容的对话框窗口

选择您想要的图像然后单击打开

所选文件名将显示在表单上传中，如上图所示。点击上传图片按钮

如果一切顺利，你将获得以下结果

点击查看我的图片！链接

您应该能够看到您上传的图像。结果将类似于以下内容

注意，上传的图片名称显示在 URL 中。我们从上传的图片元数据中获取了图片名称

注意：其他类型的文件上传流程相同

如何在 CodeIgniter 中上传图像和文件（附示例）

CodeIgniter 文件上传

在 CodeIgniter 中上传图像

测试应用程序

总结一下这篇文章：

注册简报

CodeIgniter 文件上传

在 CodeIgniter 中上传图像

测试应用程序

相关文章

总结一下这篇文章：

注册简报