title: React not reading json returned from flask GET endpoint
body: <p>I'm trying to fetch data returned from url. Curl to the url results in following:</p>
  
  <p>[{"name": "Hello World!"}]</p>
  
  <p>Following is the code in my App.js</p>
  
  <pre><code>
  import React, { Component } from 'react';
  import Contacts from './components/contacts';
  
  
  class App extends Component {
    render() {
      return (
        &lt;Contacts contacts={this.state.contacts} /&gt;
    )
    }
    state = {
      contacts: []
    };
  
    componentDidMount() {
      fetch('url')
      .then(res =&gt; res.json())
      .then((data) =&gt; {
        this.setState({ contacts: data })
      })
      .catch(console.log)
    }
  
  }
  
  export default App;
  </code></pre>
  
  <p>My contact.js contains the following:</p>
  
  <pre><code>// src/components/contacts.js
  
  import React from 'react'
  
  const Contacts = ({ contacts }) =&gt; {
      return (
      &lt;div&gt;
          &lt;center&gt;&lt;h1&gt;Contact List&lt;/h1&gt;&lt;/center&gt;
          {contacts.map((contact) =&gt; (
          &lt;div class="card"&gt;
              &lt;div class="card-body"&gt;
              &lt;h5 class="card-title"&gt;{contact.name}&lt;/h5&gt;
              &lt;/div&gt;
          &lt;/div&gt;
          ))}
      &lt;/div&gt;
      )
  };
  
  export default Contacts
  </code></pre>
  
  <p>The data does not get rendered or logged. Is there an issue in the way I'm fetching it?</p>
  
  <p>EDIT: The issue is related to CORS. Not sure why using flask_cors doesn't resolve it. My server looks like:</p>
  
  <pre><code>from flask import Flask, request, json
  from flask_cors import CORS, cross_origin
  
  app = Flask(__name__)
  CORS(app)
  app.config['CORS_HEADERS'] = 'Content-Type'
  
  @app.route("/")
  def home():
      return json_response([{"name":"Hello World!"}])
  
  def json_response(payload, status=200):
       return (json.dumps(payload), status, {'content-type': 'application/json'})
  </code></pre>