El proceso de upload consiste en el proceso de subir archivos desde un dispositivo local a un servidor remoto que consta de dos pasos:
- Se selecciona el archivo que se desea subir y luego se envía al servidor.
- El servidor recibe el archivo y lo almacena en una ubicación específica.
En una app web, el proceso de upload se puede realizar mediante la implementación de un formulario HTML usando el famoso campo de tipo file en HTML o mediante plugins que envían peticiones HTTP.
El proceso de CodeIgniter 4 para la carga de archivos o upload en inglés, lo podemos dividir en los siguiente bloques:
- Verificar el request del archivo cargado
- Verificar si es valido y si se puede mover
- Validar que el archivo cumpla con tus criterios, por ejemplo, si es una imagen, un documento word... o cualquier otro
- Manejar el proceso de upload o error; para esto lo movemos a alguna carpeta de nuestro proyecto que generalmente es la carpeta writeable o puede ser otra como la carpeta public
- Finalmente mostramos los errores si tenemos errores o guardamos alguna referencia a la imagen o archivo cargado en nuestra base de datos mediante algún modelo; es decir, mediante un condicional hacemos una operación u otra según la respuesta del servidor:
private function _upload($id)
{
if($imageFile = $this->request->getFile('image')){
if($imageFile->isValid() && !$imageFile->hasMoved()){
// validaciones
$validated = $this->validate([
'image' => [
'uploaded[image]',
'mime_in[image,image/jpg,image/gif,image/png]'
]
]);
if($validated){
echo "ok";
$newName = $imageFile->getRandomName();
//$imageFile->move(WRITEPATH . 'uploads/avatar/', $newName);
$imageFile->move(ROOTPATH.'public/uploads', $newName);
$personModel = new PersonModel();
$personModel->update($id, [
'image' => $newName
]);
return null;
}else {
return $this->validator->getError("image");
}
}
}
}Esta función retorna null si la carga se hizo correctamente o el primer error que ocurriera en el proceso de upload.
Y por aquí te muestro como puedes consumir la función del upload que generamos anteriormente mediante los procesos de crear y editar que forman parte de nuestro CRUD en CodeIgniter 4.
Primero el proceso de crear en la cual insertamos los datos en nuestra base de datos mediante nuestro modelo y LUEGO es que hacemos el upload o carga del archivo pasando el ID, de lo que creamos anteriormente; puedes ver tambien la bifurcación que hacemos con los condicionales, en la cual solamente llamamos al proceso del upload cuando creamos el registro, si no, mostramos los errores. si creamos la persona y tenemos problemas con la función de upload lo mandamos directamente a la página de editar y mostramos los errores del proceso de carga de la imagen:
public function create()
{
$person = new PersonModel();
if ($this->validate('person')) {
$id = $person->insert(
[
'name' => $this->request->getPost('name'),
'surname' => $this->request->getPost('surname'),
'age' => $this->request->getPost('age'),
'description' => $this->request->getPost('description'),
]
);
$res = $this->_upload($id);
if($res == null) {
return redirect()->to('/person')->with('message', 'Persona creada exitosamente' );
}else{
return redirect()->to("/person/$id/edit")->withInput();
}
return redirect()->to('/person')->with('message', 'Persona creada exitosamente');
}
// tenemos problemas con las validaciones
return redirect()->back()->withInput();
}
public function update($id)
{
$personModel = new PersonModel();
$person = $personModel->asObject()->find($id);
if ($person == null) {
throw PageNotFoundException::forPageNotFound();
}
if ($this->validate('person')) {
$personModel->update(
$id,
[
'name' => $this->request->getPost('name'),
'surname' => $this->request->getPost('surname'),
'age' => $this->request->getPost('age'),
'description' => $this->request->getPost('description'),
]
);
$res = $this->_upload($id);
if($res == null) {
return redirect()->to('/person')->with('message', 'Persona actualizada exitosamente: ' . $person->name);
}
return redirect()->back()->withInput();
}
// tenemos problemas con las validaciones
//return redirect()->back()->withInput();
}Como puedes ver, llamamos a la función de _upload cuando ya tenemos referencia al recurso creado, que en este caso, sería una persona.
Puedes encontrar el resto del código de la aplicación en mi repositorio en github como las vistas empleadas, así como las rutas empleadas.
- Andrés Cruz
In english
Desarrollo con Laravel, Django, Flask, CodeIgniter, HTML5, CSS3, MySQL, JavaScript, Vue, Android, iOS, Flutter