-1

I am new to this kind of react flask setup and have followed multiple tutorials but none seems to work for me. All I want to have is get data sent from flask in react app.

My current setup looks like this for App.js.

enter image description here

I have also added "proxy":"http://localhost:5000/", in package.json

And flask page looks like this enter image description here

and this is how my react page is showing

enter image description here

I can't get my values get updated

ar d
  • 51
  • 5

3 Answers3

1

To start debugging, I would suggest looking at your dev console under the network tab to see what request your javascript is making and also in the javascript console to see if the server is responding with any kind of error.

davidism
  • 121,510
  • 29
  • 395
  • 339
  • Failed to load resource: the server responded with a status of 403 (Forbidden) http://localhost:3000/data. It's pointing to 3000 port which is set for react server also I tried addding http://localhost:5000/data directly in fetch(). I got issue saying[Error] Origin http://localhost:3000 is not allowed by Access-Control-Allow-Origin. Status code: 200 [Error] Fetch API cannot load http://127.0.0.1:5000/data due to access control checks. – ar d Mar 14 '23 at 13:18
  • I think I need to looki into CORS – ar d Mar 14 '23 at 13:24
0

there is problem in your flask code , you have added only route but you have't specified method i think ..

from flask import Flask, jsonify, request
# initialize our Flask application
app= Flask(__name__)
@app.route("/name", methods=["POST"])
def setName():
    if request.method=='POST':
        posted_data = request.get_json()
        data = posted_data['data']
        return jsonify(str("Successfully stored  " + str(data)))
@app.route("/message", methods=["GET"])
def message():
    posted_data = request.get_json()
    name = posted_data['name']
    return jsonify(" Hope you are having a good time " +  name + "!!!")
#  main thread of execution to start the server
if __name__=='__main__':
    app.run(debug=True)
0

enter image description here

The issue was with having two servers and I resolved this issue by making changes in server side config which is flask by using CORS from flask_cors

ar d
  • 51
  • 5