angular – ng2从cookie获取csrf令牌将其作为标题发布
在花了整整2天搜索网络并阅读文档以及面临同样问题的人们的大量未解决问题之后,我仍然不了解Angular 2如何处理(x-origin)cookie以及如何访问它们.
问题: HTTP/1.1 200 OK Server: Apache-Coyote/1.1 Access-Control-Allow-Origin: http://localhost:4200 Access-Control-Allow-Credentials: true Access-Control-Expose-Headers: Access-Control-Allow-Origin,Access-Control-Allow-Credentials Set-Cookie: x-csrf-token=8555257a-396f-43ac-8587-c6d489e76026; Path=/app Set-Cookie: JSESSIONID=73E38392C60370E38FBAF80143ECE212; Path=/app/; HttpOnly Expires: Thu,12 Apr 2018 07:49:02 GMT Cache-Control: max-age=31536000 Content-Type: application/json;charset=UTF-8 Transfer-Encoding: chunked Date: Wed,12 Apr 2017 07:49:02 GMT 我的部分解决方案 export class MyRequestOptions extends BaseRequestOptions { headers: Headers = new Headers({ 'Accept': 'application/json','Content-Type': 'application/json',}); withCredentials = true; } 在我的HttpService中我做了帖子并得到如下: @Injectable() export class HttpService { constructor( protected _http: Http,protected requestOptions: RequestOptions ) { } get(url): Observable<any> { return this._http.get(url,this.requestOptions).map( res => res.json() ); } post(url: string,object: any): Observable<any> { return this._http.post(url,object,this.requestOptions).map( res => res.json() ); } } 在我的app.module中我做了这样的魔术: providers: [ { provide: RequestOptions,useClass: DocumentumDefaultRequestOptions },{ provide: XSRFStrategy,useFactory: xsrfFactory } ], 我的xsrfFactory export function xsrfFactory() { return new CookieXSRFStrategy('x-csrf-token','x-csrf-token'); } 我的部分结果: POST /app/business-objects/business-objects-type HTTP/1.1 Host: localhost:8040 Connection: keep-alive Content-Length: 26 Pragma: no-cache Cache-Control: no-cache Authorization: Basic ZG1hZG1pbjphZG1pbg== Origin: http://localhost:4200 User-Agent: Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML,like Gecko) Chrome/57.0.2987.133 Safari/537.36 Content-Type: application/json Accept: application/json Referer: http://localhost:4200/page Cookie: JSESSIONID=B874C9A170EFC12BEB0EDD4266896F2A; x-csrf-token=0717876e-f402-4a1c-a31a-2d60e48509d3 我十亿美元的问题: >我如何以及在何处访问x-csrf-token,以及如何将其添加到我的请求中?
>它没有在我的情况下设置标题…但为什么? 请不要像“document.cookie”那样回答一个班轮.没有元数据,数据就毫无用处
更新角度5.0
Http服务beign不赞成使用HttpClient,CookieXSRFStrategy类也已被弃用,现在这个任务被委托给HttpClientXsrfModule类.如果要自定义标题和cookie名称,只需要像这样导入此模块: @NgModule({ imports: [ HttpClientModule,HttpClientXsrfModule.withConfig({ cookieName: 'My-Xsrf-Cookie',headerName: 'My-Xsrf-Header',}),] }) export class MyModule{} 对于未来的读者: Ajax响应cookie 您无法从任何Ajax响应访问任何cookie,如果您检查the XHR spec,您会注意到禁止访问与“Set-Cookie”匹配的标头:
但我的cookie不是httpOnly 对你有好处,但是httpOnly只声明你的cookie不能通过document.cookie访问(参见更多内容). document.cookie API 您可以使用javascript访问的唯一cookie是document.cookie,但document.cookie是指随文档一起发送的cookie(运行脚本的页面),并且不会随时修改. MDN明确指出它涉及当前的文件:
资料来源:MDN 由Ajax响应设置的任何cookie都不属于当前文档. 那么我如何实现我的csrf保护呢? cookie to header token protection是要走的路.请注意,您将在整个会话期间发送的令牌是相同的,并且不会根据发送cookie的疯狂Ajax请求进行更改.
资料来源:Wikipedia : CSRF 使用Angular 2,CookieXSRFStrategy类可以完成此任务. 原始答案
使用CookieXSRFStrategy似乎是将其添加到您的请求的方式.对于“如何”,不幸的是,答案可能是“你不能”(见进一步).
CookieXSRFStrategy
Source 基本上,它从document.cookie读取cookie并相应地修改Request标头.
这是withCredentials标志,这个标志表示XHR应该发送所有已发送的cookie(即使是之前由Ajax响应设置的那些,但是作为cookie,而不是标题,并且没有办法改变这种行为)
您正在讨论的cookie不是与文档(index.html)一起发送的,而是与另一个ajax请求一起发送的.事实是你无法访问由ajax响应(see this answer)设置的cookie,因为这将是一个安全问题:从随机网页上获取www.stackoverflow.com上的简单ajax将获得堆栈溢出cookie,并且攻击者可以窃取它很容易(如果stackoverflow响应中存在Access-Control-Allow-Origin:*标头). 另一方面,document.cookie API只能访问加载文档时设置的cookie,而不能访问任何其他cookie. 因此,您应该重新考虑服务器端的客户端/服务器通信流,因为您将能够复制到标头的唯一cookie是与脚本运行的文档一起发送的cookie(索引). HTML).
httpOnly使cookie对document.cookie API不可用,但正如我告诉你的那样,document.cookie指的是随文档发送的cookie,而不是通过Ajax响应发送的cookie.您可以在响应中使用Set-Cookie标头进行数千个ajax调用,document.cookie仍然是相同的字符串,无需任何修改. 十亿美元的解决方案 服务器应该只发送一个包含带有文档的令牌的x-csrf-token cookie,并且您应该使用对于使用CookieXSRFStrategy的每个请求对整个会话有效的令牌.为什么?因为that is how it works. (编辑:李大同) 【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容! |