flask中使用ajax 处理前端请求的数据
Posted whycai
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了flask中使用ajax 处理前端请求的数据相关的知识，希望对你有一定的参考价值。
菜小鱼第一次使用 ajax，想前端提交数据，后端处理后，将结果以弹框的形式展示，在网上查看了好多，不停的调试，终于调通了（小白一个，大神绕过）
html：
<html>
<head></head>
<body>
<form class="formXXX1" method="post">
<br class="formXXX2" />
<div class="form-group">
<label for="
telephone14">手机号: <input class="form1" type="iphone" id="telephone14" name="telephone14" maxlength="11" placeholder="请输入11位合法手机号" /> </label>
</div>
<div class="example-box">
<label> 环境:</label>
<label class="lyear-radio radio-inline radio-primary"> <input type="radio" id="env14" name="env14" value="0" checked="" /><span>dev</span> </label>
<label class="lyear-radio radio-inline radio-primary"> <input type="radio" id="env14" name="env14" value="1" /><span>qa</span> </label>
</div>
<br />
<div class="form-group">
<button class="btn btn-primary" type="button" id="notify">提交</button>
</div>
</form>
</body>
</html>
js：
< script type = "text/javascript" >
$(‘#notify‘).on(‘click‘,
function() {
//取变量
var envId = $(‘#env14‘).val();
var telephone = $(‘#telephone14‘).val();
var data = {
data: JSON.stringify({
‘env‘: env,
‘telephone‘: telephone
}),
} {
}
//小于11位提示
if (telephone.length != 11) {
alert(‘手机号小于11位，请重新输入‘);
return;
}
//ajax 提交数据
$.ajax({
type: "POST",
dataType: "json",
url: "/aaa",//后端请求
data: data,
success: function(result) {
console.log(result);
{
alert(‘3333‘ + result);
}
}
},
error: function(result) {
console.log(result);
{
alert(result);
}
}
}
});
})
< /script>
flask：
@app.route(‘/aaa‘,methods=[‘POST‘])
def aaa():
data = json.loads(request.form.get(‘data‘))
env = data[‘env‘]
telephone = data[‘telephone‘]
print (env,telephone)
msg14 = bbb(env, telephone)#调用 bbb方法拿返回值
return jsonify(msg14)
图例：
参考：博文https://www.cnblogs.com/wanghaonull/p/6340491.html
以上是关于flask中使用ajax 处理前端请求的数据的主要内容，如果未能解决你的问题，请参考以下文章