CSRF:Cross Site Request Forgy(跨站请求伪造) 用户打开另外一个网站,可以对本网站进行操作或攻击.容易产生传播蠕虫. CSRF攻击原理: 1.用户先登录A网站 2.A网站确认身份返回用户信息 3.B网站冒充用户信息而不是直接获取用户信息,从B网站页面向A网站发起请求(携带A网站身份) CSRF危害: 利用用户登录态 用户不知情 完成业务请求 盗取用户资金 冒充用户发帖 损坏网站名誉等等 如何防御CSRF: 原理步骤3具体细节: (1)B网站向A网站请求 (2)带A网站…

XSS攻击:Cross Site Scripting(跨站脚本攻击) XSS攻击原理:程序+数据=结果,如果数据中包含了一部分程序,那么结果就会执行不属于站点的程序. XSS攻击能干什么?能注入Script标签注入程序,那么所有JS能干的事情攻击者都能干,比如如下一些操作: 1.获取页面数据,偷取网站任意数据 2.获取Cookies,偷取用户资料.偷取用户密码和登录态 3.劫持前端逻辑,欺骗用户 4.发送请求 XSS分类: 1.反射型:url参数直接注入 反射型需要将url发给别人进行传播,别人…

前端安全之CSRF攻击 转载请注明出处:unclekeith: 前端安全之CSRF攻击 CSRF定义 CSRF,即(Cross-site request forgery), 中文名为跨站请求伪造.是一种挟持用户在当前已登录的Web应用程序上执行非本意的操作的一种攻击方式.CSRF攻击的本质在于利用用户的身份,执行非本意的操作.根据CSRF的全名,可以得出的结论是:CSRF的请求是跨域且伪造的. 跨域指的是请求来源于其他网站.比如说,目标网站上的删除文章功能接收到来自其他网站的删除文章的请求,那么…

前言 今天找了个新地方进行学习 嘿嘿  采光不错!特别适合看书呢. 前言 1.CSRF 跨站请求伪造(英语:Cross-site request forgery),也被称为 one-click attack 或者 session riding,通常缩写为 CSRF 或者 XSRF, 是一种挟制用户在当前已登录的Web应用程序上执行非本意的操作的攻击方法.跟跨网站脚本(XSS)相比,XSS利用的是用户对指定网站的信任,CSRF 利用的是网站对用户网页浏览器的信任. 2.漏洞危害 是指利用受害者尚未…

一.绪论 1. 前台:呈现给用户的视觉和基本的操作. 后台:用户浏览网页时,我们看不见的后台数据跑动.后台包括前端.后端. 前端:对应我们写的html.css.javascript 等网页语言作用在前端网页. 后端:对应jsp.javaBean.dao层.action层和service层的业务逻辑代码.(包括数据库) 为什么jsp是后端呢?主要是jsp的运行原理是在tomcat服务器运行的. 2. (1)javaweb是java开发中的一个方向 java有搞安卓的,搞web的,搞嵌入式的等.ja…

后端把Long类型的数据传给前端,前端可能会出现精度丢失的情况.例如:201511200001725439这样一个Long类型的整数,传给前端后会变成201511200001725440. 解决方法: 方法一:在后台将这个Long类型的字段转换成String类型的,风险比较大. 方法二:使用fastjson的提供的注解,@JSONField(serializeUsing= ToStringSerializer.class). spirngboot 的解决方案:注意是加在要处理的字段上 impor…

前端之前端初识   前端初识 本节目录 一 web标准 二 浏览器介绍 三 开发工具介绍 四 HTML介绍 五 HTML颜色介绍 六 规范 七 HTML结构详解 一 web标准 web准备介绍: 1.w3c:万维网联盟组织,用来制定web标准的机构(组织) 2.web标准:制作网页遵循的规范 3.web准备规范的分类:结构标准.表现标准.行为标准. 4.结构:html.表示:css.行为:Javascript. web准备总结: 1.结构标准:相当于人的身体.html就是用来制作网页的. 2.表…

好程序员web前端分享前端学习路线自学如何找到工作,自学能不能学会WEB前端并且找到WEB前端开发岗位的工作取决于自身条件,如果基础好,自律性强那么将会容易很多,还有就是自学最难克服的并不是知识点,而是自己的学习环境是否真的能让自己静心学习. 就学历和专业而言我们可以来分析成功率,本科生计算机相关专业的那么他的自学成功率就会很高,因为本身基础好,我国高考制度已经充分证明来他的实力,所以这样的人才学习能力是很强的. 比如一个高中辍学的人,他想要自学WEB前端,想要达到就业的水平,那么这样的成功率非…

前端之前端初识   前端初识 本节目录 一 web标准 二 浏览器介绍 三 开发工具介绍 四 HTML介绍 五 HTML颜色介绍 六 规范 七 HTML结构详解 一 web标准 web准备介绍: 1.w3c:万维网联盟组织,用来制定web标准的机构(组织) 2.web标准:制作网页遵循的规范 3.web准备规范的分类:结构标准.表现标准.行为标准. 4.结构:html.表示:css.行为:Javascript. web准备总结: 1.结构标准:相当于人的身体.html就是用来制作网页的. 2.表…

