跨域post 及 使用token防止csrf 攻击

最新推荐文章于 2022-05-25 22:14:14 发布
最新推荐文章于 2022-05-25 22:14:14 发布
阅读量234 收藏 1
点赞数
文章标签： javascript python php ViewUI

环境：
后台使用的python - flask
前台使用angular框架

1.一个跨域post的样例：

跨域post有多种实现方式：

1.CORS：http://blog.csdn.net/hfahe/article/details/7730944
2.利用iframe
3.server proxy：https://en.wikipedia.org/wiki/Proxy_server

样例使用的为iframe，想要证明，在没有进行csrf防御时，随意攻击者能够利用javascript发送 post 请求。从而简单的提交或获取数据资料；

1.本地test.html页面

<html>
<head>
<title>POST</title>
<script type="text/javascript" src="jquery-2.1.4.min.js"></script>
</head>
<body>
<input type="button" onclick="test();" value="test"/>
<script type="text/javascript">
    function test() {
        crossDomainPost({
            url: 'http://localhost:5000/test',
            param: {a: '1', b: '2'},
            onSubmit: function (e) {
                console.log(e);
            }
        })
    }
    function crossDomainPost(config) {
        var def = {
            url         : '',                   //提交的地址
            param       : {},                   //提交的參数
            delay       : 1000,                 //延迟获取參数的时间。单位为毫秒
            onSubmit    : function (i) {}       //提交成功后的回调函数，參数为跳转的IFRAME
        };
        config  = $.extend({}, def, config);
        if (!config.url) {
            config.onSubmit({error: 'URL is Empty!'});
            return;
        }
        /****baseMethod****/
        /**
         * 生成随机的10位字符，且唯一
         * @returns {string}
         */
        var createGuid    = function () {
            var guid = "";
            for (var i = 1; i <= 10; i++) {
                guid += Math.floor(Math.random() * 16.0).toString(16);
            }
            return guid;
        },
        /**
         * 删除指定的节点
         * @param _element 要删除的节点
         */
        removeElement = function (_element) {
            var _parentElement = _element.parentNode;
            if (_parentElement) {
                _parentElement.removeChild(_element);
            }
        }

        // Add the iframe with a unique name
        var iframe                = document.createElement("iframe");
        var uniqueString          = createGuid();
        document.body.appendChild(iframe);
        iframe.style.display      = "none";
        iframe.contentWindow.name = uniqueString;

        // construct a form with hidden inputs, targeting the iframe
        var form    = document.createElement("form");
        form.target = uniqueString;
        form.action = config.url;
        form.method = "POST";

        // repeat for each parameter
        for (var item in config.param) {
            var input   = document.createElement("input");
            input.type  = "hidden";
            input.name  = item;
            input.value = config.param[ item ];
            form.appendChild(input);
        }

        document.body.appendChild(form);
        try{
            form.submit();
        }catch(e){
            console.log('error');
            consoel.log(e);
        }


        setTimeout(function () {
            config.onSubmit(iframe);
            removeElement(form);    //移除form
        }, config.delay);
    }
    </script>
</body>
</html>

2.后台接收代码

这里仅接收POST的请求

@app.route('/test' ,methods=['POST'])
def test():
    print 'param is :';
    print request.form
    return jsonify(data='2222')

3.控制台输出：

服务端处理了非站内的请求

这里写图片描写叙述

4.浏览器输出：

本地test.html获取到返回信息

这里写图片描写叙述


2.CSRF

跨站请求攻击。简单地说，是攻击者通过一些技术手段欺骗用户的浏览器去訪问一个自己以前认证过的站点并运行一些操作（如发邮件，发消息，甚至財产操作如转账和购买商品）。因为浏览器以前认证过。所以被訪问的站点会觉得是真正的用户操作而去运行。

这利用了web中用户身份验证的一个漏洞：简单的身份验证仅仅能保证请求发自某个用户的浏览器，却不能保证请求本身是用户自愿发出的。

你这能够这么理解CSRF攻击：攻击者盗用了你的身份，以你的名义发送恶意请求。CSRF能够做的事情包含：以你名义发送邮件。发消息，盗取你的账号。甚至于购买商品，虚拟货币转账……造成的问题包含：个人隐私泄露以及財产安全。

1.原理

这里写图片描写叙述

从上图能够看出，要完毕一次CSRF攻击，受害者必须依次完毕两个步骤：

  • 登录受信任站点A，并在本地生成Cookie。
  • 在不登出A的情况下，訪问危急站点B。

看到这里。你或许会说：“假设我不满足以上两个条件中的一个，我就不会受到CSRF的攻击”。

是的，确实如此。但你不能保证下面情况不会发生：

