No tienes acceso a esta clase

¡Continúa aprendiendo! Únete y comienza a potenciar tu carrera

Curso de PHP: Integración con HTML

Curso de PHP: Integración con HTML

Carlos Eduardo Gómez García

Carlos Eduardo Gómez García

Guardando imágenes en el servidor

14/24
Recursos

Aportes 10

Preguntas 2

Ordenar por:

¿Quieres ver más aportes, preguntas y respuestas de la comunidad?

o inicia sesión.

Si están en Linux y les da un error de permisos
Para cambiar los permisos. En /var/www
sudo chown -R www-data:${USER} html
Entonces, tanto Apache como el usuario podrán “jugar” con archivos

Fuente

Comparto código con algunas validaciones mencionadas por el buen RetaxMaster.

<?php

$basename = $_FILES["image"]["name"];
$image = $_FILES["image"]["tmp_name"];
$ruta_a_subir = "images/$basename";
$tipo_archivo = $_FILES["image"]["type"];
$error_de_carga = $_FILES["image"]["error"];
$partes_archivo = explode(".",$basename);
$extension_archivo=strtolower(end($partes_archivo));
$extensiones_permitidas=["jpg","png","svg","ico"];
/*
echo "<pre>";
var_dump($_FILES);
var_dump($extension_archivo);
echo "</pre>";
*/

//Validamos si hubo algun error al cargar el archivo
if ($error_de_carga == UPLOAD_ERR_OK)
{
    //Validamos que sea un tipo de archivo permitido
    if (in_array($extension_archivo,$extensiones_permitidas))
    {
        //Copiamos la imagen a la carpeta del servidor
        if (move_uploaded_file($image, $ruta_a_subir)){
            $mensaje = "Imagen subida correctamente";
        }else{
            $mensaje= "Huston tuvimos un problema - Verifica que tengas permisos para manipular el servidor ";
        }
    }else{
        $mensaje = "Huston tuvimos un problema - Extensión no valida <br>
                    Extensiones validas (".implode(',', $extensiones_permitidas).")";
    }
}else{
    $mensaje="¡Ups! algo salio mal - $error_de_carga";
}

?>

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    
    <h2><?= $mensaje ?></h2>
    <img src="<?= $ruta_a_subir ?>" alt="<?= $basename ?>">

</body>
</html>

podemos usar la función getimagesize para validar si lo que se envía es una imagen y no otro tipo de archivo, así evitamos que envíen pdf’s o otro tipo de archivos que no se deberían poder enviar.

No hay caso. No me funciona. No me mueve la imagen a la carpeta y ni siquiera se si la imagen está en esa carpeta temporal ya que tampoco la puedo encontrar :Sweat

Guardar los archivos directamente en el servidor desde el formulario nos deja expuesto a un hackeo https://book.hacktricks.xyz/pentesting-web/file-upload

La solución sería usar servicios como Amazon S3 o Azure Storage, la otra sería guardarlo en una ruta en la que no podamos acceder directamente al archivo, a toda costa debemos evitar la carpeta pública

😎 Yo aprendiendo a subir archivos desde el Frontend y guardarlos en el Backend.

Cuando se envian archivos al servidor, PHP lo almacenara de forma temporal en un directorio, por lo que es importante que este lo guardemos en una carpeta, de lo contrario este archivo sera eliminado, para esto lo hacemos con la funcion

<?php 
move_uploaded_file($nombreTemporal, $rutaConFileName)
?>

Pasa saber si el archivo ya existe podemos usar la funcion file_exists https://www.php.net/manual/es/function.file-exists.php

if (file_exists($ruta_subir)){
        echo "El archivo ya existe";
    }else{
        move_uploaded_file($file, $ruta_subir);
    }

Se me ocurre que para la foto de perfil, guardar en la BD la ruta de la imagen y así cuando el usuario inicie sesión, poder recuperar desde la BD, la ruta de su imagen.
La pregunta es, ¿En donde guardar las imágenes para ese caso de uso? En el servidor igual?
Comparto mi apunte de la clase de hoy, añadí la validación de si ya existe el archivo en la carpeta, no lo sobrescriba 😜

Index

<!DOCTYPE html>
<html lang="es">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>iJCode - Guardando imagenes en el Servidor</title>
</head>
<body>
  <!-- Creando Formulario -->
  <!-- Cambiando la encriptación del formulario para el envío de imágenes -->
  <form action="./server.php" method="post" enctype="multipart/form-data">
    <label for="name">Ingresa el nombre</label>
    <input type="text" name="name" id="name">

    <label for="image">Selecciona la imágen</label>
    <input type="file" name="image" id="image">
    
    <button type="submit">Enviar Formulario</button>
  </form>
</body>
</html>

Server

<?php
// Obteniendo la información mandada
$name = (isset($_POST['name'])) ? $_POST['name']: 'Sin nombre';

echo("<b>El nombre es: </b>");
echo($name);


echo("<br><b>Los datos de la imágen son:</b>");
echo("<pre>");

var_dump($_FILES);

echo("</pre>");


// Obteniendo la imagen de la carpeta temporal y guardandola en una carpeta dentro del proyecto
$imageTemporal = $_FILES['image']['tmp_name'];
$baseName = $_FILES['image']['name'];
$path = "./images/$baseName";

// Se comprueba, si no existe la imagen en la ruta, se mueve la imagen de la carpeta temporal a la carpeta 'images' dentro del proyecto
if(!(file_exists($path))){
  move_uploaded_file($imageTemporal, $path);
}
?>

<!-- Mostrar la imagen -->
<!DOCTYPE html>
<html lang="es">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>iJCode - Imagen guardada</title>
</head>
<body>
  <h1>La imágen guardada es</h1>
  <img src="<?= $path ?>" alt="<?= $basename ?>" width="300"/>
</body>
</html>

Resultado

formulario.php

<!DOCTYPE html>
<html lang="es">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Envío de Imágenes</title>
</head>
<body>
    <form action="server.php" method="post" enctype="multipart/form-data">
        <label>Nombre: <input type="text" name="nombre"></label>
        <label>Imagen: <input type="file" name="image"></label>
        <button type="submit">Mandar formulario</button>
    </form>
</body>
</html>

server.php

<?php

$basename = $_FILES["image"]["name"];
$image = $_FILES["image"]["tmp_name"];
$ruta_a_subir = "images/$basename";

move_uploaded_file($image, $ruta_a_subir);