从 Python 上的 post 方法获取变量答案

【问题标题】：Get variables from post method on Python从 Python 上的 post 方法获取变量
【发布时间】：2019-04-25 14:50:43
【问题描述】：

我制作了一个运行一些任务的 python 脚本，但我希望它在客户端（前端表单）向服务器发送 POST 请求时启动。因此，我可以从客户端获取变量并使用该变量运行我的脚本。

我想我需要在我的 python 脚本上定义一个接受发布请求的服务器，但我不知道从哪里开始。你能帮我解决这个问题吗？

【问题讨论】：

您需要向您的 python 服务器创建一个Ajax call 以从 javascript 请求信息。
@KunalMukherjee 好的，谢谢，但我需要将数据从我的客户端发送到 python 服务器

标签： javascript python rest api

【解决方案1】：

我创建了一个简单的 Flask 服务器，它将人员信息附加到从客户端接收的列表中。

这是app.py，其中包含烧瓶 Python 服务器：

import os
import uuid

from flask import Flask, jsonify, request
from flask_cors import CORS

# instantiate the app
app = Flask(__name__)
app.config.from_object(__name__)

# enable CORS
CORS(app)

#static list containing persons
persons = []

#test check route
@app.route('/status', methods=['GET'])
def status():
    return jsonify(dict({ 'message': 'Hello world'}))


@app.route('/person', methods=['POST'])
def add_person():
    post_data = request.get_json()
    response_object = dict({
            'id': uuid.uuid4().hex,
            'name': post_data.get('name'),
            'age': post_data.get('name')
        })
    persons.append(response_object)
    return jsonify(response_object), 201


@app.route('/person', methods=['GET'])
def get_persons():
    return jsonify(persons), 200

@app.route('/person/<person_id>', methods=['GET'])
def get_person(person_id):
    person = list(filter(lambda x: x['id'] == person_id, persons))
    return jsonify(person), 200

if __name__ == '__main__':
    app.run(debug=True)

保存脚本并运行它：

python app.py

这是一个将姓名和年龄字段发布到您的烧瓶 API 的示例表单：

// Write the following in index.js
window.onload = () => {


  document.querySelector('#btnSubmit').addEventListener('click', function(event) {

    const pName = document.querySelector('#pName').value;
    const pAge = document.querySelector('#pAge').value;

    if (!pName || !pAge) {
      alert('Please enter all fields to continue!');
      return;
    }

    const objectToSend = {
      name: pName,
      age: pAge
    };

    fetch('http://localhost:5000/person', {
        method: 'POST',
        mode: 'cors',
        body: JSON.stringify(objectToSend)
        headers: new Headers({
          'Content-Type': 'application/json',
          'Access-Control-Allow-Origin': '*'
        })
      })
      .then(function(response) {
        return response.json()
      })
      .then(function(data) {
        console.log(data);
      })
      .catch(function(err) {
        console.err(err);
      });

  });

}

<!DOCTYPE HTML>
<HTML>

<!-- <script src="index.js"> -->

<BODY>
  <FORM name="myform">
    <label>Name: <input id="pName" type="text" placeholder="Enter name"></label>

    <label>Age: <input type="number" id="pAge" placeholder="Enter age"></label>

    <input type="button" id="btnSubmit" value="Submit">

  </FORM>

</BODY>

</HTML>

希望能给你一个良好的开端！

推荐阅读：

JS Fetch API

【讨论】：

太棒了！非常感谢你的帮助，现在我知道从哪里开始了
@JoangelDeLaRosa 没问题 :)