反应路由器中的csrf令牌
我使用的反应和弹簧安全，并希望通过csrf令牌时，用户单击退出按钮。任何建议如何将csrf令牌包括在反应中。我在谷歌上搜索过解决方案，但没有得到任何解决方案。
import React from 'react';
import { IndexLink, Link } from 'react-router';
const Nav = (props) => (
<nav className="navbar navbar-inverse navbar-fixed-top">
<div className="container-fluid">
<div className="navbar-header">
<a className="navbar-brand" href="#">GoRFQ </a>
</div>
<ul className="nav navbar-nav">
<li ><Link onlyActiveOnIndex activeStyle={{color:'#052426'}} to='/'>Home</Link></li>
<li ><Link activeStyle={{color:'#052426'}} to='/boms'>BOMs</Link></li>
<li class="dropdown"><a href="javascript:void(0)" class="dropbtn">Quotes</a>
<div class="dropdown-content">
<Link activeStyle={{color:'#052426'}} to='/quotesin' >Incoming Quotes</Link>
<Link activeStyle={{color:'#052426'}} to='/quotesout' >Outgoing Quotes</Link>
</div>
</li>
<li class="dropdown"><a href="javascript:void(0)" class="dropbtn">Requests</a>
<div class="dropdown-content">
<Link activeStyle={{color:'#052426'}} to='/requestsin' >Received Requests</Link>
<Link activeStyle={{color:'#052426'}} to='/requestsout' >Sent Requests</Link>
</div>
</li>
<li ><Link activeStyle={{color:'#052426'}} to='/upload'>Upload BOM</Link></li>
<li ><Link activeStyle={{color:'#052426'}} to='/contacts'>Contacts</Link></li>
<li ><Link activeStyle={{color:'#052426'}} to='/profile'>My Profile</Link></li>
<li ><Link activeStyle={{color:'#052426'}} to='/about'>About</Link></li>
</ul>
<form action="/perform-logout" method="post" className="pull-right">
<input type="submit" className="btn btn-primary" value="Sign Out"/>
</form>
</div>
</nav>
);
export default Nav; 回答 3
Stack Overflow用户
发布于 2017-08-07 19:14:27
我忘了告诉别人我是如何让它发挥作用的，所以它会帮助到别人。我做了以下事情：
1)我安装了反应性曲奇。
2)在我的react组件中，我导入了这个react cookie。
从“react Cookie”中导入cookie；
3)从cookie中提取XSRF令牌，并以隐藏字段的形式传递。
<form action="/perform-logout" method="post">
<input type="hidden" name="_csrf" value={Cookie.load('XSRF-TOKEN')}/>
<input type="submit" className="btn btn-primary btn-block" value="Sign Out"/>
</form> 而且起作用了。
Stack Overflow用户
发布于 2017-04-11 01:37:08
可以在spring安全性中添加以下配置
http.csrf().csrfTokenRepository(csrfTokenRepository().withHttpOnlyFalse())
.and()
.addFilterAfter(csrfHeaderFilter(), SessionManagementFilter.class)
.addFilterAfter(new CsrfHeaderFilter(), CsrfFilter.class);
private Filter csrfHeaderFilter() {
return new OncePerRequestFilter() {
@Override
protected void doFilterInternal(HttpServletRequest request,
HttpServletResponse response, FilterChain filterChain)
throws ServletException, IOException {
CsrfToken csrf = (CsrfToken) request.getAttribute(CsrfToken.class
.getName());
if (csrf != null) {
Cookie cookie = WebUtils.getCookie(request, "XSRF-TOKEN");
String token = csrf.getToken();
if (cookie == null || token != null
&& !token.equals(cookie.getValue())) {
cookie = new Cookie("XSRF-TOKEN", token);
cookie.setPath("/");
response.addCookie(cookie);
}
}
filterChain.doFilter(request, response);
}
};
}
private CsrfTokenRepository csrfTokenRepository() {
HttpSessionCsrfTokenRepository repository = new HttpSessionCsrfTokenRepository();
repository.setHeaderName("X-XSRF-TOKEN");
return repository;
}csrfHeaderFilter将将csrf令牌添加到XSRF中的响应中，并发送到客户端的cookies。下一次客户端读取cookie中的XSRF并将其放入带有XSRF键的http请求头中时，spring将使用CsrfTokenRepository在客户端头中查找XSRF令牌。
withHttpOnlyFalse()方法将httpOnly设置为false，这意味着js客户端可以在客户端的cookie中读取csrf令牌，否则js客户端无法读取它，可能是默认的withHttpOnlyFalse()。
您可以查看带有角客户端的https://spring.io/guides/tutorials/spring-security-and-angular-js/.It和csrftoken。但我认为如果你使用的话，这几乎是一样的。希望能帮助你。
Stack Overflow用户
发布于 2018-08-31 02:36:43
在中添加以下行
http.csrf().csrfTokenRepository(CookieCsrfTokenRepository.withHttpOnlyFalse());
http.addFilterAfter(new CsrfTokenResponseHeaderBindingFilter(), CsrfFilter.class);您可以发现过滤器在这里：https://github.com/aditzel/spring-security-csrf-filter
我使用reactjs，您不必在UI端做任何事情，它只是起作用
https://stackoverflow.com/questions/43333138
复制相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号