Извлечение данных из формы React в Json с помощью Flask

#python #reactjs #flask #frontend #backend

#python #reactjs #flask #интерфейс #серверная часть

Вопрос:

Я хочу получить входные данные из формы React и передать выходные данные в формате JSON в flask API. У меня есть динамические данные, которые я хочу передать. Однако я не могу понять, как это сделать.

Форма React

 function App (){
  
  
  const [initialData, setInitialData] = useState([{}]);
  useEffect(() => {
    fetch('/result').then(
      response => response.json()
    ).then(data => setInitialData(data))
  }, []);
  
    return (
      <div className="App">
          <h1 className="header">Twitter Sentiment Analysis</h1>
            <form action="http://localhost:3000/result" method = "POST">
              <div className="forms">
              <label>
                Enter Twitter Handle:
              <input type="text" name="handle" />
              </label>
              <label>
                Enter Number of Tweets (200 Limit):
              <input type="text" name="tCount"/>
              </label>
              </div>
              <div className = "button">
              <input type="submit" method="POST"/>
              </div>
            </form>
  
      </div>
    );
  
}
export default App;
  

Это функция Flask, которую я использую

 app = Flask(__name__)
CORS(app)

handle = ''
tCount = 0

@app.route('/result', methods = ['POST'])
def result():
    h = request.json[0]
    c = request.json[1]

    data = {'handle': h, 'tCount': c}

    return jsonify(data)
  

Как я могу аккуратно перевести переменные из формы React в формат JSON в Flask?

Ответ №1:

Вместо использования request.json , я думаю, вы можете использовать request.form.get(key) или request.form[key] . Итак, я могу изменить этот блок кода

 @app.route('/result', methods = ['POST'])
def result():
    h = request.json[0]
    c = request.json[1]

    data = {'handle': h, 'tCount': c}

    return jsonify(data)
  

Для

 @app.route('/result', methods = ['POST'])
def result():
    # If you have any other keys but don't want to include
    data = {'handle': request.form['handle'], 'tCount': request.form['tCount']}

    # If you only have two keys (handle and tCount)
    data = request.form

    return jsonify(data)
  

Для получения более удобной информации вы можете прочитать больше по адресу (https://www.digitalocean.com/community/tutorials/processing-incoming-request-data-in-flask )