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 鈥渏ugar鈥 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鈥檚 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);