如何使用Flask将数据从JS发送到Python？
我正在用Flask制作一个网站，我希望能够使用页面上的数据来执行python代码。我知道我可以简单地使用表单，但它是一个在接收用户输入时不断更新的单一页面，每次发生事情时都让它重新加载页面，这将是一个巨大的痛苦。我知道我可以在javascript中执行{{ function() }}，但是如何使用js变量在javascript中执行{{ function(args) }}呢？到目前为止，我唯一能想到的就是用js更新一个像MongoDB这样的外部数据库，然后使用Python来读取它，但是这个过程会让网站变慢很多。
jQuery需要从Python函数获取字典对象列表，然后可以在html中使用该列表。所以我需要能够做一些事情，比如：
JS：
var dictlist = { getDictList(args) };
dictlist.each(function() {
$("<.Class>").text($(this)['Value']).appendTo("#element");
});Python：
def getDictList(args):
return dictlistMadeFromArgs回答 3
Stack Overflow用户
发布于 2015-05-01 22:02:16
要使用Flask将数据从Javascript转换到Python，您可以使用数据发出AJAX POST请求或AJAX GET请求。
Flask has six HTTP methods available，我们只需要GET和POST。两者都将jsdata作为参数，但以不同的方式获取。这就是两种完全不同的语言在两个不同的环境中交换数据的方式。
首先，在Flask中实例化GET路由：
@app.route('/getmethod/<jsdata>')
def get_javascript_data(jsdata):
return jsdata或者是一个帖子：
@app.route('/postmethod', methods = ['POST'])
def get_post_javascript_data():
jsdata = request.form['javascript_data']
return jsdata第一个通过AJAX GET由/getmethod/<javascript_data>访问，如下所示：
$.get( "/getmethod/<javascript_data>" );第二个是使用AJAX POST请求：
$.post( "/postmethod", {
javascript_data: data
});其中javascript_data可以是JSON dict，也可以是一个简单的值。
如果您选择JSON，请确保将其转换为Python中的字典：
json.loads(jsdata)[0]例如：
获取：
@app.route('/getmethod/<jsdata>')
def get_javascript_data(jsdata):
return json.loads(jsdata)[0]帖子：
@app.route('/postmethod', methods = ['POST'])
def get_post_javascript_data():
jsdata = request.form['javascript_data']
return json.loads(jsdata)[0]如果您需要执行相反的操作，将Python数据向下推送到Javascript，请创建一个简单的不带参数的GET路由，该路由返回一个JSON编码的字典：
@app.route('/getpythondata')
def get_python_data():
return json.dumps(pythondata)从JQuery中检索并解码：
$.get("/getpythondata", function(data) {
console.log($.parseJSON(data))
})json.loads(jsdata)[0]中的[0]之所以存在，是因为当您在Python语言中解码一个JSON编码的字典时，您会得到一个包含单个字典的列表，该列表存储在索引0处，因此您的JSON解码数据如下所示：
[{'foo':'bar','baz':'jazz'}] #[0: {'foo':'bar','baz':'jazz'}]因为我们只需要里面的字典，而不是列表，所以我们得到了存储在索引0处的项，这就是字典。
还有，import json。
Stack Overflow用户
发布于 2021-08-10 11:32:43
.html
... id="clickMe" onclick="doFunction();">.js
function doFunction()
{
const name = document.getElementById("name_").innerHTML
$.ajax({
url: '{{ url_for('view.path') }}',
type: 'POST',
data: {
name: name
},
success: function (response) {
},
error: function (response) {
}
});
};.py
@app.route("path", methods=['GET', 'POST'])
def view():
name = request.form.get('name')
...Stack Overflow用户
发布于 2022-01-14 16:19:54
我是个编程新手，但你可以试试：
index.html
<script>
var w = window.innerWidth;
var h = window.innerHeight;
document.getElementById("width").value = w;
document.getElementById("height").value = h;
</script><html>
<head>
<!---Your Head--->
</head>
<body>
<form method = "POST" action = "/data">
<input type = "text" id = "InputType" name = "Text">
<input type = "hidden" id = "width" name = "Width">
<input type = "hidden" id = "height" name = "Height">
<input type = "button" onclick = "myFunction()">
</form>
</body>
</html>
.py
from flask import Flask, request
app = Flask(__name__)
html = open("index.html").read()
@app.route("/")
def hello():
return html
@app.route("/data", methods=["POST", "GET"])
def data():
if request.method == "GET":
return "The URL /data is accessed directly. Try going to '/form' to submit form"
if request.method == "POST":
text = request.form["Text"]
w = request.form["Width"]
h = request.form["Height"]
//process your code
return //value of your codehttps://stackoverflow.com/questions/29987323
复制相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号