separar código para segur MVC

js/cabecera.js

@@ -60,12 +60,25 @@ function comprobarSesion() {
       `;
       contenedor.html(htmlUsuario);
 
+      // Si estamos en la página de perfil, rellenamos nombre y foto
+      if ($("#nombre").length) {
+        $("#nombre").text(respuesta.usuario.nombreUsuario);
+        // ?t= evita que el navegador enseñe la foto antigua en caché
+        $("#fotoPerfil").attr("src", avatarUrl + "?t=" + new Date().getTime());
+      }
+
       // Si estamos en la página principal, mostramos el botón JUGAR
       if ($("#colBotonJugar").length) {
         $("#colBotonJugar").removeClass("d-none");
         $("#colRanking").removeClass("col-lg-8").addClass("col-lg-7 col-xl-8");
       }
     } else {
+      // Si estamos en el perfil y no hay sesión, volvemos al inicio
+      if ($("#nombre").length) {
+        window.location.href = "index.php";
+        return;
+      }
+
       // No hay sesión: Botones de Login y Registro
       const htmlInvitado = `
         <button type="button" class="btn btn-kahoot-login rounded-pill px-4" data-bs-toggle="modal" data-bs-target="#modalLogin">

perfil.php

@@ -1,17 +1,3 @@
-<?php
-if (session_status() === PHP_SESSION_NONE) {
-    session_start();
-}
-
-// Redirección si el usuario no ha iniciado sesión
-if (!isset($_SESSION['idUsuario'])) {
-    header('Location: login.php');
-    exit();
-}
-
-$nombreUsuario = htmlspecialchars($_SESSION['nombreUsuario'] ?? 'Usuario');
-$avatarUsuario = htmlspecialchars($_SESSION['avatar'] ?? 'img/avatars/defaultProfile.jpeg');
-?>
 <!DOCTYPE html>
 <html lang="es">
 
@@ -61,15 +47,13 @@ $avatarUsuario = htmlspecialchars($_SESSION['avatar'] ?? 'img/avatars/defaultPro
                     <div class="col-md-6 text-center">
 
                         <!-- Nombre -->
-                        <h1 id="nombre" class="nombre">
+                        <h1 id="nombre" class="nombre"></h1>
-                            <?= $nombreUsuario ?>
-                        </h1>
 
                         <!-- FOTO DE PERFIL -->
                         <div class="foto-container">
 
                             <img id="fotoPerfil"
-                                 src="<?= $avatarUsuario ?>"
+                                 src="img/avatars/defaultProfile.jpeg"
                                  alt="Foto de perfil"
                                  class="avatar rounded-circle">
 
@@ -310,7 +294,7 @@ $avatarUsuario = htmlspecialchars($_SESSION['avatar'] ?? 'img/avatars/defaultPro
 
     <!-- Tu JavaScript -->
     <script src="js/perfil.js"></script>
-        <script src="js/cabecera.js"></script>
+    <script src="js/cabecera.js"></script>
 </body>
 
 </html>