title: Cross-Origin Request Blocked with Sinatra and ReactJS
body: <p>I am building a simple Sinatra backend with ReactJS frontend. When I try to make request to a route in my Sinatra project from React app it gives me CORS error. I tried to enable CORS in my project like this but it didn't work:</p>
  
  <pre class="lang-rb prettyprint-override"><code>require 'sinatra'
  require 'sinatra/cross_origin'
  require 'json'
  
  configure do
      enable :cross_origin
  end
  
  set :allow_origin, :any
  set :allow_methods, [:get, :post, :options]
  set :allow_credentials, true
  set :max_age, "1728000"
  set :expose_headers, ['Content-Type']
  
  get '/' do 
      'Hello!'    
  end
  
  post '/download' do
      content_type :json
  
      return {res: params['songs']}.to_json
  end
  </code></pre>
  
  <p>So when I do a request like this from React:</p>
  
  <pre class="lang-js prettyprint-override"><code>axios.post('http://localhost:4567/download', {}, {
      songs: this.state.songs
  }).then(res =&gt; {
      console.log(res.data)
  })
  </code></pre>
  
  <p>I get a CORS error which looks like this:<br>
  <a href="https://i.stack.imgur.com/W8MCx.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/W8MCx.png" alt="enter image description here"></a></p>
  
  <p>And I get this error in the console:
  <a href="https://i.stack.imgur.com/XAlQw.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/XAlQw.png" alt="enter image description here"></a></p>
  
  <p>What should I change in my Sinatra/React project to make this work so I can make requests from React to Sinatra?</p>