PHP - ¿Actualizar imágen de perfil al momento de cargarla?

 
Vista:
sin imagen de perfil
Val: 18
Ha aumentado su posición en 6 puestos en PHP (en relación al último mes)
Gráfica de PHP

¿Actualizar imágen de perfil al momento de cargarla?

Publicado por David (9 intervenciones) el 19/04/2020 16:42:07
Hola gente. Tengo una página de perfil de usuario. En el siguiente código consigo que el usuario actualice su foto de perfil pero no logro que los cambios se vean al momento, es decir, funciona pero para ver el cambio de foto tengo que clicar sobre la url del navegador o salir de la sesión y volver a entrar. Ojala me puedan ayudar,gracias. Código a continuación.

CÓDIGO DE PERFIL-VISTA.PHP:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
<?php
session_start();
$datosUsuario = $_SESSION["datosUsuario"];
require_once "../controladores/perfil-controlador.php";
?>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title><?php echo $datosUsuario["nombre_usuario"]; ?></title>
    <?php require_once "../css/bootstrap/bootstrap-cdn-head.php";?>
    <link rel="stylesheet" href="../css/custom-style.css">
</head>
<body>
    <header>
    <?php
        require_once "../vistas/header-vista.php";
    ?>
    </header>
 
    <main class="perfil">
        <div class="container pt-4">
            <div class="row jumbotron portada">
            </div>
 
            <div class="col-md-6 mb-4 imagen-perfil">
 
                <img class="rounded-circle z-depth-2" alt="100x100" src="../img/usuarios/<?php echo $datosUsuario["imagen_usuario"]; ?>"
                data-holder-rendered="true">
 
            </div>
 
            <div class="row d-flex flex-column text-center jumbotron descripcion">
                <div class="contenido">
                    <h2><?php echo $datosUsuario["nombre_usuario"] ." ". $datosUsuario["apellidos_usuario"]; ?></h2>
                    <p><?php echo $datosUsuario["descripcion"]; ?></p>
                    <p><strong>Estado civil:</strong><?php echo $datosUsuario["relacion"]; ?></p>
                    <p><strong>Lugar de residencia:</strong><?php echo $datosUsuario["pais_usuario"]; ?></p>
                    <p><strong>Miembro desde:</strong><?php echo $datosUsuario["fecha_registro_usuario"]; ?></p>
                    <p><strong>Género:</strong><?php echo $datosUsuario["genero_usuario"]; ?></p>
                    <p><strong>Fecha de nacimiento:</strong><?php echo $datosUsuario["nacimiento_usuario"]; ?></p>
                    <div>
                        <form method="post" action="" enctype="multipart/form-data" class="d-flex flex-column text-center">
                            <button class="btn btn-primary" id="cambiarFoto" name="cambiarFoto" type="submit">Cambiar Foto</button>
                            <button class="btn btn-success" name="cambiarPortada" type="submit">Cambiar Portada</button>
                            <div class="custom-file">
                                <input type="file" class="custom-file-input" name="botonSubida">
                                <label class="custom-file-label" for="botonSubida">Selecciona imagen</label>
                            </div>
                        </form>
                    </div>
                </div>
            </div>
        </div>
    </main>
    <?php require_once "../css/bootstrap/bootstrap-cdn-footer.php";?>
</body>
</html>

CÓDIGO DE PERFIL-CONTROLADOR.PHP
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
<?php
// guarda id de usuario
$id_usuario = $datosUsuario["id_usuario"];
// guarda imagen perfil usuario antes de actualizar
$imagenPerfilActual = $datosUsuario["imagen_usuario"];
 
