Rails 4 Facebook Applications
[Read: Rails 4 iframe-based applications]
Rails 4 goes above and beyond to fix its "insecure defaults". Among these fixes are changes to the default headers included in responses. These new headers will cause you to run into problems when creating Facebook applications (or any application which will live inside an iframe).
The new headers in question:
# actionpack/lib/action_dispatch/railtie.rb (L20)
config.action_dispatch.default_headers = {
'X-Frame-Options' => 'SAMEORIGIN',
'X-XSS-Protection' => '1; mode=block',
'X-Content-Type-Options' => 'nosniff'
}The new "X-Frame-Options" header only allows for iframe requests where the parent window is on the same domain. This obviously causes issues as the parent window for a Facebook application is "apps.facebook.com".
There are a few ways to fix this floating around on the web but I've experienced issues with all of them. I've found that the simplest and most-effective way to fix the issue is to simply remove the header altogether.
Simply override the default headers by removing "X-Frame-Options" in your config/application.rb:
# config/application.rb
config.action_dispatch.default_headers = {
'X-XSS-Protection' => '1; mode=block',
'X-Content-Type-Options' => 'nosniff'
}If you have a more effective way, please let me know.
Good luck!
Written by Tom Milewski
Related protips
6 Responses
You can just remove it with:
config.actiondispatch.defaultheaders.clear
@jnajera but .clear() would remove all of them, which is a different behaviour.
@jnajera I have to agree with @Papipo. We don't want to simply remove all of the headers but rather individual ones. Sadly, config.actiondispatch.default_headers.delete('X-Frame-Options') isn't a thing.
I have updated my 'config/application.rb' as suggested in the this tip.
But no matter what I do I keep getting this error in my console while trying to do a redirect and the oauth dialog does not appear -
Refused to display https://www.facebook.com/dialog/oauth?client_id=FACEBOOK_APP_ID&redirect_uri=http://localhost:3000' in a frame because it set 'X-Frame-Options' to 'DENY'. Fixed the issue by doing a Javascipt redirect
<script>
top.location="https://www.facebook.com/dialog/oauth?client_id=FACEBOOK_APP_ID&redirect_uri=http://apps.facebook.com/app-namespace";
</script>Looks like facebook does not allow redirect within iframe (and canvas apps are in iframe)
config.action_dispatch.default_headers.delete 'X-Frame-Options'works for me
