如何将变量从 Javascript 传递到 Flask答案

【问题标题】：How to pass a variable from Javascript to Flask如何将变量从 Javascript 传递到 Flask
【发布时间】：2021-12-30 09:50:36
【问题描述】：

我正在做一个小项目，我想将变量“x”的值从 javascript 传递给 pyhthon 变量 get_x。有人可以帮助我如何做到这一点。

index.html:

<html>
<body>
<p id="msglog"></p>
<input type="text" id="msg">
<button onclick="myFunction()">></button>
</body>

<script>
function myFunction() {
  var x = document.getElementById("msg").value;
  document.getElementById("msglog").innerHTML = x;
  return x
}
</script>
</html>

main.py:

from flask import Flask, render_template

app = Flask(__name__,template_folder='',static_folder='')

@app.route("/")
def mainpage():
  return render_template('/index.html')

app.run(host='0.0.0.0')

【问题讨论】：

是什么让你认为这是可能的？
你应该从你的 JS 代码向 python 发出一个 post 请求

标签： javascript python flask web-development-server

【解决方案1】：

您必须向您的烧瓶应用程序发送请求。为此，您需要一个 AJAX 请求。例如显示在这篇文章中： How to GET data in Flask from AJAX post

我还建议您使用 jQuery，例如 https://flask.palletsprojects.com/en/2.0.x/patterns/jquery/
中的这个示例蟒蛇：

from flask import Flask, jsonify, render_template, request
app = Flask(__name__)

@app.route('/_add_numbers')
def add_numbers():
    a = request.args.get('a', 0, type=int)
    b = request.args.get('b', 0, type=int)
    return jsonify(result=a + b)

@app.route('/')
def index():
    return render_template('index.html')

Javascript/jQuery

<script>
  $(function() {
    $('a#calculate').bind('click', function() {
      $.getJSON($SCRIPT_ROOT + '/_add_numbers', {
        a: $('input[name="a"]').val(),
        b: $('input[name="b"]').val()
      }, function(data) {
        $("#result").text(data.result);
      });
      return false;
    });
  });
</script>
<h1>jQuery Example</h1>
<p><input type=text size=5 name=a> +
   <input type=text size=5 name=b> =
   <span id=result>?</span>
<p><a href=# id=calculate>calculate server side</a>

【讨论】：