Como subir una imagen con un formulario en PHP

Hola a todos, hoy os voy a explicar como podemos subir una imagen con un formulario en PHP.

Es habitual que en nuestra aplicación web podamos subir imágenes a nuestro servidor desde el cliente.

Este seria nuestro HTML:


<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Ejemplo subir imagen</title>
</head>

<body>

    <form action="subir-imagen.php" enctype="multipart/form-data" method="post">

        <input type="file" name="imagen">

        <input type="submit" value="Subir">

    </form>

</body>

</html>

Es importante que en el form tenga el atributo enctype=”multipart/form-data” ya que sino no podremos subir los archivos.

Create la carpeta imagenes en la carpeta donde vayas a subir los archivos.

La forma de acceder a las imagenes de un servidor es con $_FILES con el nombre del name del input file. Este es su contenido:

Este seria nuestro PHP:


<?php 

$path = "imagenes/". basename($_FILES['imagen']['name']); 

if(move_uploaded_file($_FILES['imagen']['tmp_name'], $path)) {
    echo "El archivo ".  basename( $_FILES['imagen']['name']). " ha sido subido";
} else{
    echo "El archivo no se ha subido correctamente";
}

La función basename devuelve el nombre del fichero de una ruta.

La función move_uploaded_file es la que copia el archivo a la carpeta indicada.

Este es el resultado:

Ahora la cosa es, ¿y si necesito validar que la imagen sea de una extensión concreta? Lo podemos hacer con el campo type. Por ejemplo, si queremos controlar que solo sean imagenes png:


<?php 

$errores = "";

if($_FILES['imagen']['type'] !== 'image/png'){
    $errores .= "- La imagen debe ser de la extensión PNG.";
}

if(empty($errores)){
    $path = "imagenes/". basename($_FILES['imagen']['name']); 

    if(move_uploaded_file($_FILES['imagen']['tmp_name'], $path)) {
        echo "El archivo ".  basename( $_FILES['imagen']['name']). " ha sido subido";
    } else{
        echo "El archivo no se ha subido correctamente";
    }
}else{
    echo $errores;
}

Compliquemoslo un poco más, ¿y si queremos controlar el tamaño de las imágenes? Limitamos el tamaño a 2 MB.


<?php 

$errores = "";

if($_FILES['imagen']['type'] !== 'image/png'){
    $errores .= "- La imagen debe ser de la extensión PNG.";
}

if($_FILES['imagen']['size'] >= 2097152){ // 2MB
    $errores .= "- La imagen debe ser de la extensión PNG.";
}

if(empty($errores)){
    $path = "imagenes/". basename($_FILES['imagen']['name']); 

    if(move_uploaded_file($_FILES['imagen']['tmp_name'], $path)) {
        echo "El archivo ".  basename( $_FILES['imagen']['name']). " ha sido subido";
    } else{
        echo "El archivo no se ha subido correctamente";
    }
}else{
    echo $errores;
}


Te dejo el ejemplo para descargar aquí.

Espero que os sea de ayuda. Si tenéis dudas, preguntad. Estamos para ayudarte.

Etiquetas

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *