title: allowing CORS request with Flask and React
body: <p>I am trying to connect a client with a server via <code>ajax</code> requests.</p>
  
  <p>My client, running on <code>localhost:8080</code>, has a button which invokes a function that does a simple <code>ajax</code> request to a locally running server, <code>localhost:5000</code>.</p>
  
  <p>onClick function:</p>
  
  <pre><code>  handleClick() {
  console.log("check flights button was clicked!");
  console.log(this.state);
  const baseUrl = 'localhost:5000'
  ajax.get(`${baseUrl}/flights/${this.state.origin}_${this.state.destination}`)
  .end((error, response) =&gt; {
    if (!error &amp;&amp; response) {
      console.log('got a valid response from the server')
    } else {
      console.log(`Error fetching data from the server: `, error)
    }
  });}
  </code></pre>
  
  <p>the (very) simple server, implemented with <code>Flask</code>, is as follows:</p>
  
  <pre><code>from flask import Flask, request
  from flask_restful import Resource, Api
  from json import dumps
  
  app = Flask(__name__)
  api = Api(app)
  
  class Flights(Resource):
      def get(self, origin, destination):
      answer = 'we got some data ' + origin + ' ' + destination
      print answer
  
  api.add_resource(Flights, '/flights/&lt;string:origin&gt;_&lt;string:destination&gt;')
  
  if __name__ == '__main__':
      app.run()
  </code></pre>
  
  <p>I can access the server if i simply go to <code>localhost:5000/flights/origin_destination</code>, which prints a message saying it received the origin and destination.
  However, when I try to do the <code>ajax</code> request, I get the following error:</p>
  
  <pre><code>XMLHttpRequest cannot load localhost:5000/flights/Porto_Lisboa. Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https.
  </code></pre>
  
  <p>Any suggestions on how to correct this behaviour?
  Thank you in advance.</p>