使用 Javascript 创建用户名和密码

Question

我看到了与此类似的其他问题，但我尝试了答案，但它似乎没有达到我想要的效果（如果有但我看不到它，请告诉我在 cmets 中。我对此很陌生）。

我想用密码保护一个网站（这是一个个人家庭网站，所以我不担心加密或任何事情，除非用 javascript 超级容易做到），这样只有我的家人才能上。我希望密码是个性化的。

HTML 代码

<form id="usr-psswd">
  Name: <input type="text" name="name" id="name">
  Username: <input type="text" name="usr" id="usr">
  Password: <input type="text" name="psswd" id="psswd">
  <input type="button" onclick="submission()" value="Submit">
</form>

脚本代码

function submission(){
  var name = document.getElementByID = "name";
  var psswd = document.getElementByID = "psswd";
  var usr = document.getElementByID = "usr";

  var name = new Array();
  var usr = new Array();
  var psswd = new Array();
}

我的问题：我如何让 javascript 将输入放入保留在页面上的数组中，以便当您尝试访问 index.html（密码保护所在的位置）时这样他们就不必每次都进行设置？

另外，如果足够简单，我如何通过加密运行多个密码并将其保存在网页上，以便如果有人碰巧进入这里密码是安全的？

是的，我意识到 var name var psswd 和 var usr 重复了两次。那是因为我现在懒得给它们命名不同的东西。我只需要知道如何将var name = document... 放入var name = new...。谢谢！

Answer 1

我知道您说过您想对网站进行简单的身份验证，但是在 JavaScript 中执行此操作是不安全的，并且用户名/密码很容易检索。

如果你想做一些非常简单和快速的事情。我建议你使用.htaccess进行身份验证：

为此，系统需要两个文件——.htaccess 文件和.htpasswd 文件：

.htaccess 代码：

AuthType Basic
AuthName "restricted area"
AuthUserFile /home/user/html/protect-me-dir/.htpasswd
require valid-user

上面的代码在根级别保护了一个名为protect-me-dir 的目录。 AuthUserFile 值始终特定于您的主机配置。如果您不知道该值应该是什么，请执行 phpinfo() 并找到 DOCUMENT_ROOT 值。

---

.htpasswd 代码：

your_username:your_password
another_user:another_password
you_get:the_idea

.htpasswd 文件包含允许用户的用户名和密码。每行一个。

---

否则，我可能会做一些更有趣的事情，例如使用 PHP 和数据库的组合进行正确的登录。

我希望这会有所帮助。