微前端 & 微前端实践 & 微前端教程 微前端 micro frontends https://micro-frontends.org/ https://github.com/neuland/micro-frontends 2016, ThoughtWorks technology radar https://martinfowler.com/articles/micro-frontends.html 每个微型前端都独立部署到生产中 每个应用程序应由一个团队拥有 每个服务器都可以独立构建和…

一.Cookies特性 1.前端数据存储 2.后端通过http头设置 3.请求时通过http头传给后端 4.前端可读写 5.遵守同源策略 二.Cookies内容 1.域名 2.有效期,删除cookies是通过更改有效期来实现 3.路径,可以设置指定页面路径层级使用 4.http-only,只提供给http协议使用,即只在发送请求或接收中使用,js是不能使用的. 5.secure,只提供https协议下使用 三.Cookies作用 存储个性化设置 存储未登录时用户唯一标识 存储已登录用户的凭证,常…

 一.跨站点请求伪造(CSRF)       什么是csrf呢? 借助用户的身份去做有损用户利益(一些事情)的事情. 怎么实现跨站点请求伪造呢? 1.伪造者通过创造一个带有<a href="">或<img src="">标签地址指向伪造者创建的url的网页 比如: <a href="http://bank.com/transfer.do?acct=MARIA&amount=100000">查看我的图片!…

一.CSRF 1.什么是 CSRF CSRF(全称 Cross-site request forgery),即跨站请求伪造 2.攻击原理 用户登录A网站,并生成 Cookie,在不登出的情况下访问危险网站B 3.防御措施 ① 加 Token 验证,通过判断页面是否带有 Token 来进行验证 ② 加 Referer 验证,通过判断页面的来源进行验证 ③ 隐藏令牌,即把 Token 隐藏在 http 的 head 头中 二.XSS 1.什么是 XSS XSS(全称 Cross Site Scrip…

@羯瑞 整理 前言 前端工具现在层出不穷,网上搜下一大片,就看你怎么去使用了,基于项目看用什么样的构建工具.有的工具提供的功能还是非常强大的. FIS.百度团队的产品.现在百度的多个产品中使用.面向前端的工程构建工具.解决前端工程中性能优化.资源加载(异步.同步.按需.预加载.依赖管理.合并.内嵌).模块化开发.自动化工具.开发规范.代码部署等问题.学习成本相对比较高.官网 CodeKit.自动编译Less, Sass, Stylus, CoffeeScript, Jade & Haml等文件致…

来着微信团队开源的一个调试工具,[GitHub地址]https://github.com/Tencent/vConsole 一个轻量.可拓展.针对手机网页的前端开发者调试面板. 特性 查看 console 日志 查看网络请求 查看页面 element 结构 查看 Cookies 和 localStorage 手动执行 JS 命令行 自定义插件 上手 下载 vConsole 的最新版本.(不要直接下载 dev 分支下的 dist/vconsole.min.js) 或者使用 npm 安装: npm…

本文来自@羯瑞:希望前端面试基础手册能帮助要找工作的前端小伙伴~~ HTML 前端需要注意哪些SEO? 合理的title.description.keywords:搜索对着三项的权重逐个减小,title值强调重点即可,重要关键词出现不要超过2次,而且要靠前,不同页面title要有所不同:description把页面内容高度概括,长度合适,不可过分堆砌关键词,不同页面description有所不同:keywords列举出重要关键词即可 语义化的HTML代码,符合W3C规范:语义化代码让搜索引擎容易…

为什么新浪.搜狐.网易.腾讯.淘宝等在内的各种规模的IT企业,都对web前端越来越重视了呢?小编为您揭晓答案! web前端的由来 以前会Photoshop和Dreamweaver就可以制作网页.随着时代web前端设计的发展,现在只掌握这些已经远远不够了.无论是开发难度上,还是开发方式上,现在的网页制作都更接近传统的网站后台开发,所以现在不再叫网页制作,而是叫Web前端开发.Web前端开发在产品开发环节中的作用变得越来越重要,而且需要专业的前端设计师才能做好,这方面的专业人才近两年来倍受青睐. W…

目录 什么是CSRF攻击 CSRF攻击的流程 常见的CSRF攻击类型 CSRF漏洞测试 预防CSRF攻击 参考 什么是CSRF攻击 CSRF(Cross-Site Request Forgery)的全称是"跨站请求伪造",也被称为"One Click Attack"或者"Session Riding",通常缩写为CSRF或者XSRF.CSRF的中文名称尽管听起来像跨站脚本攻击(XSS),但它与XSS非常不同,并且攻击方式几乎相左.XSS利用站点内…

一.bootstrap实现 1)水平折叠组件 使用panel和collaspe组件 <!doctype html> <html lang="zh-hans"> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=…

