问使用Ajax和PHP的登录系统--我如何提高安全性和控制用户权限？

EN

这是几年来我第一次在业余时间尝试实现一个小项目。它没什么大的，只会在本地计算机上运行。但是由于我想学习一些新的东西，所以我想把重点放在动态内容上。

用户必须登录才能访问登陆页面。显示的内容取决于用户权限。

在过去，我只是把PHP和HTML混合在一起，得到了一些糟糕的代码(在我看来)，因为我在body标记中有PHP代码。

我在每个页面和子页面上的代码总是以

 <?php

      session_start();
      //check permissions and if the user is logged in
      //redirect to login.php if not

      //create navigation bar based on user permission or include another .php file

      ?>

有时我甚至还附和HTML代码。

我第一次尝试使用“现代”技术将后端与前端完全分离，并将代码.html代码与任何PHP片段保持干净。我尝试在前端使用基本的HTML/CSS/JS，在后端使用任何东西(现在是PHP)。

现在，我的“检查”是使用ajax和PHP脚本来检查用户是否拥有查看内容的权限。

我有一个用于页面(或部分)的load事件的事件处理程序，并将该值传递给PHP，下面是我的start.html的示例

document.addEventListener('DOMContentLoaded', function() {
  var verusr = new XMLHttpRequest();
  verusr.open('GET', '/inc/php/login.php');

  verusr.onload = function() {
      if (verusr.status === 200) {
        if(verusr.responseText !== 'true') {
          window.location = 'login.htm';
        }
      }
      else {
        alert('Request failed.');
      }
    };
    verusr.send();

  }

我的login.php做了所有的验证工作，创建了一个会话，并且回显的是真或假。

这是保护站点的安全方法吗？

我想这并不是因为如果用户禁用JavaScript，就可以看到内容，对吗？

所以这里的解决方法是动态地构建页面的内容。

现在我的导航看起来是：

  <nav class="main">
                <ul>
            <li><a href="#1">Test1</a></li>
            <li><a href="#2">Test2</a></li>
            <li><a href="#3">Test3</a></li>
            <li class="right"><a href="/inc/php/logout.php">Logout</a></li>
                </ul>
            </nav>

如果有人访问我的网站，任何人都会看到JavaScript的残疾。这不是什么大问题，但也不太好。

这里的一个可能的解决办法是更动态地构建页面，对吗？

例如，我可以返回一个JSON，而不是包含所有可以访问的东西的true/false，并调用一个函数"createNav“，它循环遍历每个数组元素并创建一个列表元素？

这是一种安全的方法吗？因为在JS运行之前没有任何内容，所以您不能禁用它来查看任何内容。

但是，尽管存在安全问题，它是否足够快？

我打算继续这样做。如果有人单击链接#1，它将触发AJAX (将"1“传递给脚本)，脚本将决定显示什么数据，但JS决定如何构建内容。

或者，返回到.html文件的“链接”就足够了，然后就可以包含它了吗？这个文件本身有一个onload事件来阻止它直接访问？

因为以前我使用PHP代码段来保护我的页面和子页面(它们已经包括在内)，但是用AJAX与这个片段交互对它进行保护对我来说很困难，因为您不必运行脚本，或者您可以操作脚本的返回(或者修改脚本本身)。

但是，当客户端在第一时间没有任何数据(尽管有StyleSheet)时，它应该会有所帮助。

我希望我能解释我的意思，我期待你的意见。