前端应该注意的基本WEB安全问题

概述

管理地址

当我们做OA等系统管理应用的时候:

1.后台管理地址有的是二级域名(例如:manage.xxx.com或者admin.xxx.com)，
2.有的是后缀路由地址(例如：xxx.com/admin 或者 xxx.com/manage),

这类普遍的关键词出现在后台管理地址上，很容易被一些扫描二级域名或者御剑一类可以扫目录的的软件扫描出来暴露后台，另外太敏感的后台地址，也会在google的语法里被搜索引擎爬取，例如（inurl:admin），这样容易被一些全网自动化爬取后台的软件抓取到进行下一步利用操作，如无必要，建议后台地址相对独立且不含有常用关键词。

前端CDN或者OBS

前端为了减轻服务器的带宽压力以及隐藏服务器的真实地址，常见的就是讲前端放到OBS上或者加入CDN，需要注意的是虽然加入了cdn等，将我们的应用域名cname到了一个三方的域名上，但是很多国外的dns服务器是可以查到的，另外切换上cdn之前的地址如果没变，攻击者依然可以从解析历史里看到服务器的真实地址。

逻辑越权漏洞

当我们向系统输入很敏感的内容的时候，前端应该配合后端做一些必要的逻辑筛选：例如

1.交易金额的准确性，不能出现负数等其他根据业务场景的输入限制；
2.不要将权限管理的逻辑在前端处理，比如控制菜单权限是前端控制;
3.敏感的项目配置放在前端(我见过前端为了发布方便，将服务器口令写在发布脚本里);
4.严格控制各个角色页面相互侵入；
5.尽量将后端前端错误自己处理不要直接暴露抛出;
6.尽量使用json数据类型交互传输;

弱口令

不是没有绝对安全的系统，而是没有绝对安全的人，很多开发者在开发阶段为了省事将口令设置的非常弱，甚至项目上线，开发用的弱口令都没有删除，直接等同于将大门给外人打开，建议在前后端开发中利用机制一键过滤开发时期的权限隔离，弱口令删除。

去除项目里各个环节的关键词和指纹

很多开发者都是在巨人的肩膀上进行开发，二开一些成型的项目框架等，在这些项目框架的很多地方都有一些他们的标记和指纹，很多指纹识别的软件都可以识别出网站应用的开发框架等，这些开发框架的老漏洞一旦你没有处理，很容易被人利用。

采用框架脚手架

现在vue等框架在编译的时候，都会将js代码混淆压缩，一定程度上加大了系统的安全，即使很多业务处理在前端，也加大了攻击的攻击难度，

我见到过市面上很多防止小白debugger的方法就是，在项目一开始的是就无限循环了一个debugger,
让很多小白在F12调试模式的时候一直处在debugger阶段。

采用加密协议

HTTP的明文数据传输, 攻击者最常用的攻击手法就是网络嗅探, 试图从传输过程当中分析出敏感的数据，阿里等云服务厂家都有免费的以年为期限的证书，网站采用https步骤不是很复杂。另外,用户名密码或者很多业务场景的敏感数据在传输的过程中，建议前端先加密，可以一定程度上给攻击者制造攻击难度，防止中间人攻击利用。

上传控制

很多攻击的后续操作都是利用上传这个环节实现的，上传大马获取服务器信息提权等，上传文件到服务器等于给服务器开了个大门，一定要严格控制上传的限制，文件名后缀限制，格式限制几乎没有任何作用，建议并且大都是现在三方云储都很方面，将存储和业务分割，存储在三方云储或者自建存储上，隔离业务和存储，业务只存储需要的储存地址。

跨站请求伪造(CSRF攻击)

   1. 用户C打开浏览器，访问受信任网站A，输入用户名和密码请求登录网站A；

   2.在用户信息通过验证后，网站A产生Cookie信息并返回给浏览器，此时用户登录网站A成功，可以正常发送请求到网站A；

   3. 用户未退出网站A之前，在同一浏览器中，打开一个TAB页访问网站B；

   4. 网站B接收到用户请求后，返回一些攻击性代码，并发出一个请求要求访问第三方站点A；
   5. 浏览器在接收到这些攻击性代码后，根据网站B的请求，在用户不知情的情况下携带Cookie信息，向网站A发出请求。网站A并不知道该请求其实是由B发起的，所以会根据用户C的Cookie信息以C的权限处理该请求，导致来自网站B的恶意代码被执行。

现在后台springboot等框架都是使用token放在header头里，感觉利用的机会也是越来越少。

跨站脚本攻击（XSS攻击）

这类攻击主要是获取cookie然后直接带着cookie登陆后台，俗称打cookie，随着前后端分离以及前端vue等框架普及，这类场景利用的机会变的越来越少。

HttpOnly Cookie：true。预防XSS攻击窃取用户cookie最有效的防御手段。

SQL注入

前端这方面的注意就是填入表单等向系统输入的时候，必要的输入检查可以为后端减少一定风险，后端如果已经过滤的很严格，这个前端过滤看项目情况不是一定必要。

欢迎大家和我一起学习分享flutter，项目会持续更新新的学习demo

此项目的github地址：项目地址

下面是我们的公众号：flutter编程笔记（code9871）

公众号 不定期分享自己的学习想法

往期回顾：

flutter实现顶部吸附效果

flutter实现数字刻度尺

flutter实现简单的旋转动画

flutter实现简单的抽屉效果