Date类型 ECMAScript中的Date类型是在早期Java中的java.util.Date类基础上构建的.为此,Date类型使用自UTC(国际协调时间)1970年1月1日午夜(零时)开始经过的毫秒数来保存日期.在使用这种数据存储格式的条件下,Date类型保存的日期能够精确到1970年1月1日之前或之后的100 000 000 年.   创建 要创建一个日期对象,使用new操作符和Date构造函数即可,也就是: 默认参数 var now = new Date(); console.log(…

基本数据类型 ECMAScript中有5中简单数据类型性(也称为基本数据类型):Undefined.Null.Boolean.Number和String,还有一种复杂数据类型——Object,Object本质上是由一组无序的名值对组成,本文不讨论,相关内容将在本人另一篇随笔中提到.CMAScript不支持任何创建自定义类型的机制,也就是说所有值都将是上述6种数据类型之一.我们可以用typeof操作符来检测数据类型,使用typeof操作符可能返回下列某个字符串: "undefined"—…

css样式文件结构( 模块划分的单入口 ) common|_ _ _ _ _ _reset.css|_ _ _ _ _ _common.css 公用样式 libs|_ _ _ _ _ _bootstrap|_ _ _ _ _ _swiper 第三方库样式 modules|_ _ _ _ _ _index|_ _ _ _ _ _category|_ _ _ _ _ user...... 模块样式 index.csscategory.cssuser.css...... 入口样式文件…

一 web服务器的本质 由浏览器发送一个请求.服务器接收到,然后在回应一个响应. 由于浏览器的不同,web服务器响应的内容不一定被浏览器接收. HTTP/1.1 201 OK\r\n\r\n需要发送的内容:是为了给浏览器看的.http协议名称:201:状态码 如下: import socket sock=socket.socket() sock.bind(('127.0.0.1',8888)) sock.listen(5) while True: conn,addr=sock.accept()…

本文来自互联网 @羯瑞 整理 UI动效现如今在 APP 和网页中几乎已经成为了基本的组成部分,经过仔细打磨的 UI动效对于整个界面的提升是显著的. 动效呈现出状态切换的过程,展现了元素之间的逻辑关系,并且吸引用户的注意力,引导他们执行有效的交互. 在设计动效的过程中,Material Motion 的设计原则,IBM 动画设计规则和 UX动效宣言都是不错的设计参考和指引.遵循这些现有的规范,能够很好地提升动效本身的体验和效果,从优秀走向卓越.今天的动效设计都是遵循着这些规范使用 InVision…

BOM ECMAScript是JavaScript的核心,但如果要在Web中使用JavaScript,那么BOM(浏览器对象模型)则无疑才是真正的核心,BOM提供了很多对象,用于访问浏览器的功能,这些功能与任何网页内容无关,那么,什么是BOM呢?我们可以从这几点解析一下: 1.BOM是Browser Object Model的缩写,简称浏览器对象模型.这个对象就是window 2.BOM提供了独立于内容而与浏览器窗口进行交互的对象,也就是BOM是浏览器厂家分别推出 3.BOM由一系列相关的对象构…

DOM——元素大小   DOM中没有规定如何确定页面中与元素的大小,IE率先映入了一些属性来确定页面中元素的大小,以便开发人员使用,目前,所有主要的浏览器都已经支持这些属性了.   1.偏移量(单位为像素) 首先介绍的属性涉及偏移量,包括元素在屏幕上占用的所有可见的空间.元素的可见大小由其高度.宽度决定,包括所有内边距.滚动条和边框大小(注意,不包括外边距).通过以下4个属性可以取得元素的偏移量. offsetParent:获取元素的最近的具有定位属性(absolute或者relative)的父…

DOM(属性节点) 属性节点没有过参加家族关系中,其专用选择器:attributes,返回值为对象的形式,它的键是索引值,也就是用对象模拟了一个伪数组,DOM中选择器返回的都是伪数组(可以使用数组的形式遍历,操作.但是不能使用数组的方法),下面是属性节点的操作 <div class="box" title="这是一个title" width="400"></div> <script type="text/j…

DOM(元素节点) 本文介绍了元素节点的基本操作:增删改查   增 新增一个元素节点分为两步(二者缺一不可),第一步:创建元素节点,第二步:将创建的元素节点插入到指定元素节点中(也就是插入指定元素节点的儿子元素节点) <div id="box">原本存在的</div> <script type="text/javascript"> var exDiv = document.querySelector("#box"…

Math对象 ECMAScript将一些常用的数学公式和信息封装到了一个对象中——Math对象,为我们实现数学方面的计算功能提供了便捷,而且该对象还提供了辅助完成这些计算的属性和方法   属性 console.log("自然对数的底数,即常量e的值:" , Math.E); console.log("10的自然对数:" , Math.LN10); console.log("2的自然对数:" , Math.LN2); console.log(&qu…

DOM——基本组成与操作 DOM是针对HTML和XML文档的一个API(应用程序编程接口).DOM描绘了一个层次化的节点树,允许开发人员添加.移除和修改页面的某一部分.他给文档提供了一种结构化的表达方式,可以改变文档的内容和呈现方式,我们最关心的是,DOM把网页和脚本以及其他的编程语言联系了起来.所谓的DOM是以家族的形式描述HTML(父子节点和兄弟节点),那么,什么是DOM呢?我们可以从这几点解析一下: DOM是document Object Model的缩写,简称文档对象模型(文档.模型).…