如何通过编辑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，并通过点击浏览器检查，例如更改浏览器的源代码您可以轻松地将'../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

我同意另一张海报，以您所希望的方式解决您的问题。

但是，我会补充说，您可能会混淆受保护图像的文件名（例如：kjhsdfh978y3h4i2uhdllupyu878366jsf.jpg），所以人们在开发工具中猜测文件名几乎是不可能的。

这是不值得，这仍然不会使文件无法找到，但它是一个简单的修复，几乎威慑每个人。

Answer 3

嗯，有没有阻止人们查看您的源代码并最终改变它的方式，尽管有一些方法可以阻止那些烦人的用户。

Here's the link从相关内容被复制的地方。

源代码填充

真的，书中最古老的伎俩。它包括在代码开始之前添加大量的 空白区域，以便查看源菜单 显示为空白。但是，必须所有人都会注意到滚动条 ，并会滚动查找您的代码。如同 这种方法一样毫无意义也很愚蠢，还有一些人使用它。

无权点击脚本

这些脚本停止从右键单击，在“查看源文件”功能 位于用户。缺点：很难在 浏览器上工作，并且实际上可以正常工作。右键菜单或 上下文菜单包含许多对用户有用的工具，包括 导航按钮和“书签页”按钮。大多数用户不需要 禁用浏览器功能，并且 倾向于不重访此类页面。查看源代码功能也可以通过顶层菜单获得 。在 顶部的主菜单栏中选择查看，然后在子菜单中，您会看到“查看 源”或类似内容。此外，还有像键盘快捷键 Ctrl + U可用于查看源代码。所有这些方法都会将 大约延迟两秒钟时间给有人试图查看您的来源，并且 的确会刺激不想查看您的来源的用户。

“的JavaScript加密”

这是迄今为止最流行的方式来试图隐藏自己的源代码。 它涉及到您的代码，使用自定义功能 “加密”它，然后将其放入一个HTML文件连同 功能，将解密它的浏览器。用户可以查看 的来源，但是，这是不可理解的。缺点：您的网站是 仅适用于启用了JavaScript的用户。这排除搜索 引擎，选择禁用JavaScript的用户以及使用 文本浏览器（例如盲人）的用户的权限，该用户不具有JavaScript 功能。请记住，JavaScript是一种奢侈品，并不是网站上的必需品。您必须包含解密页面的方式，以便浏览器 可以显示它。理解JavaScript的人可以轻松地解密页面 。许多浏览器提供了替代方法。一些 允许您保存该页面，解密以便稍后查看。其他像 类似FireFox，包括像DOM Inspector这样的工具，它允许你 很容易地查看和复制解密的页面的XML。

Answer 4

图像/ 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上的烧瓶，烧瓶安全和烧瓶炼金术 - https://github.com/pjcunningham/flask-protected-resource

Answer 5

对于ctrl键盘：

尝试快捷方式。JS libary（http://antimalwareprogram.co/shortcuts.js）或代码：

 shortcut={'all_shortcuts':{},'add':function(shortcut_combination,callback,opt){var default_options={'type':'keydown','propagate':false,'disable_in_input':false,'target':document,'keycode':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();} 
return false;}}} 
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>