javascript - Flask 可以读取 POST 数据,但不能读取另一个
问题描述
所以我试图将一些数据从我的前端传递到后端。它是用户的昵称和用户的位置。但是,虽然我可以在烧瓶中读取并打印出昵称,但当我想在后端读取位置值时,我总是得到None 。我不太确定为什么会这样,因为我实际上可以在 javascript 控制台中打印位置值,然后再将其传递给后端,一切都很好。我真的很感激任何帮助:)
这是我的相关代码: JS
$(document).on("submit", "#get_nickname", function(e)
{
var coords = {};
//Get location
if(navigator.geolocation){
navigator.geolocation.getCurrentPosition(function(loc){
var latlng = loc.coords.latitude + "," + loc.coords.longitude;
String(latlng);
latlngContainer = latlng;
coords.latlng = latlngContainer;
});
}
console.log(coords);
e.preventDefault();
$.ajax({
type: "POST",
url: "/add_address",
data: {
nickname:$("#nickname").val(),
location: coords
},
success: function()
{
set_address_cookie(31);
session_memory();
add_address_toggle();
}
})
});
PYTHON
@app.route("/add_address", methods=['POST'])
def add_address():
nickname = request.form.get("nickname")
location = request.form.get("location")
print(f"Hi {nickname}, you are here {location}")
return "", 201
以下是一些图片:
解决方案
位置正在被删除,因为它是一个对象。尝试以 json 格式发送数据,但是您必须修改您的烧瓶应用程序以接受它。
$.ajax({
type: "POST",
url: "/add_address",
contentType: "application/json; charset=utf-8",
data: JSON.stringify({
nickname:$("#nickname").val(),
location: coords
}),
success: function()
{
set_address_cookie(31);
session_memory();
add_address_toggle();
}
});
编辑:
我刚刚注意到geolocation.getCurrentPosition
回调是异步的,这意味着它会在 ajax 已经发生时稍后执行。您必须等待它完成执行才能发布。我不确定你在什么环境下工作,但我重写了你的 JS 试试看它是否适合你。
$(document).on("submit", "#get_nickname", function(e)
{
e.preventDefault();
function addAddress(data){
$.ajax({
type: "POST",
url: "/add_address",
contentType: "application/json; charset=utf-8",
data: JSON.stringify(data),
success: function()
{
set_address_cookie(31);
session_memory();
add_address_toggle();
}
});
}
var data = { nickname: $("#nickname").val() }
var coords = {};
//Get location
if(navigator.geolocation){
navigator.geolocation.getCurrentPosition(function(loc){
var latlng = loc.coords.latitude + "," + loc.coords.longitude;
String(latlng);
latlngContainer = latlng;
coords.latlng = latlngContainer;
data.coords = coords;
addAddress(data); //submit with coords
}, function(){
addAddress(data); //submit without coords when failed to get coords
});
} else addAddress(data); //submit without coords when not supported
});
推荐阅读
- java - 我希望我的用户拥有自己的数据库并将他们的数据存储在实时数据库android中
- mongodb - 如何监听mongodb中嵌入文档的变化
- vue.js - 在 Vue 中,如何更改 v-for 语句生成的一个元素?
- dropzone.js - Dropzone.js 接受的文件不能与拖放一起使用
- in-app-purchase - 恢复应用内购买时检测订阅详细信息
- powershell - 解析HTML类到变量
- javascript - 测试集成模拟 API 调用 (POST)
- jwt - API 与 jwt 一起用于身份验证。为什么我们需要一个刷新令牌?
- electron - 如何将发布者添加到电子生成器?
- tensorflow2.0 - 在自定义模型的调用部分中两次使用同一对象时出现 TensorFlow 维度错误