blocks|key|165144|text|如果你使用的是默认的Rails+CSRF保护(<%25=+csrf_meta_tags+%25>)，你可以这样配置你的Angular模块：|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|165145|myAngularApp.config+["$httpProvider",+($httpProvider)+->
++$httpProvider.defaults.headers.common['X-CSRF-Token']+=+$('meta[name=csrf-token]').attr('content')
]|code-block|syntax|javascript|165146|或者，如果您没有使用CoffeeScript+(什么！？)：|165147|myAngularApp.config([
++"$httpProvider",+function($httpProvider)+{
++++$httpProvider.defaults.headers.common['X-CSRF-Token']+=+$('meta[name=csrf-token]').attr('content');
++}
]);|165148|如果您愿意，您可以只在非GET请求上发送header，如下所示：|165149|myAngularApp.config+["$httpProvider",+($httpProvider)+->
++csrfToken+=+$('meta[name=csrf-token]').attr('content')
++$httpProvider.defaults.headers.post['X-CSRF-Token']+=+csrfToken
++$httpProvider.defaults.headers.put['X-CSRF-Token']+=+csrfToken
++$httpProvider.defaults.headers.patch['X-CSRF-Token']+=+csrfToken
++$httpProvider.defaults.headers.delete['X-CSRF-Token']+=+csrfToken
]|165150|此外，请务必查看HungYuHei's+answer，它涵盖了服务器上的所有基础，而不是客户端。|165151|entityMap|0|LINK|mutability|MUTABLE|url|https://stackoverflow.com/questions/14734243/rails-csrf-protection-angular-js-protect-from-forgery-makes-me-to-log-out-on/15761835#15761835^0|N|L|0|0|0|0|0|0|8|I|0|0^^$0|@$1|2|3|4|5|6|7|12|8|@$9|13|A|14|B|C]]|D|@]|E|$]]|$1|F|3|G|5|H|7|15|8|@]|D|@]|E|$I|J]]|$1|K|3|L|5|6|7|16|8|@]|D|@]|E|$]]|$1|M|3|N|5|H|7|17|8|@]|D|@]|E|$I|J]]|$1|O|3|P|5|6|7|18|8|@]|D|@]|E|$]]|$1|Q|3|R|5|H|7|19|8|@]|D|@]|E|$I|J]]|$1|S|3|T|5|6|7|1A|8|@]|D|@$9|1B|A|1C|1|1D]]|E|$]]|$1|U|3|-4|5|6|7|1E|8|@]|D|@]|E|$]]]|V|$W|$5|X|Y|Z|E|$10|11]]]]

If you're using the default Rails CSRF protection (<code>&lt;%= csrf_meta_tags %&gt;</code>), you can configure your Angular module like this:

<pre><code>myAngularApp.config ["$httpProvider", ($httpProvider) -&gt;
 $httpProvider.defaults.headers.common['X-CSRF-Token'] = $('meta[name=csrf-token]').attr('content')
]
</code></pre>

Or, if you're not using CoffeeScript (what!?):

<pre><code>myAngularApp.config([
 "$httpProvider", function($httpProvider) {
 $httpProvider.defaults.headers.common['X-CSRF-Token'] = $('meta[name=csrf-token]').attr('content');
 }
]);
</code></pre>

If you prefer, you can send the header only on non-GET requests with something like the following:

<pre><code>myAngularApp.config ["$httpProvider", ($httpProvider) -&gt;
 csrfToken = $('meta[name=csrf-token]').attr('content')
 $httpProvider.defaults.headers.post['X-CSRF-Token'] = csrfToken
 $httpProvider.defaults.headers.put['X-CSRF-Token'] = csrfToken
 $httpProvider.defaults.headers.patch['X-CSRF-Token'] = csrfToken
 $httpProvider.defaults.headers.delete['X-CSRF-Token'] = csrfToken
]
</code></pre>

Also, be sure to check out <a href="https://stackoverflow.com/questions/14734243/rails-csrf-protection-angular-js-protect-from-forgery-makes-me-to-log-out-on/15761835#15761835">HungYuHei's answer</a>, which covers all the bases on the server rather than the client.

