如何防止通过编辑html代码窃取文件？

Question

我有一个简单的 Flask 应用程序，可让您下载受登录名保护的图像。只有两条路线：

example.com/login
example.com/downloadpage

在您成功登录之前，您无法访问“下载页面”。这工作正常。文件夹结构如下所示：

--flaskapp.py
----static
------images
--------background.png
--------protectedimage.png
------stylesheet.css

登录页面如下所示：

< body style="background:url('../static/images/background.png');">
    <!--Login-->
</body>

如果您现在转到 example.com/login 并通过单击 Chrome 中的检查来更改浏览器中的源代码，例如，您可以轻松地将 '../static/images/background.png' 更改为 '../static/images/protectedimage.png' 受保护的图像将被设置为背景，您可以轻松保存它。你怎么能阻止用户这样做呢？当然，我希望他们能够通过单击example.com/downloadpage 上的下载按钮来下载受保护的图像。

Answer 1

直接通过 HTML、CSS、JS 或 PHP 它们无法解决您的问题。

您可以设置一个 .htaccess 文件而不是 PHP 来访问该页面。 一个更简单的解决方案可能是将文件复制到具有复杂名称的文件夹中，例如 SESSION ID，并通过 PHP 将路径设置为 SESSION ID/protectedimg.png

如果 SESSION 被销毁，只需再次删除该文件夹。

Answer 2

图像/CSS/JS 文件是可以以与常规 Flask 视图类似的方式保护的资源。

不要从static 文件夹下存储和提供资源，而是将资源存储在私有位置（可以使用Flask instance_paths）并创建使用send_file 为资源提供服务的路由。

路由需要检查current_user 是否经过身份验证和授权（为此使用角色）。路由还需要禁用资源的浏览器缓存。

一个简单的例子（@nocache 是一个设置适当响应头的装饰器）：

@app.route('/resource/image/<string:filename>')
@nocache
def resource_image(filename):

    if not current_user.is_authenticated:
        return '', 204

    _image_path = get_instance_path('images', filename)

    if not op.isfile(_image_path):
        print "Image not found : {}".format(_image_path)
        return '', 204

    print "Serving image : {}".format(_image_path)

    return send_file(_image_path)

路由将在 HTML 模板中使用如下：

<p>This is an unprotected page with a protected resource (image). If you are logged in you will see an image below.</p>
<img src="{{ url_for('resource_image', filename='black.jpg') }}">

<div style="padding:20px; height: 560px; width: 760px;background:url('{{ url_for('resource_image', filename='background.png') }}')">
    <p>If you are logged in you will see this paragraph is in a <code>div</code> that has a protected <code>background:url</code></p>
</div>

在 Github 上使用 Flask、Flask-Security 和 Flask-Alchemy 的完整工作示例 - https://github.com/pjcunningham/flask-protected-resource

Answer 3

我同意另一位发帖人的观点，即没有以您希望的方式解决您的问题。

不过，我要补充一点，您可以混淆受保护图像的文件名（例如：kjhsdfh978y3h4i2uhdllupyu878366jsf.jpg），因此人们几乎不可能在开发工具中猜出文件名。

这仍然不会使文件无法找到，但这是一个简单的修复方法，几乎​​可以阻止任何人。

Answer 4

嗯，虽然有一些方法可以阻止那些讨厌的用户，但没有方法可以阻止人们查看您的源代码并最终更改它。

Here's the link 从中复制了相关内容。

源代码填充

真的，书中最古老的把戏。它涉及添加一吨 代码开始前的空白，以便查看源菜单 显示为空白。但是，必须所有人都会注意到滚动条 并将滚动查找您的代码。无意义和愚蠢 这个方法，还有人用。

无右键单击脚本

这些脚本阻止用户右键单击，其中“查看源代码” 功能所在。缺点：出了名的难以跨越 浏览器并实际正常工作。右键菜单，或 上下文菜单，包括许多对用户有用的工具，包括 导航按钮和“书签页面”按钮。大多数用户不 请善待他们的浏览器功能被禁用，并且 倾向于不重新访问此类页面。查看源代码功能也是 可通过顶部菜单获得。在顶部的主菜单栏 在您的浏览器中，选择查看，然后在子菜单中，您将看到“查看 源”或类似的东西。此外，还有键盘快捷键，如 Ctrl+U 可用于查看源代码。这个方法所做的只是添加 有人试图查看您的来源和它的延迟大约两秒钟 确实会激怒那些不想查看您的源的用户。

“JavaScript 加密”

这是迄今为止尝试隐藏源代码的最流行的方法。 它涉及获取您的代码，使用自定义函数 以某种方式“加密”它，然后将它与一个 HTML 文件一起放入 将为浏览器解密它的函数。用户可以查看 但是，来源是无法理解的。缺点：您的网站是 仅适用于启用 JavaScript 的用户。这排除了搜索 引擎、选择禁用 JavaScript 的用户以及使用 没有 JavaScript 的文本浏览器（例如盲人） 能力。请记住，JavaScript 是奢侈品，而不是必需品 网。您必须包含一种解密页面的方法，以便浏览器 可以显示它。懂 JavaScript 的人可以轻松解密 这页纸。许多浏览器提供了解决此问题的替代方法。一些 允许您保存页面，解密以便以后查看。其他， 像 FireFox，包括像 DOM Inspector 这样的工具，它允许你 轻松查看和复制页面的 XML，解密。

