Ajax APIエンドポイントでCORSの問題が発生しました。

Question

APIエンドポイントにGETリクエストを送信する際に問題が発生しているようです。レールの裏側で何らかのセキュリティが働いていることがわかっています。私はReact-Railsを使っていて、私のcomponentDidMountではAPIエンドポイントへのajax呼び出しを行っています。私はX-Auth-Tokenを私のヘッダーにも入れています。

マイコンソールエラー：

XMLHttpRequest cannot load "/api/end/point..." Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin ' http://localhost:3000 ' is therefore not allowed access. The response had HTTP status code 401.

私のAJAX呼び出しがあなたのフロントエンドが任意の起源（すべてのクライアント）からの要求を行いますので、あなたが任意の起源からCORSを有効にする必要が

$.ajax({ url: "my/api/endpoint...", headers: {"X-Auth-Token": "My API token..."}, 
    success: (response) => { console.log(response); } }) 

Answer 1

のように探しています。試してみてください

# config/initializers/cors.rb 
Rails.application.config.middleware.insert_before 0, Rack::Cors do 
    allow do 
    origins '*' 
    resource '*', 
     headers: :any, 
     methods: [:get, :post, :put, :patch, :delete, :options, :head] 
    end 
end 

これをレール5 apiアプリケーションで使用します。レール5の前にrack-corsの宝石をGemfileに追加してください。とにかく、サーバーを再起動します。

レール3/4

# config/application.rb 
module YourApp 
    class Application < Rails::Application 

    config.middleware.insert_before 0, "Rack::Cors" do 
     allow do 
     origins '*' 
     resource '*', :headers => :any, :methods => [:get, :post, :options] 
     end 
    end 
    end 
end