blocks|key|383129|text|我看到了其他的答案，认为它们很棒，而且经过深思熟虑。我让我的rails应用程序正常工作，但我认为这是一个更简单的解决方案，所以我想我应该分享一下。我的rails应用附带了这个默认设置，|type|unstyled|depth|inlineStyleRanges|entityRanges|data|383130|class+ApplicationController+<+ActionController::Base
++#+Prevent+CSRF+attacks+by+raising+an+exception.
++#+For+APIs,+you+may+want+to+use+:null_session+instead.
++protect_from_forgery+with:+:exception
end|code-block|syntax|javascript|383131|我看了评论，似乎这就是我想使用angular并避免csrf错误的地方。我把它改成了这个|383132|class+ApplicationController+<+ActionController::Base
++#+Prevent+CSRF+attacks+by+raising+an+exception.
++#+For+APIs,+you+may+want+to+use+:null_session+instead.
++protect_from_forgery+with:+:null_session
end|383133|现在它起作用了！我看不出这有什么不起作用的原因，但我很乐意从其他海报中听到一些见解。|383134|entityMap^0|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|O|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|P|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|Q|8|@]|9|@]|A|$]]|$1|I|3|J|5|D|7|R|8|@]|9|@]|A|$E|F]]|$1|K|3|L|5|6|7|S|8|@]|9|@]|A|$]]|$1|M|3|-4|5|6|7|T|8|@]|9|@]|A|$]]]|N|$]]

I saw the other answers and thought they were great and well thought out. I got my rails app working though with what I thought was a simpler solution so I thought I'd share. My rails app came with this defaulted in it,

<pre><code>class ApplicationController &lt; ActionController::Base
 # Prevent CSRF attacks by raising an exception.
 # For APIs, you may want to use :null_session instead.
 protect_from_forgery with: :exception
end
</code></pre>

I read the comments and it seemed like that is what I want to use angular and avoid the csrf error. I changed it to this,

<pre><code>class ApplicationController &lt; ActionController::Base
 # Prevent CSRF attacks by raising an exception.
 # For APIs, you may want to use :null_session instead.
 protect_from_forgery with: :null_session
end
</code></pre>

And now it works! I don't see any reason why this shouldn't work, but I'd love to hear some insight from other posters.

blocks|key|383191|text|angular_rails_csrf+gem会自动向所有控制器添加对HungYuHei's+answer中描述的模式的支持：|type|unstyled|depth|inlineStyleRanges|entityRanges|offset|length|data|383192|#+Gemfile
gem+'angular_rails_csrf'|code-block|syntax|javascript|383193|entityMap|0|LINK|mutability|MUTABLE|url|https://github.com/jsanders/angular_rails_csrf|1|https://stackoverflow.com/questions/14734243/rails-csrf-protection-angular-js-protect-from-forgery-makes-me-to-log-out-on/15761835#15761835^0|0|I|0|Y|I|1|0|0^^$0|@$1|2|3|4|5|6|7|S|8|@]|9|@$A|T|B|U|1|V]|$A|W|B|X|1|Y]]|C|$]]|$1|D|3|E|5|F|7|Z|8|@]|9|@]|C|$G|H]]|$1|I|3|-4|5|6|7|10|8|@]|9|@]|C|$]]]|J|$K|$5|L|M|N|C|$O|P]]|Q|$5|L|M|N|C|$O|R]]]]

The <a href="https://github.com/jsanders/angular_rails_csrf" rel="nofollow noreferrer">angular_rails_csrf</a> gem automatically adds support for the pattern described in <a href="https://stackoverflow.com/questions/14734243/rails-csrf-protection-angular-js-protect-from-forgery-makes-me-to-log-out-on/15761835#15761835">HungYuHei's answer</a> to all your controllers:

<pre><code># Gemfile
gem 'angular_rails_csrf'
</code></pre>

blocks|key|165275|text|我已经在我的应用程序中使用了洪玉黑答案中的内容。然而，我发现我正在处理一些额外的问题，一些是因为我使用Devise进行身份验证，另一些是因为我的应用程序获得了默认设置：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|165276|protect_from_forgery+with:+:exception|code-block|syntax|javascript|165277|我注意到了相关的stack+overflow+question+and+the+answers+there，并且我写了一个更详细的blog+post，总结了各种注意事项。在应用程序控制器中，与该解决方案相关的部分是：|offset|length|165278|++protect_from_forgery+with:+:exception

++after_filter+:set_csrf_cookie_for_ng

++def+set_csrf_cookie_for_ng
++++cookies['XSRF-TOKEN']+=+form_authenticity_token+if+protect_against_forgery?
++end

++rescue_from+ActionController::InvalidAuthenticityToken+do+%7Cexception%7C
++++cookies['XSRF-TOKEN']+=+form_authenticity_token+if+protect_against_forgery?
++++render+:error+=>+'Invalid+authenticity+token',+{:status+=>+:unprocessable_entity}+
++end

protected
++def+verified_request?
++++super+%7C%7C+form_authenticity_token+==+request.headers['X-XSRF-TOKEN']
++end|165279|entityMap|0|LINK|mutability|MUTABLE|url|https://stackoverflow.com/questions/11845500/rails-devise-authentication-csrf-issue/|1|http://technpol.wordpress.com/2014/04/17/rails4-angularjs-csrf-and-devise/^0|0|0|8|19|0|1T|9|1|0|0^^$0|@$1|2|3|4|5|6|7|W|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|X|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|Y|8|@]|9|@$I|Z|J|10|1|11]|$I|12|J|13|1|14]]|A|$]]|$1|K|3|L|5|D|7|15|8|@]|9|@]|A|$E|F]]|$1|M|3|-4|5|6|7|16|8|@]|9|@]|A|$]]]|N|$O|$5|P|Q|R|A|$S|T]]|U|$5|P|Q|R|A|$S|V]]]]

