Rails CORS: ActionController::RoutingError (No route matches [OPTIONS] "/batches"):

Question

I am trying to perform cross-platform request in rails.

My jquery code is as follow:-

<script>
    $.ajaxSetup({
      headers: {
        'X-CSRF-Token': $('meta[name="csrf-token"]').attr('content')
      }
    });
    $(document).ready(function () {
        $('#submit-button').click(function() {
            $.ajax({
                type: "POST",
                url: "http://localhost:3000/batches",
                beforeSend: function(xhr) {xhr.setRequestHeader('X-CSRF-Token', $('meta[name="csrf-token"]').attr('content'))},
                xhrFields: {
                    withCredentials: true
                },
                data: {     
                    batch: {
                      name: $("#name").val(),
                      course_id: $("#course_id").val(),
                      start_date: $("#start_date").val(),
                      end_date: $("#end_date").val(),
                      status: $("#batch_status").val(),
                      }
                },
                dataType: "JSON",
              error: function(error) {
                    console.log(error);
                      },
              success: function(data) {
                         console.log(data);
                         return false;
                      },
            })
        });
    })
</script>

And my control is as follow: -

def new
    @batch = Batch.new
    respond_to do |format|
      format.json
      format.html
    end
  end

  def create
    @batch = Batch.new(batch_param)
    respond_to do |format|
       if @batch.save
         format.json { render json: @batch, status: :created, location: @batch }
         format.html { redirect_to @batch, notice: "Save process completed!" }
       else
          format.html {
            flash.now[:notice]="Save proccess coudn't be completed!"
            render json: @batch.errors, status: :unprocessable_entity
          }
          format.json { render json: @batch.errors, status: :unprocessable_entity}
      end
    end
  end
def batch_param
      params.require(:batch).permit(:name, :course_id, :start_date, :end_date, :status)
    end

But each time when i try to add record using form it shows following error in rails log:-

Error when i submit my first data

Started OPTIONS "/batches" for 127.0.0.1 at 2017-01-11 22:02:49 +0545
  ActiveRecord::SchemaMigration Load (0.5ms)  SELECT "schema_migrations".* FROM "schema_migrations"

ActionController::RoutingError (No route matches [OPTIONS] "/batches"):

Error when i submit data more the one time: -

Started OPTIONS "/batches" for 127.0.0.1 at 2017-01-11 22:08:50 +0545

ActionController::RoutingError (No route matches [OPTIONS] "/batches"):

Can anyone help me in this problem.

Answer 1

You need to configure Rails to support CORS .

One solution is to use the rack-cors gem.

The following snipped will be needed to be added to config/application.rb

module YourApp
  class Application < Rails::Application

    # ...

    # Rails 3/4

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

    # Rails 5

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

  end
end