javascript - js密码保护目录

标签 javascript password-protection

是否可以用密码保护(网站用户)服务器上的某些目录?它不一定是安全的,因为它只是为了防止学习者下载/访问其他类(class)的 Material 。学习者不是很精通技术,所以这没什么大不了的。

假设我有包含 3 门类(class)的目录: /类(class)1 /类(class)2 /类(class)3

我希望每个目录都有自己的密码,这样我就可以通过电子邮件将其 url 和密码发送给学习类(class) 1 的学习者。 我该怎么做?我对服务器的访问权限非常有限,因此客户端是唯一的选择。

最佳答案

Download the example here.

考虑到 Maximillian Laumeister 的想法,我想到了这个。这可能不是一个完美的解决方案,但应该可行。

您将所有资源加密存储在服务器上,以纯文本文件的形式编码为 base64。用逗号分隔,您可以在前面添加所需的 MIME 类型。例如。

  • main : ( CryptoJS.AES.encrypt('<a href="http://localhost:8080/_/more">Read more</a>', "hello").toString(); )

    text/html;U2FsdGVkX19Tdq6V7swK/7NgnwR8JgZ1dYZEkfT9hx+QKzFrpyqKeuo0Tv25ozYkAxIIt65G9DKmOYU6tmZ0Dp/I4BuopQ/3xHClB+K+BX8=
    
  • more : ( CryptoJS.AES.encrypt('<h1>More</h1><p>Lorem ipsum dolor sit</p>', "hello").toString(); )

    text/html;U2FsdGVkX19GdZ+SRQ9vM2Amiyu0OqOOSX7X5IOCcLfHMpHHgI0h/mxS8iuUggfqmFBN+yXy53z445ZW1mAlHQ==
    

在超链接中,您必须在 URL 中放置一些内容 ( _/ ) 导致 404,稍后可以将其删除,并且您必须指定包括服务器在内的协议(protocol)。这是脚本拦截请求、停止它、请求正确的 URL 并解码响应的唯一方法。 (需要 404,否则浏览器将直接下载指定的文件,而不会调用 load 事件处理程序。)

然后您创建一个 index.html包含 iframe 并要求用户输入密码的页面,然后将密码保存在某个范围内,这样 XSS 攻击就无法检索该值。

<html>
    <head>
        <meta charset="utf8">
    </head>
    <body>
        <iframe id="theIframe"></iframe>
        <script src="http://crypto-js.googlecode.com/svn/tags/3.1.2/build/rollups/aes.js"></script>
        <script src="script.js"></script>
    </body>
</html>

这允许您请求一个 URL,对接收到的 base64 内容进行解码,并尝试使用给定的密码对其进行解密。然后,您可以通过数据 URL 将解密的内容设置为 iframe 的内容。

(function(){
    var iframe = document.getElementById("theIframe");
    var password = prompt("Enter the password!");
    var allowEvent = true;

    function presentURL(url){
        allowEvent = false;
        var req = new XMLHttpRequest();
        req.addEventListener("load", function(){

            var splitters = this.responseText.split(";", 2);
            var type = splitters[0];
            var encrypted = splitters[1];

            var decrypted = CryptoJS.AES.decrypt(encrypted, password).toString(CryptoJS.enc.Utf8); //Decrypt
            var data = window.btoa(decrypted); //Encode the decrypted data into base64

            iframe.src = "data:" + type + ";base64," + data;

        });
        req.open("GET", url);
        req.send();
    }

    presentURL("/main");

    iframe.addEventListener("load", function(e){
        e.preventDefault();
        if (allowEvent){
            iframe.contentWindow.stop();
            //remove the 404 cause and call presentURL
            presentURL(iframe.contentWindow.location.href.replace(/_\//, ""));
        }
        else {
            allowEvent = true;
        }
    });
})();

上面的例子使用了CryptoJS并且可能无法跨浏览器工作!

这段代码确实有效!

关于javascript - js密码保护目录,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/32801107/

相关文章:

javascript - 在javascript中,下面的代码是如何工作的

javascript - javascript 对象的元素是否按特定顺序初始化?

Javascript 密码保护区..一定是更好的方法

maven - mvn --encrypt-master-password <密码> 如何工作?

javascript - 检测浏览器是否将 <select multiple> 显示为模态对话框

javascript - 如何检测包含的关系是否正在加载

javascript - 从 YouTube URL 检索 JSON

.htaccess - 使用 .htaccess 为页面设置密码,没有用户名,只有密码和 html 表单

android - 保护应用程序中的对称 key

authentication - 在 nginx 上使用一次性 cookie 进行非常简单的身份验证