I've used the content from HungYuHei's answer in my application. I found that I was dealing with a few additional issues however, some because of my use of Devise for authentication, and some because of the default that I got with my application:

<pre><code>protect_from_forgery with: :exception
</code></pre>

I note the related <a href="https://stackoverflow.com/questions/11845500/rails-devise-authentication-csrf-issue/">stack overflow question and the answers there</a>, and I wrote a much more verbose <a href="http://technpol.wordpress.com/2014/04/17/rails4-angularjs-csrf-and-devise/" rel="nofollow noreferrer">blog post</a> that summarises the various considerations. The portions of that solution that are relevant here are, in the application controller:

<pre><code> protect_from_forgery with: :exception

 after_filter :set_csrf_cookie_for_ng

 def set_csrf_cookie_for_ng
 cookies['XSRF-TOKEN'] = form_authenticity_token if protect_against_forgery?
 end

 rescue_from ActionController::InvalidAuthenticityToken do |exception|
 cookies['XSRF-TOKEN'] = form_authenticity_token if protect_against_forgery?
 render :error =&gt; 'Invalid authenticity token', {:status =&gt; :unprocessable_entity} 
 end

protected
 def verified_request?
 super || form_authenticity_token == request.headers['X-XSRF-TOKEN']
 end
</code></pre>

blocks|key|383247|text|合并了前面所有答案的答案依赖于您使用的是Devise身份验证gem。|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|383248|首先，添加gem：|383249|gem+'angular_rails_csrf'|code-block|syntax|javascript|383250|接下来，将rescue_from块添加到application_controller.rb中：|383251|protect_from_forgery+with:+:exception

rescue_from+ActionController::InvalidAuthenticityToken+do+%7Cexception%7C
++cookies['XSRF-TOKEN']+=+form_authenticity_token+if+protect_against_forgery?
++render+text:+'Invalid+authenticity+token',+status:+:unprocessable_entity
end|383252|最后，将拦截器模块添加到您的angular应用程序。|383253|#+coffee+script
app.factory+'csrfInterceptor',+['$q',+'$injector',+($q,+$injector)+->
++responseError:+(rejection)+->
++++if+rejection.status+==+422+&&+rejection.data+==+'Invalid+authenticity+token'
++++++++deferred+=+$q.defer()

++++++++successCallback+=+(resp)+->
++++++++++deferred.resolve(resp)
++++++++errorCallback+=+(resp)+->
++++++++++deferred.reject(resp)

++++++++$http+=+$http+%7C%7C+$injector.get('$http')
++++++++$http(rejection.config).then(successCallback,+errorCallback)
++++++++return+deferred.promise

++++$q.reject(rejection)
]

app.config+($httpProvider)+->
++$httpProvider.interceptors.unshift('csrfInterceptor')|383254|entityMap^0|K|6|0|0|0|5|B|0|0|0|0^^$0|@$1|2|3|4|5|6|7|W|8|@$9|X|A|Y|B|C]]|D|@]|E|$]]|$1|F|3|G|5|6|7|Z|8|@]|D|@]|E|$]]|$1|H|3|I|5|J|7|10|8|@]|D|@]|E|$K|L]]|$1|M|3|N|5|6|7|11|8|@$9|12|A|13|B|C]]|D|@]|E|$]]|$1|O|3|P|5|J|7|14|8|@]|D|@]|E|$K|L]]|$1|Q|3|R|5|6|7|15|8|@]|D|@]|E|$]]|$1|S|3|T|5|J|7|16|8|@]|D|@]|E|$K|L]]|$1|U|3|-4|5|6|7|17|8|@]|D|@]|E|$]]]|V|$]]

The answer that merges all previous answers and it relies that you are using <code>Devise</code> authentication gem.

First of all, add the gem:

<pre><code>gem 'angular_rails_csrf'
</code></pre>

Next, add <code>rescue_from</code> block into application_controller.rb:

<pre><code>protect_from_forgery with: :exception

rescue_from ActionController::InvalidAuthenticityToken do |exception|
 cookies['XSRF-TOKEN'] = form_authenticity_token if protect_against_forgery?
 render text: 'Invalid authenticity token', status: :unprocessable_entity
end
</code></pre>

And the finally, add the interceptor module to you angular app.