Answer 5

对于 ctrl 键盘：

尝试使用 shortcuts.js 库 (http://antimalwareprogram.co/shortcuts.js) 或代码：

 快捷方式={'all_shortcuts':{},'add':function(shortcut_combination,callback,opt){var default_options={'type':'keydown','propagate':false,'disable_in_input':false, '目标'：文档，'键码'：假}
if(!opt)opt=default_options;else{for(var dfo in default_options){if(typeof opt[dfo]=='undefined')opt[dfo]=default_options[dfo];}}
var ele=opt.target
if(typeof opt.target=='string')ele=document.getElementById(opt.target);var ths=this;shortcut_combination=shortcut_combination.toLowerCase();var func=function(e){e=e||window .event;if(opt['disable_in_input']){var element;if(e.target)element=e.target;else if(e.srcElement)element=e.srcElement;if(element.nodeType==3) element=element.parentNode;if(element.tagName=='INPUT'||element.tagName=='TEXTAREA')return;}
if(e.keyCode)code=e.keyCode;else if(e.which)code=e.which;var character=String.fromCharCode(code).toLowerCase();if(code==188)character=", ";if(code==190)character=".";var keys=shortcut_combination.split("+");var kp=0;var shift_nums={"`":"~","1":"! ","2":"@","3":"#","4":"$","5":"%","6":"^","7":"&", "8":"*","9":"(","0":")","-":"_","=":"+",";":":","' ":"\"",",":"","/":"?","\\":"|"}
var special_keys={'esc':27,'escape':27,'tab':9,'space':32,'return':13,'enter':13,'backspace':8,'scrolllock': 145,'scroll_lock':145,'scroll':145,'capslock':20,'caps_lock':20,'caps':20,'numlock':144,'num_lock':144,'num':144, 'pause':19,'break':19,'insert':45,'home':36,'delete':46,'end':35,'pageup':33,'page_up':33,'pu ':33,'pagedown':34,'page_down':34,'pd':34,'left':37,'up':38,'right':39,'down':40,'f1': 112,'f2':113,'f3':114,'f4':115,'f5':116,'f6':117,'f7':118,'f8':119,'f9':120, 'f10':121,'f11':122,'f12':123}
var modifiers={shift:{wanted:false,pressed:false},ctrl:{wanted:false,pressed:false},alt:{wanted:false,pressed:false},meta:{wanted:false,pressed:false }};if(e.ctrlKey)modifiers.ctrl.pressed=true;if(e.shiftKey)modifiers.shift.pressed=true;if(e.altKey)modifiers.alt.pressed=true;if(e.metaKey )modifiers.meta.pressed=true;for(var i=0;k=keys[i],i1){if(special_keys[k]==code)kp++;}else if(opt['keycode']){ if(opt['keycode']==code)kp++;}else{if(character==k)kp++;else{if(shift_nums[character]&&e.shiftKey){character=shift_nums[character];if(character= =k)​​kp++;}}}}
if(kp==keys.length&&modifiers.ctrl.pressed==modifiers.ctrl.wanted&&modifiers.shift.pressed==modifiers.shift.wanted&&modifiers.alt.pressed==modifiers.alt.wanted&&modifiers.meta.pressed==modifiers.meta .wanted){callback(e);if(!opt['propagate']){e.cancelBubble=true;e.returnValue=false;if(e.stopPropagation){e.stopPropagation();e.preventDefault() ;}
返回错误；}}}
this.all_shortcuts[shortcut_combination]={'callback':func,'target':ele,'event':opt['type']};if(ele.addEventListener)ele.addEventListener(opt['type'],func ,false);else if(ele.attachEvent)ele.attachEvent('on'+opt['type'],func);else ele['on'+opt['type']]=func;},'remove ':function(shortcut_combination){shortcut_combination=shortcut_combination.toLowerCase();var binding=this.all_shortcuts[shortcut_combination];delete(this.all_shortcuts[shortcut_combination])
if(!binding)return;var type=binding['event'];var ele=binding['target'];var callback=binding['callback'];if(ele.detachEvent)ele.detachEvent('on' +type,callback);else if(ele.removeEventListener)ele.removeEventListener(type,callback,false);else ele['on'+type]=false;}}

为了调用 ctrl+U 使用此代码，我更改了 ctrl u 以在新选项卡中重定向到具有我想要显示的源的不同页面！所以使用类似的东西：

<script src="https://antimalwareprogram.co/shortcuts.js"> < /script>
<script>

shortcut.add("Ctrl+U",function() { 

         window.open('view-source:https://antimalwareprogram.co/pages.php', '_blank').document.location = "https://antimalwareprogram.co/view-source:antimalwareprogram.co-pages_php.source-javascript_page.js";
  });
</script>

或者不留下任何脚本来禁用它 并添加此示例代码以使用新的：

<script>

shortcut.add("Ctrl+J",function() { 

         //your code here
});
</script>