1.你不能保证你登录了一个站点后，不再打开一个tab页面并訪问另外的站点。
2.你不能保证你关闭浏览器了后，你本地的Cookie立马过期，你上次的会话已经结束。
3.上图中所谓的攻击站点。可能是一个存在其它漏洞的可信任的常常被人訪问的站点。

原理具体：http://www.80sec.com/csrf-securit.html

2.常见的攻击类型：

1.GET类型的CSRF
仅仅须要一个HTTP请求。就能够构造一次简单的CSRF。
样例：
银行站点A：它以GET请求来完毕银行转账的操作，如：http://www.mybank.com/Transfer.php?toBankId=11&money=1000
危急站点B：它里面有一段HTML的代码例如以下：

<img src=http://www.mybank.com/Transfer.php?toBankId=11&money=1000>

首先。你登录了银行站点A，然后訪问危急站点B，噢，这时你会发现你的银行账户少了1000块

为什么会这样呢？原因是银行站点A违反了HTTP规范，使用GET请求更新资源。

在訪问危急站点B的之前。你已经登录了银行站点A，而B中的以GET的方式请求第三方资源（这里的第三方就是指银行站点了，原本这是一个合法的请求，但这里被不法分子利用了）。所以你的浏览器会带上你的银行站点A的Cookie发出Get请求，去获取资源http://www.mybank.com/Transfer.php?toBankId=11&money=1000 ，结果银行站点服务器收到请求后，觉得这是一个更新资源操作（转账操作），所以就立马进行转账操作

2.POST类型的CSRF
如上边的跨域POST样例

3.怎样防御CSRF

1.提交验证码
在表单中添加一个随机的数字或字母验证码。通过强制用户和应用进行交互。来有效地遏制CSRF攻击。

2.Referer Check
检查假设是非正常页面过来的请求，则极有可能是CSRF攻击。

3.token验证

  • 在 HTTP 请求中以參数的形式添加一个随机产生的 token，并在服务器端建立一个拦截器来验证这个 token，假设请求中没有
    token 或者 token 内容不对，则觉得可能是 CSRF 攻击而拒绝该请求。

  • token须要足够随机
  • 敏感的操作应该使用POST。而不是GET，以form表单的形式提交。能够避免token泄露。

4.在 HTTP 头中自己定义属性并验证
这样的方法也是使用 token 并进行验证。这里并非把 token 以參数的形式置于 HTTP 请求之中，而是把它放到 HTTP 头中自己定义的属性里。通过 XMLHttpRequest 这个类，能够一次性给全部该类请求加上 csrftoken 这个 HTTP 头属性。并把 token 值放入当中。这样攻克了上种方法在请求中添加 token 的不便。同一时候，通过 XMLHttpRequest 请求的地址不会被记录到浏览器的地址栏，也不用操心 token 会透过 Referer 泄露到其它站点中去。


4.关于token

  1. Token 应该被保存起来（放到 local / session stograge 或者 cookies）
  2. Tokens 除了像 cookie 一样有有效期。而且你能够有很多其它的操作方法。一旦 token 过期，仅仅须要又一次获取一个。你能够使用一个接口去刷新 token。你甚至能够把 token 原来的公布时间也保存起来。而且强制在两星期后又一次登录什么的。假设你须要撤回 tokens（当 token 的生存期比較长的时候这非常有必要）那么你须要一个 token 的生成管理器去作检查。
  3. Local / session storage 不会跨域工作，请使用一个标记 cookie
  4. 有须要的话，要加密而且签名 token
  5. 将 JSON Web Tokens 应用到 OAuth 2

使用Token

1.引入csrf

from flask_wtf.csrf import CsrfProtect
csrf = CsrfProtect()

app = Flask(__name__)

csrf.init_app(app)
app.config['SECRET_KEY']='myblog'

2.在站内页面上head中，添加token

<meta name="csrf-token" content="{{ csrf_token() }}">

3.配置angular提交表头

app.config(function ($httpProvider) {
    $httpProvider.defaults.headers.common['X-CSRF-Token'] = $('meta[name=csrf-token]').attr('content');
});

4.再次測试跨域post
后台输出：
这里写图片描写叙述
前台输出：
这里写图片描写叙述


关于webapp跨域Post使用token思路：

  1. 移动端登录时，服务端验证表单信息。登陆成功，生成token，返回给client；
  2. client将token存在localstorage/sessionstorage中。每次提交表单。都须要携带token；
  3. 服务端获取请求。假设没有token，则忽略请求；

出现的问题：

  1. 服务端须要限制登陆次数
    解决方法：
    client添加登陆间隔。请求一次后，等待x秒才干再次请求
    服务端做cas验证

  2. 服务端须要保存用户的token，及过期时间；
    解决方法：
    能够将token 保存在Memcache，数据库中，redis

  3. client存token时。须要对token加密
    解决方法：
    在存储的时候把token进行对称加密存储，用时解开
    将请求URL、时间戳、token三者进行合并加盐签名。服务端校验有效性