if ($_SERVER["REQUEST_METHOD"] == "POST") {
 
    if (isset($_POST["cambiarFoto"])) {
 
        $imagen = $_FILES["botonSubida"]["name"];
        $directorioServidor = "../img/usuarios/" . basename($imagen);
        $directorioOrigen = $_FILES["botonSubida"]["tmp_name"];
 
        // si no ha seleccionado imagen
        if ($imagen == "") {
            // carga en sesion la imagen que tenia antes de darle al botón de cambiar foto
            $_SESSION["datosUsuario"]["imagen_usuario"] = $imagenPerfilActual;
            // carga en sesión el array de datos del usuario con laimagen que tenía para que no se quede sin imagen
            $datosUsuario = $_SESSION["datosUsuario"];
            echo "<script>alert('Seleccione una imágen')</script>";
            echo "<script>open.window('../vistas/perfil-vista.php?u_id=".$id_usuario."' , '_self')</script>";
        }
 
        else {
            // valida directorio origen
            $check = getimagesize($directorioOrigen);
 
            if($check !== false) {
                // si valida actualiza imagen en directorio
                move_uploaded_file($directorioOrigen, $directorioServidor);
                // se ejecuta código de update sql en perfil.modelo.php
                require_once "../modelos/perfil-modelo.php";
 
                // valida update en base de datos
                if ($actualizacionExitosa) {
                    // carga en sesión la nueva imagen
                    $_SESSION["datosUsuario"]["imagen_usuario"] = $imagen;
                    $datosUsuario = $_SESSION["datosUsuario"];
                    echo "<script>alert('La imagen ha sido cargada correctamente')</script>";
                    echo "<script>open.window('../vistas/perfil-vista.php?u_id=".$id_usuario."' , '_self')</script>";
                }
 
                else {
                    // carga en sesion la imagen que tenia antes de darle al botón de cambiar foto
                    $_SESSION["datosUsuario"]["imagen_usuario"] = $imagenPerfilActual;
                    // carga en sesión el array de datos del usuario con laimagen que tenía para que no se quede sin imagen
                    $datosUsuario = $_SESSION["datosUsuario"];
                    echo "<script>alert('Seleccione una imágen')</script>";
                    echo "<script>open.window('../vistas/perfil-vista.php?u_id=".$id_usuario."' , '_self')</script>";
                }
            }
            // si no valida imagen error
            else {
                echo "<script>alert('El archivo seleccionado no es una imagen')</script>";
                echo "<script>open.window('../vistas/perfil-vista.php?u_id=".$id_usuario."' , '_self')</script>";
            }
        }
    }
}
?>

CÓDIGO DE PERFIL-MODELO.PHP:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
<?php
// crea conexión al servidor
$conexion = new mysqli("localhost", "root", "", "zero");
 
// variables de usuario que hay en sesión
$email = $datosUsuario["email_usuario"];
 
// carga la imagen nueva en base de datos
$update = "update usuarios set imagen_usuario = '$imagen' where email_usuario = '$email'";
$actualizaUsuario = $conexion->query($update);
 
// valida update
if ($actualizaUsuario) {
    $actualizacionExitosa = true;
}
 
else {
    $actualizacionExitosa = false;
}
 
//cierra conexion a base de datos zero
mysqli_close($conexion);
?>
Valora esta pregunta
Me gusta: Está pregunta es útil y esta claraNo me gusta: Está pregunta no esta clara o no es útil
0
Responder
Imágen de perfil de Julio
Val: 2.007
Plata
Ha mantenido su posición en PHP (en relación al último mes)
Gráfica de PHP

¿Actualizar imágen de perfil al momento de cargarla?

Publicado por Julio (830 intervenciones) el 19/04/2020 18:15:11
Hola.

Pon un var_dump($datosUsuario) en la línea 5 (DESPUÉS del require_once) y comprueba a ver si está el nombre de la imagen después de enviar el formulario.

-----------------------------
Aprende la programación desde una perspectiva básica y simplista en Programación Básica
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
1
Comentar
sin imagen de perfil
Val: 18
Ha aumentado su posición en 6 puestos en PHP (en relación al último mes)
Gráfica de PHP

¿Actualizar imágen de perfil al momento de cargarla?

Publicado por David (9 intervenciones) el 19/04/2020 20:47:44
Hola Julio.

