Как загрузить изображение и файл в CodeIgniter (с примером)
Фиона Браун
⚡ Умное резюме
CodeIgniter File Upload использует встроенную библиотеку Upload для перемещения изображений и документов из HTML-формы в каталог на сервере. В этом примере создается форма загрузки, контроллер, проверяющий тип и размер, и страница результатов, подтверждающая загрузку.
CodeЗагрузка файла Igniter
Управление файлами имеет важное значение для большинства веб-приложений. Если вы разработчик...ping Если вы используете систему управления контентом, вам потребуется возможность загружать изображения, документы Word, PDF-отчеты и многое другое. Если вы работаете над сайтом с платным доступом, вам может потребоваться предусмотреть возможность загрузки изображений профиля для пользователей. CodeКласс Igniter File Uploading позволяет нам легко выполнить все вышеперечисленное.
В этом уроке мы рассмотрим, как использовать библиотеку загрузки файлов для загрузки файлов.
Загрузка изображений в Codeвоспламенитель
Загрузка файла в Codeвоспламенитель Он состоит из двух основных частей: фронтенда и бэкенда. Фронтенд обрабатывается HTML-формой, использующей поле ввода типа «файл». На бэкенде библиотека для загрузки файлов обрабатывает отправленные из формы данные и записывает их в каталог для загрузки.
Начнём с формы ввода.
Создайте новую директорию с именем files в директории application/views.
Добавьте следующие файлы в папку 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(0)?>" 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>
ВОТ,
- Используется вспомогательный механизм привязки для создания ссылки на недавно загруженный файл в каталоге изображений. Имя файла извлекается из метаданных изображения, которые передаются в представление после успешной загрузки файла.
Теперь давайте создадим контроллер, который будет реагировать на загрузку изображения.
Добавьте новый файл ImageUploadController.php в application/controllers.
Добавьте следующий код в 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); } } }
ВОТ,
- класс ImageUploadController расширяет CI_Controller {…} определяет наш класс контроллера и расширяет базовый контроллер CI_Controller
- публичная функция __construct() {…} инициализирует метод родительского конструктора и загружает URL-адрес и помощники формы
- публичная функция index() {…} определяет метод индекса, который используется для отображения формы загрузки изображения
- public function store() {…} определяет метод, который будет загружать изображение и сохранять его на сервере веб-приложений.
- $config['upload_path'] = './images/'; устанавливает каталог, в который должны быть загружены изображения
- Параметр `$config['allowed_types'] = 'gif|jpg|png';` определяет допустимые расширения файлов. Это важно по соображениям безопасности. Разрешенные типы гарантируют, что загружаются только изображения, а другие типы файлов, такие как PHP, не могут быть загружены, поскольку они потенциально могут скомпрометировать сервер.
- Параметр `$config['max_size'] = 2000;` устанавливает максимальный размер файла в килобайтах. В нашем примере максимальный размер загружаемого файла составляет 2,000 КБ, что близко к 2 МБ. Если пользователь попытается загрузить файл размером более 2,000 КБ, загрузка изображения завершится неудачей, и библиотека вернет сообщение об ошибке.
- Параметр `$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 два маршрута, которые будут отображать форму и результаты.
Откройте файл application/config/routes.php и добавьте следующие маршруты.
$route['upload-image'] = 'imageuploadcontroller'; $route['store-image'] = 'imageuploadcontroller/store';
ВОТ,
- $route['upload-image'] = 'imageuploadcontroller'; определяет URL Загрузка изображения, вызывающая метод index контроллера ImageUploadController.
- $route['store-image'] = 'imageuploadcontroller/store'; определяет URL store-image — это функция, которая принимает выбранный пользователем файл и загружает его на сервер.
Как исправить распространенные ошибки CodeОшибки загрузки файлов в Igniter
В большинстве случаев при сбоях загрузки библиотека Upload выдает понятное сообщение. Ниже приведен список распространенных ошибок и способов их устранения.
- Тип файла, который вы пытаетесь загрузить, недопустим: Добавьте отсутствующее расширение в конфигурацию allowed_types, например, 'gif|jpg|png|pdf'.
- Размер загружаемого файла превышает допустимый: Увеличьте значение параметра max_size и убедитесь, что значения upload_max_filesize и post_max_size в файле php.ini достаточно велики.
- Путь для загрузки, по всей видимости, недействителен: Создайте каталог upload_path и убедитесь, что веб-сервер имеет права на запись в него.
- Вы не выбрали файл для загрузки: Убедитесь, что имя поля ввода совпадает с аргументом функции do_upload() и что форма использует тип данных enctype multipart/form-data.
Тестирование приложения
Давайте запустим встроенный PHP-сервер.
Откройте терминал или командную строку и перейдите в корневую папку вашего приложения. В моем случае корневая папка находится на диске C:\Sites\ci-app
cd C:\Sites\ci-app
Запустите сервер, используя следующую команду.
php -S localhost:3000
Загрузите следующее URL в вашем веб-браузере: http://localhost:3000/upload-image
Вы сможете увидеть следующие результаты.
Нажмите выбрать файл
Вы должны увидеть диалоговое окно, подобное следующему.
Выберите нужное изображение, затем нажмите «Открыть».
Имя выбранного файла отобразится в форме загрузки, как показано на изображении выше. Нажмите кнопку «Загрузить изображение».
При условии, что всё пройдёт гладко, вы получите следующие результаты.
Нажмите на ссылку «Посмотреть мое изображение!»
Вы должны увидеть загруженное вами изображение. Результаты будут примерно такими, как показано ниже.
Обратите внимание, что название загруженного изображения отображается в... URLНазвание изображения мы получили из метаданных загруженного изображения.
Примечание: Процесс загрузки файлов остается неизменным для других типов файлов.
