I went through all the answers above, however, I noticed no one really talked about when you receive data from Client-side (when your client side is of different origin e.g. react app) to Server-side then you also need to handle OPTIONS pre-flight request in Flask to allow Cross-Origin access otherwise CORS error is thrown. After you handle that, then usual process is to use get_json() method on request object. Following is the code that works for me:
@app.route("/read_row_to_customer_sheet", methods=["POST", "OPTIONS"]) def read_row_to_customer_sheet(): if request.method == "OPTIONS": response = make_response() response.headers.add("Access-Control-Allow-Origin", "*") response.headers.add('Access-Control-Allow-Headers', "*") response.headers.add("Content-Type", "application/json") return response elif request.method == 'POST': form = request.get_json() print(form) # your custom logic goes here response = make_response() response.headers.add("Access-Control-Allow-Origin", "*") return response
Also make sure you put request.get_json() in elif block not at the beginning of function. Otherwise you will encounter the CORS error at client-side and possibly 415 error at server side because when you receive the pre-flight OPTIONS request the function will try to decode it as json because you placed the request.get_json() at the beginning, therefore, following control-flow is wrong:
### WRONG Route Function @app.route("/read_row_to_customer_sheet", methods=["POST", "OPTIONS"]) def read_row_to_customer_sheet(): form = request.get_json() if request.method == "OPTIONS": response = make_response() response.headers.add("Access-Control-Allow-Origin", "*") response.headers.add('Access-Control-Allow-Headers', "*") response.headers.add("Content-Type", "application/json") return response elif request.method == 'POST': print(form) # your custom logic goes here response = make_response() response.headers.add("Access-Control-Allow-Origin", "*") return response