He probado a hacer el var_dump($datosUsuario) y he comprobado que se mantiene el nombre de la antigua imagen, curioso que al actualizar la página clicando enter en la url si se vea la imagen nueva y se actualice. Lo que no entiendo es como es posible, en el fichero perfil-controlador.php en las líneas 38 y 39 modifico el array $datosUsuario actualizando el par clave/valor de la imagen_usuario. Algo se me esta escapando y creo que tiene que ver con el tema de las sesiones o la caché.
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
Imágen de perfil de Julio
Val: 2.007
Plata
Ha mantenido su posición en PHP (en relación al último mes)
Gráfica de PHP

¿Actualizar imágen de perfil al momento de cargarla?

Publicado por Julio (830 intervenciones) el 19/04/2020 20:51:49
Tiene pinta, sí.

Comprueba esto:

1
2
3
4
$datosUsuario = $_SESSION["datosUsuario"];
var_dump($datosUsuario); echo '<br><br>';
require_once "../controladores/perfil-controlador.php";
var_dump($datosUsuario);

Y mira a ver si $datosUsuario es igual antes y después de pasarle todo el perfil-controlador.php. Si son iguales es que hay algún paso que no está haciendo bien.

-----------------------------
Aprende la programación desde una perspectiva básica y simplista en Programación Básica
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
sin imagen de perfil
Val: 18
Ha aumentado su posición en 6 puestos en PHP (en relación al último mes)
Gráfica de PHP

¿Actualizar imágen de perfil al momento de cargarla?

Publicado por David (9 intervenciones) el 20/04/2020 13:49:39
Al final después de tanto analizar el código decidí hacer un cambio en perfil-controlador.php en la línea 36, justo deje de usar
1
echo "<script>open.window('../vistas/perfil-vista.php?u_id=".$id_usuario."' , '_self')</script>";
y pase a utilizar el
1
header('../vistas/perfil-vista.php?u_id=".$id_usuario."');
. Lo que no me queda claro es porque con open.window() no actualizaba la variable y con header().

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
// valida update en base de datos
if ($actualizacionExitosa) {
     // elimina antigua portada para no saturar el servidor
     unlink("../img/usuarios/".$imagenPerfilActual);
     // carga en sesión la nueva imagen
     $_SESSION["datosUsuario"]["imagen_usuario"] = $imagen;
     $datosUsuario = $_SESSION["datosUsuario"];
     header('../vistas/perfil-vista.php?u_id=".$id_usuario."');
     //echo "<script>alert('La imagen ha sido cargada correctamente')</script>";
     //echo "<script>open.window('../vistas/perfil-vista.php?u_id=".$id_usuario."' , '_self')</script>";
}
 
else {
     // carga en sesion la imagen que tenia antes de darle al botón de cambiar foto
     $_SESSION["datosUsuario"]["imagen_usuario"] = $imagenPerfilActual;
     // carga en sesión el array de datos del usuario con laimagen que tenía para que no se quede sin imagen
     $datosUsuario = $_SESSION["datosUsuario"];
     echo "<script>alert('Seleccione una imágen')</script>";
     echo "<script>open.window('../vistas/perfil-vista.php?u_id=".$id_usuario."' , '_self')</script>";
}
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
sin imagen de perfil
Val: 18
Ha aumentado su posición en 6 puestos en PHP (en relación al último mes)
Gráfica de PHP

¿Actualizar imágen de perfil al momento de cargarla?

Publicado por David (9 intervenciones) el 20/04/2020 13:57:52
Ahora acabo de entender cuál era el problema, en un principio estaba bien, es decir si que funcionaba con open.window() al igual que el header(). El tema es que ayer estaba teniendo problemas con mi fichero de estilos CSS, ya que realizaba alguna modificación y a pesar tener las nuevas reglas no se mostraban en la página (incluso en la consola de herramientas de desarrolladores tampoco salían las nuevas reglas que si estaban en el fichero CSS), entonces lo que hice fue añadirle al link de mi CSS en el fichero perfil-vista.php la siguiente instrucción:

1
<link rel="stylesheet" href="../css/custom-style.css?v=<?php echo time(); ?>">

Así con el echo time(); engañaba a la caché para que se actualizase correctamente los cambios. Ahora después de responderte he ido probar con open.window() otra vez y si funciona, así que el problema era de la caché.
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar