chadoh chadoh - 1 year ago 83
jQuery Question

CORS issue: Getting error "No 'Access-Control-Allow-Origin' header is present" when it actually is

I doubt the backend serving my app is important, but if you care, I'm using rack-cors with a Rails 4.0 app.

Using jQuery, I send my app a

request like so:

url: "",
type: "PATCH",
data: { something: "something else" }

When I trigger this call from Chrome, I see a successful
request go out, which returns these headers from my server:

Access-Control-Allow-Headers:accept, content-type
Access-Control-Allow-Methods:GET, PUT, PATCH, OPTIONS
Access-Control-Allow-Origin: http://sending-app.localhost:3000

Then I see a
request go out, which throws this error:

XMLHttpRequest cannot load No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://sending-app.localhost:3000' is therefore not allowed access.

I have tried switching from
with the same results.

This doesn't make any sense to me. What's going on?

Update: My config/application.rb

I thought the headers told the whole story, but since people are confused, here's my
file, which is how the rack-cors plugin for Rails is configured:

config.middleware.use Rack::Cors do
allow do
origins '*'
resource '*',
:headers => :any,
:methods => [:get, :put, :patch, :options],
:max_age => 15

Answer Source

Exclude Rails CSRF checking in the action ;)

That is, Rails checks for an authenticity token with update/create requests. Within your Rails app, this token is added to all of your forms. But with javascript requests, including it is tricky.

You can skip checking it for an action by adding this to your controller:

skip_before_filter :verify_authenticity_token, :only => [:update]

BTW, your problem had nothing to do with CORS, you were getting a bad error message in the browser. The Rails log tells the real story.

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download