符合中小企业对网站设计、功能常规化式的企业展示型网站建设
本套餐主要针对企业品牌型网站、中高端设计、前端互动体验...
商城网站建设因基本功能的需求不同费用上面也有很大的差别...
手机微信网站开发、微信官网、微信商城网站...
如何理解因防火墙而学习的Content-Type,相信很多没有经验的人对此束手无策,为此本文总结了问题出现的原因和解决方法,通过这篇文章希望你能解决这个问题。
创新互联主要从事网站设计制作、网站设计、网页设计、企业做网站、公司建网站等业务。立足成都服务阿合奇,十余年网站建设经验,价格优惠、服务专业,欢迎来电咨询建站服务:18980820575
项目在B学校上线的时候,同一个功能在A学校是没问题,B学校前端点击后,后端一直收不到请求
1.确认一下代码都是同一份
2.确认是否访问了正确的服务器
3.确认应用服务器是否收到了请求
4.确认反向代理服务器是否收到了请求
5.抓包看请求是否发出(其实不用怀疑这一点)
以上四步做完之后的结论是:代码是同一份,服务器是对的,反向代理服务器和应用服务器都没有收到请求
怀疑是B学校的防火墙拦截了请求,因此可能有两个解决方案:
1.找学校开防火墙,设置白名单
2.想办法绕开防火墙规则
但是有人得问了,为什么防火墙会拦截喃,因为在我们异步提交的数据当中含有 等富文本标签,这应该是防火墙防止XSS攻击的而设置的策略,进而拦截了请求
因为当时事情紧急,且学校放假没人配合,只有先试着用第2点。
之前没怎么接触过XSS攻击,对防火墙的拦截策略没什么多少认识,接下来试着在POSTMAN中使用mutipart/formdata提交测试,居然是成功的。
找到了突破口,然后就让前端更改默认提交请求头中的Content-Type=mutipart/formdata,然后在VUE中使用FormData构造表单提交
至此绕过了防火墙,上线OK
不同学校的防火墙策略不一样,因此开发人员需要补充WEB安全相关的知识点,最好是公司的CTO在学习整理之后,公司针对特定行业现状弄出一套最佳实践出来
通过本次实践,顺便了解了一下Content-Type分别为multipart/formdata和x-www-form-urlencode的请求信息
x-www-form-urlencode
默认情况下,html的form表单的enctype=application/x-www-form-urlencoded。一些框架比如Jquery Vue的Ajax提交默认也是这种类型
application/x-www-form-urlencoded是指表单的提交,并且将提交的数据进行urlencode。默认情况下,我们所有的表单提交都是通过这种默认的方式实现的,如图:
可以看到中文被编码了,但是它并不会把特殊字符进行编码,比如< &等。这样可能会导致XSS-存储型攻击或者SQL注入攻击。因此防火墙拦截它是正确的。因此写前端代码的时候,输入都需要做校验,比如电子邮箱,生日、年龄、文本使用地方的XSS FILTER做过滤等,同时后端也要做校验,因为前端是很容易就绕过的。关于XSS-攻击可以去看阿里-首席安全架构师-吴翰清的《白帽子讲WEB安全》一书
我们如果要在表单中上传文件,一般会将form的enctype参数设置为multipart/form-data,一些框架比如Jquery Vue的Ajax提交也可以设置Content-Type,这种方式只支持POST的请求方式
Contype-Type=multipart/form-data情况的时候,都会通过一个特殊的字符串来将原始POST数据进行分割。
我们可以看到下面的请求中Content-type的类型
分隔符开始为:----WebKitFormBoundaryM2jFeC5L7hYjAqxZ
分隔符结束为:-----WebKitFormBoundaryM2jFeC5L7hYjAqxZ--
相比较多了“--”
通过这种方式我们把富文本提交到了后端,写入了数据库。但是为了避免XSS攻击,前端和后端代码都可以使用第三方的插件扫描一下文件内容或者VALUE值
是我们将json字符串通过请求体(http body)向后端提交数据,springmvc后端直接使用@requestBody进行接收,这也是经常使用一种方式,并没有什么特别的点。同样需要对参数内容进行过滤,防止XSS攻击。
vue前端框架提供了防XSS攻击的方法,可以自行网上查阅
看完上述内容,你们掌握如何理解因防火墙而学习的Content-Type的方法了吗?如果还想学到更多技能或想了解更多相关内容,欢迎关注创新互联行业资讯频道,感谢各位的阅读!