How to fix: React fetch Post method failing using FormData with Flask API

Question

I have a React web app that needs to communicate with a python Flask backend. I have my API sending data to the fetch method (GET) in React without a problem. I have used a fetch POST method to send data from React to python and I am getting the following error from my python script:

.
.
.
 File "/Library/Python/2.7/site-packages/flask/app.py", line 1951, in full_dispatch_request
    rv = self.handle_user_exception(e)
  File "/Library/Python/2.7/site-packages/flask_cors/extension.py", line 161, in wrapped_function
    return cors_after_request(app.make_response(f(*args, **kwargs)))
  File "/Library/Python/2.7/site-packages/flask_api/app.py", line 96, in handle_user_exception
    app_handlers = self.error_handler_spec[None].get(None, ())
KeyError: None

I have a server error as well: Origin http://localhost:3000 is not allowed by Access-Control-Allow-Origin. However since I have my GET method working without a problem I think this is a data form problem.

Here is my code in React:

  onPageChanged = data => {

    var payload = {
        a: 1,
        b: 2
    };

    var data = new FormData();
    data.append( "json", JSON.stringify( payload ) );

    fetch('http://127.0.0.1:5000/', {
    method: 'POST',
    headers: {
      'Accept': 'application/json',
      'Content-Type': 'application/json',
    },
    body: JSON.stringify({
      firstParam: data
    })
    })

If I comment out the "body: ..." part of the code then I do not have any errors and the POST method in python is reached -- it definitely seems like this data is wrong, except that based on other question answers this form should be correct such as here.

This is my backend code for reference:

@app.route("/", methods=['POST'])
@cross_origin()
def search_api():
    print "Search api reached!"
    jsondata = request.get_json()
    data = json.loads(jsondata)
    print data
    return "Search data recieved"