<pre><code># coffee script
app.factory 'csrfInterceptor', ['$q', '$injector', ($q, $injector) -&gt;
 responseError: (rejection) -&gt;
 if rejection.status == 422 &amp;&amp; rejection.data == 'Invalid authenticity token'
 deferred = $q.defer()

 successCallback = (resp) -&gt;
 deferred.resolve(resp)
 errorCallback = (resp) -&gt;
 deferred.reject(resp)

 $http = $http || $injector.get('$http')
 $http(rejection.config).then(successCallback, errorCallback)
 return deferred.promise

 $q.reject(rejection)
]

app.config ($httpProvider) -&gt;
 $httpProvider.interceptors.unshift('csrfInterceptor')
</code></pre>

blocks|key|383331|text|我找到了一个非常快速的破解方法。我所要做的就是：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|383332|a.在我看来，我初始化了一个包含令牌的$scope变量，比方说在表单之前，或者在控制器初始化时更好：|offset|length|style|CODE|383333|<div+ng-controller="MyCtrl"+ng-init="authenticity_token+=+'<%25=+form_authenticity_token+%25>'">|code-block|syntax|javascript|383334|b.在我的AngularJS控制器中，在保存新条目之前，我将令牌添加到散列中：|383335|$scope.addEntry+=+->
++++$scope.newEntry.authenticity_token+=+$scope.authenticity_token+
++++entry+=+Entry.save($scope.newEntry)
++++$scope.entries.push(entry)
++++$scope.newEntry+=+{}|383336|不需要做更多的事情。|383337|entityMap^0|0|J|6|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|U|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|V|8|@$D|W|E|X|F|G]]|9|@]|A|$]]|$1|H|3|I|5|J|7|Y|8|@]|9|@]|A|$K|L]]|$1|M|3|N|5|6|7|Z|8|@]|9|@]|A|$]]|$1|O|3|P|5|J|7|10|8|@]|9|@]|A|$K|L]]|$1|Q|3|R|5|6|7|11|8|@]|9|@]|A|$]]|$1|S|3|-4|5|6|7|12|8|@]|9|@]|A|$]]]|T|$]]

I found a very quick hack to this. All I had to do is the following:

a. In my view, I initialize a <code>$scope</code> variable which contains the token, let's say before the form, or even better at controller initialization:

<pre><code>&lt;div ng-controller="MyCtrl" ng-init="authenticity_token = '&lt;%= form_authenticity_token %&gt;'"&gt;
</code></pre>

b. In my AngularJS controller, before saving my new entry, I add the token to the hash:

<pre><code>$scope.addEntry = -&gt;
 $scope.newEntry.authenticity_token = $scope.authenticity_token 
 entry = Entry.save($scope.newEntry)
 $scope.entries.push(entry)
 $scope.newEntry = {}
</code></pre>

Nothing more needs to be done.

blocks|key|383372|text|+angular
++.module('corsInterceptor',+['ngCookies'])
++.factory(
++++'corsInterceptor',
++++function+($cookies)+{
++++++return+{
++++++++request:+function(config)+{
++++++++++config.headers["X-XSRF-TOKEN"]+=+$cookies.get('XSRF-TOKEN');
++++++++++return+config;
++++++++}
++++++};
++++}
++);|type|code-block|depth|inlineStyleRanges|entityRanges|data|syntax|javascript|383373|它在angularjs一边工作！|unstyled|383374|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$B|C]]|$1|D|3|E|5|F|7|J|8|@]|9|@]|A|$]]|$1|G|3|-4|5|F|7|K|8|@]|9|@]|A|$]]]|H|$]]

<pre><code> angular
 .module('corsInterceptor', ['ngCookies'])
 .factory(
 'corsInterceptor',
 function ($cookies) {
 return {
 request: function(config) {
 config.headers["X-XSRF-TOKEN"] = $cookies.get('XSRF-TOKEN');
 return config;
 }
 };
 }
 );
</code></pre>

It's working on angularjs side!

If the <code>protect_from_forgery</code> option is mentioned in application_controller, then I can log in and perform any GET requests, but on very first POST request Rails resets the session, which logs me out.

I turned the <code>protect_from_forgery</code> option off temporarily, but would like to use it with Angular.js. Is there some way to do that?

Rails CSRF Protection + Angular.js: protect_from_forgery makes me to log out on POST

身份验证

服务器

如果在application_controller中提到了protect_from_forgery选项，那么我可以登录并执行任何GET请求，但是在第一次POST请求时，Rails会重置会话，这会将我注销。我暂时关闭了protect_from_forgery选项，但希望在Angular.js中使用它。有什么方法可以做到这...

问Rails CSRF Protection + Angular.js: protect_from_forgery让我可以在POST中注销
EN

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问Rails CSRF Protection + Angular.js: protect_from_forgery让我可以在POST中注销EN

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问Rails CSRF Protection + Angular.js: protect_from_forgery让我可以在POST中注销
EN