Javascript Pagina com acesso restrito

[Arkcanjou]

Estou iniciando em programação Web e preciso fazer uma pagina que só pode ser acessada caso o usuario esteja logado. A forma que encontrei para fazer isso foi


Servidor:

getAcess: async(req, res) => {
        const token = req.body.token


        if(!token){
            return res.status(401).json({msg: 'É necessario estar logado para acessar esta pagina'})
        }

        jsontoken.verify(token, hash.token_hash, (err, decoded) => {
            if(err) {
                return res.status(401).json({msg: err})
            }
    
            req.userid = decoded

            const paginaAcesso = path.join(__dirname, './acesso_restrito.html');
            return res.sendFile(paginaAcesso);
        })
    }

Cliente:
 

<div id="conteudo"></div>

<script>
        function carregarConteudo() {
            fetch(api_url)
                .then(response => {
                    if (!response.ok) {
                        throw new Error(`Erro na requisição: ${response.status}`);
                    }
                    return response.text();
                })
                .then(htmlContent => {
                    document.getElementById('conteudo').innerHTML = htmlContent;
                })
                .catch(error => {
                    console.error('Erro:', error);
                });
        }
        window.onload = carregarConteudo;
    </script>

Porém desse forma o scripts contidos na acesso_restrito.html não são funcionais.

Existe uma maneira melhor de fazer uma pagina com acesso restrito ? 

 

[DiF]

@Arkcanjou A maneira que eu sempre usei, foi mais simples e confiável...

 

 segue o jeito que eu sempre usei:

 

Na página restrita logo depois que loga no sistema:

por exemplo:  

 

arquivo que recebe os dados vindo do form do login...  chamamos de  validaUsuario.php por exemplo:

 

<?php
session_start();
	
	$login = $_POST["usuario"];
	$senha = $_POST["senha"];
	$login_escape = addslashes($login);
	$senha_escape = addslashes($senha);
	
	
	if (empty($login) or empty($senha)) {
    echo "<script>
          alert('Preencha todos os campos');
          history.go(-1);
          </script>";
    exit;    
  }
	
	
	include '../conexao/conexao.php';
	
	$sql = "SELECT idAdmin, login, senha, ultimoacesso FROM admin WHERE login ='$login_escape' AND senha = '$senha_escape' ";
	$dados = mysqli_query($sql, $conexao);
	$num = mysqli_num_rows($dados);
	
	if ($num == 0){
		echo "<script>
				alert('Usuario ou senha Incorreta');
				history.go(-1);
			  </script>";
		exit;
	} else {
		
		while($admin = mysqli_fetch_object($dados)){
			$coduser = $admin->idAdmin;
			$ultimoacesso = $admin->ultimoacesso; 
		
			
		$_SESSION["codusuario"] = $coduser;
		$_SESSION["login"] = $login;
		$_SESSION['ultimoacesso'] = $ultimoacesso;
		
		$data = date('Y-m-d');
  		//$hora = date('H:i:s'); 
		$log = "INSERT into logs(idAdmin, idAcao, data, hora) values($coduser, '1', '$data', curtime())";
		$dados2 = mysqli_query($log);	
		
		header ("Location: view/gpainel.php");
		}	
	}
	// mysql_free_result($dados);
 	 mysqli_close($conecta);

 

Basicamente, o código, recebe o login e senha do usuário do form,  adiciona umas barrras para evitar sql injection, testa se os campos não estão vazios..

Procura na tabela se já existe o usuário.. caso exista, ele pega os dados do usuário e armazena em uma sessão, o código do usuário, o login usado, e a data..

 e então faz uma inserção na tabela de logs...  depois disso redireciona  a pessoa para a página da area restrita.

 

 

E então na página da área restrita:

 

 

areaRestrita.php

<?php 
session_start();
	setcookie("ck_authorized", "true", 0, "/");
	date_default_timezone_set("Brazil/East");
	
	if(!isset($_SESSION["login"]))
		header("location: ../index.php"); 
	else
		$login = $_SESSION["login"];	
		$ultimo = $_SESSION['ultimoacesso'];
		$idAdmin = $_SESSION["codusuario"];
		
	require '../../conexao/conexao.php';	
	require '../includes/functions.php';

		$data = date('Y-m-d H:i:s'); 
		$sqldata = "UPDATE admin SET ultimoacesso= '$data' WHERE idAdmin='$idAdmin'";
		$dados = mysqli_query($sqldata);	

?>

 

Isso vai no topo de tudo, acima de qualquer coisa.

 

Basicamente, ele cria uma session,  e um cookie..

 

Testa se o login está na sessão... se não tiver, ele cai no header()  e redireciona a pessoa para a página de login para ela efetuar o login..

 

senão, cai no else, e coloca os dados numa sessão.. ou seja, ali eu defini o login  onde pode ser o nome de usuário ou pode ser um e-mail... é preferível que você use o email como login, pois é algo que a pessoa jamais esquece.

 

os outros dois ali... eu coloquei para manter um registro.. ou seja ele identifica o ultimo acesso e o código do usuário cadastrado no banco de dados...

Mais abaixo,  ele monta a data e faz uma atualização na tabela de ultimo acesso, para registrar  quem e quando a pessoa entou pela ultima vez.