Как передать данные из PHP в JS

Я делаю сайт "Мир обоев", в котором у меня есть примитивная система аутентификации и простой шаблонизатор. Я сделал кнопку выхода по умолчанию скрытой. Когда пользователь успешно авторизуется через кнопку форму входа, мне нужно отобразить кнопку выхода. Логика аутентификации у меня описана в index.php(шаблонизатор). Я попробовал объявить переменную в php и засунуть ее в hidden input. А потом уже в самом js файле вытащить ее. Но кнопка все равно не появляется. Где я сделал что-то не так?

index.php:

<?php
session_start();
$Log="Fail";
// Проверка, если форма входа была отправлена
if ($_SERVER["REQUEST_METHOD"] === "POST" && isset($_POST["username"]) && isset($_POST["password"])) {
  $username = $_POST["username"];
  $password = $_POST["password"];

  // Проверка учетных данных (замените на свой механизм аутентификации)
  if ($username === "admin" && $password === "adminpass") {
      // Устанавливаем сессию для администратора
      $_SESSION["admin"] = $username;
      header("Location: admin.php");
      exit();
  } elseif ($username === "user" && $password === "userpass") {
      // Устанавливаем сессию для обычного пользователя
      $_SESSION["user"] = $username;
      $Log='Success';
  }
}

?>
<!DOCTYPE html>
<html lang="ru">

  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Мир Обоев</title>
    <link rel="stylesheet" href="../css/common.css" />
    <link rel="stylesheet" href="https://code.s3.yandex.net/web-code/fonts/fonts.css" />
    <script src="../js/loginAnimate.js" defer> </script>
  </head>

  <body> 
  <input type="hidden" id="log" value="<?php echo $Log; ?>">
       <?php require "elements/header.php" ?>

       <div class="container">

          <?php require "elements/menu.php"?>

          <?php require "elements/login-form.php" ?>

          <?php require "elements/content.php"?>

       </div>

        <?php require "elements/footer.php"?>

  </body>
</html>

login.js:

document.addEventListener("DOMContentLoaded", function () {
    const loginButton = document.querySelector(".loginButton");
    const loginFormContainer = document.getElementById("login-form-container");
    const closeLoginFormButton = document.getElementById("close-login-form");
    const logoutButton = document.getElementById("logoutButton");
    const logValue = document.getElementById("log").value;

    if (logValue === "Success") {
        logoutButton.style.display = "flex";
    }

    loginButton.addEventListener("click", function () {
        loginFormContainer.style.display = "flex";
    });

    closeLoginFormButton.addEventListener("click", function () {
        loginFormContainer.style.display = "none";
    });

    logoutButton.addEventListener("click", function () {
        logoutButton.style.display = "none";
    });
});

сайт

проект


Ответы (1 шт):

Автор решения: Rus
<?php if(!empty($_SESSION['admin'])): ?>
<button>Кнопка выхода</button>
<?php endif; ?>
→ Ссылка