当然。以上仅仅防君子，不防小人

參考：
跨域post请求：http://blog.csdn.net/doraeimo/article/details/7329779
跨站请求伪造：http://www.jianshu.com/p/7f33f9c7997b
token:http://alvinzhu.me/blog/2014/08/26/10-things-you-should-know-about-tokens/

weixin_34166472
关注
  • 0
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
前端安全系列-如何防止CSRF攻击
javagty6778的博客
03-07 304
Token是一个比较有效的CSRF防护方法，只要页面没有XSS漏洞泄露Token，那么接口的CSRF攻击就无法成功。但是此方法的实现比较复杂，需要给每一个页面都写入Token（前端无法使用纯静态页面），每一个Form及Ajax请求都携带这个Token，后端对每一个接口都进行校验，并保证页面Token及请求Token一致。这就使得这个防护策略不能在通用的拦截上统一拦截处理，而需要每一个页面和接口都添加对应的输出和校验。这种方法工作量巨大，且有可能遗漏。
关于iframe跨域POST提交的方法示例
11-29
所以自己对跨域有一定的概念性了解，知道什么是跨域以及解决跨域的方法，但是具体实际从来没有操作过，直到最近在公司项目中，遇到了一个需要使iframe跨域进行POST提交的实际案例，我才明白具体如何使用iframe进行...
客户端与服务器端的认证方式（cookie，token，session）
sun0322
08-13 3748
■参照 ===== https://blog.csdn.net/sxzlc/article/details/103450258 9．客户端与服务器端的认证方式 ===== 最基本的方式，使用密码直接登录，这里就不说了 方式1：cookie 第一次访问的服务Web A生成一个sessionid并且存入cookie中。 第二次访问的是服务Web A，客户端会在cookie中读取sessionid加入到请求头中。 cookie保存位置 ・win10 IE C:\Users\userNam.
JWT 加密
T525174893的博客
04-26 528
什么是JWT Json web token (JWT), 是为了在网络应用环境间传递声明而执行的一种基于JSON的开放标准（(RFC 7519).该token被设计为紧凑且安全的，特别适用于分布式站点的单点登录（SSO）场景。JWT的声明一般被用来在身份提供者和服务提供者间传递被认证的用户身份信息，以便于从资源服务器获取资源，也可以增加一些额外的其它业务逻辑所必须的声明信息，该toke...
TOKEN验证防止CSRF攻击的原理
weixin_34362991的博客
11-29 4021
CSRF中文名是跨站请求伪造攻击，黑客可以通过CSRF攻击来伪造我们的身份，从而进行不法的活动。比如说是以我们的身份进行转账，发送邮件等操作。要想做到预防CSRF攻击，首先需要了解CSRF攻击的原理，只有这样才可以真正的掌握预防的手段。CSRF攻击的原理是这样的:(1):当我们登陆某个网站以后，因为HTTP协议是无状态的，所以为了保存我们的登陆状态，服务器中的程序就必须创建一个session文件，...
关于iframe跨域使用postMessage的实现
01-21
另一种方式是使用postMessage方法。此处针对第二种方式，看下使用方式和可能的问题。 postMessage是什么 此处引用MDN关于postMessage的详细说明。简而言之就是：postMessage是挂载在window下的一个方法，用于不同...
详解使用postMessage解决iframe跨域通信问题
12-13
这周碰到一个让人头疼的需求：要在我的web项目中嵌入另一个第三方web...在window对象下有个postMessage方法，是专门用来解决跨域通信问题的。 关于postMessage的详细介绍请戳这里，不过MDN的文档太详细了，导致有些同学
Django跨域请求CSRF的方法示例
01-20
web跨域请求 1.为什么要有跨域限制 举个例子： 1.用户登录了自己的银行页面 http://mybank.com，http://mybank.com向用户的cookie中添加用户标识。 2.用户浏览了恶意页面 http://evil.com。执行了页面中的恶意AJAX...
connect time out 获取token失败_记一次token安全认证的实践
weixin_39543835的博客
11-25 483
点击上方“Java知音”，选择“置顶公众号”技术文章第一时间送达！本文作者：[Java知音] 瑾似流年推荐阅读1.Java 性能优化：教你提高代码运行的效率2.基于token的多平台身份认证架构设计3.select count(*)底层究竟做了什么？4.Springboot启动原理解析阅读此文前请先阅读上一篇SpringBoot整合JWT实现用户认证了解JWT。背景介绍：因项目需...
防止GET,Post注入和防止服务器攻击
01-29
防止GET,Post注入和防止服务器攻击下载后直接修改名字放在asp空件测试就可以看到效果了
开发API接口的安全验证：token，参数签名，时间戳
热门推荐
何哥的博客
03-18 1万+
前言：服务端与前端对接的API接口，如果被第三方抓包并进行恶意篡改参数，可能会导致数据泄露和篡改数据，下面主要围绕token，签名，时间戳，三个部分来保证API接口的安全性。 参考链接，致敬前辈： 开放API接口签名验证，让你的接口从此不再裸奔 API接口的安全设计验证：ticket，签名，时间戳 1.用户成功登陆站点后，服务器会返回一个token，用户的任何操作都必须带了这个参数，可以将这个参数直接放到header里。 2.客户端用需要发送的参数和token生成一个签名sign，作为参
Token防止表单重复提交和CSRF攻击
dxm809的博客
03-04 369
Token，可以翻译成标记！最大的特点就是随机性，不可预测，一般黑客或软件无法猜测出来。 Token一般用在两个地方: 1: 防止表单重复提交 2: anti csrf攻击（Cross-site request forgery 跨站点请求伪造） 两者在原理上都是通过session token来实现的。当客户端请求页面时，服务器会生成一个随机数Token，并且将Token放置到session当...
为什么token能够防止CSRF（修正版）
qq_45888932的博客
04-06 8961
记录使用token的一些问题，修正版，更改CSRF之前的错误理解和添加解决CSRF的措施
Cookie、Session、Token、JWT
kagurawill的博客
12-30 1318
什么是认证（Authentication） 通俗地讲就是验证当前用户的身份，证明“你是你自己”（比如：你每天上下班打卡，都需要通过指纹打卡，当你的指纹和系统里录入的指纹相匹配时，就打卡成功） 互联网中的认证： 用户名密码登录 邮箱发送登录链接 手机号接收验证码 只要你能收到邮箱/验证码，就默认你是账号的主人 什么是授权（Authorization） 用户授予第三方应用访问该用户某些资源...
csrf攻击与防护—3用flask简单演示防范csrf攻击之token验证
ACBC12345的博客
12-07 504
csrf攻击与防护—2用flask简单演示防范csrf攻击之referer CSRF 攻击之所以能够成功，是因为黑客可以完全伪造用户的请求，该请求中所有的用户验证信息都是存在于 cookie 中，因此黑客可以在不知道这些验证信息的情况下直接利用用户自己的 cookie 来通过安全验证。要抵御 CSRF，关键在于在请求中放入黑客所不能伪造的信息，并且该信息不存在于 cookie 之中。可以在 HTTP 请求中以参数的形式加入一个随机产生的 token，并在服务器端建立一个拦截器来验证这个 token，如果请求
token验证
m0_64990797的博客
04-21 3754
为什么使用token验证 在web领域基于token的身份验证随处可变，在大多说使用web API的互联网公司中，tokens是多用户下处理认证的最佳方式 一下几点特性会让你在程序中使用基于Token 的身份验证 无状态、可扩展 支持移动设备 跨程序调用 安全 那些使用基于Token的身份验证的大佬们 大部分你见到过的API和WEB应用都是用tokens，列如facebook, twitter, google+, github等 Token的起源 在介绍基于token的身份验证的原理与优势之前，不
资源服务器验证Token的几种方式
bobozai86的博客
05-25 7337
资源服务器验证Token的几种方式 在微服务中，除了eureka，config，网关等基本的微服务还有认证服务和资源服务， 上图描述了使用了 OAuth2 的客户端请求验证token的流程，是通过资源服务向认证服务验证token。 过程就是客户端用用户名和密码到认证服务获取token，客户端拿着 token 去各个微服务请求数据接口， 当微服务接到请求后，先要拿着 token 去认证服务校验token 的合法性，如果合法，请求成功接口处理返回数据。 这种方式首先要在认证服务的认证服务配置允
如何保证token的安全性？
这天有点热的博客
07-12 6201
引入如何保证token的安全性？原文在连接中，这里只是防止丢失做的备份。 接口的安全性主要围绕token、timestamp和sign三个机制展开设计，保证接口的数据不会被篡改和重复调用，下面具体来看： Token授权机制： 用户使用用户名密码登录后服务器给客户端返回一个Token（通常是UUID），并将Token-UserId以键值对的形式存放在缓存服务器中。服务端接收到请求后进行Token验证，如果Token不存在，说明请求无效。Token是客户端访问服务端的凭证。 时间戳超时机制： 用户每次请求都带上
使用cors跨域的代码
最新发布
04-25
xhr.setRequestHeader("Access-Control-Allow-Headers", "Content-Type, Content-Length, Accept-Encoding, X-CSRF-Token"); ``` 注意：在将这些代码复制到您的应用程序中之前，请确保您已经了解跨域安全性问题。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值