Python Flask前后端Ajax交互的方法示例


Posted in Python onJuly 31, 2018

之前总结过flask里的基础知识,现在来总结下flask里的前后端数据交互的知识,这里用的是Ajax

一、 post方法

1、post方法的位置:在前端HTML里,绑定在一个按钮的点击函数里,或者一个鼠标输入框点击离开事件。

(1)数据附在URL里(请求路径),发送到后端。

/*前端HTML<script>里:*/
$.post("/js_post/"+ip, data_to_backend, function(data){alert("success "+data)} );

其中ip,data_to_backend是在此代码前定义好的;data_to_backend一般是一个json数据(data_to_backend={'ip':$(this).parent().prev().text()}),而data是来自后端的返回数据。

#后端py文件(路由启动前面的html的py文件)里:添加一个路由处理前端post请求
@app.route("/js_post/<ip>", methods=['GET', 'POST'])
def js_post(ip):
   print ip
   return ip +" - ip"

点击按钮后的效果:

Python Flask前后端Ajax交互的方法示例

前端定义弹窗数据

Python Flask前后端Ajax交互的方法示例

ip在URL里

(2)数据单独发送给后端

var ip = $(this).parent().prev().prev().prev().prev().text();
data_tmp = {'ip':ip, 'text':"success for ajax"};  // data to send to server.
$.post('/js_call', data_tmp, function(data){alert(data)});

后端处理程序:

@app.route('/js_call', methods=['GET', 'POST'])
def js_call():  
   print request.values['ip']  
   print request.values['text']  
   # to send the command by ssh : os.system("ssh user@host \' restart(command) \' ")  
   return 'ok!!!!'

Python Flask前后端Ajax交互的方法示例

post独立数据发送

二、get方法(同样可以发数据)

$.get('/js_get', {'method':'GET', 'text':"from-html"}, function(data){alert(data)})

后端路由接收处理:

@app.route('/js_get', methods=['GET'])
def js_get():
  print "method: "+request.values['method']+" --- text: "+request.values['text']
  return "get success!"

Python Flask前后端Ajax交互的方法示例

get成功

Python Flask前后端Ajax交互的方法示例

数据接收成功

注意的是:其中后端py文件的类似request.values['method']的获取数据的request是一个Python flask的模块,需要导入。

总结:

  • 在flask框架里,Ajax请求对于后端可以很容易实现,只需在后端Python代码中对ajax路径作出处理即可。
  • Ajax的post, get方法均可以向后台发送数据,只是一般用post发数据(做出改变),get请求数据(不改变)。

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Python 相关文章推荐
在Python中处理字符串之isdigit()方法的使用
May 18 Python
python reduce 函数使用详解
Dec 05 Python
APIStar:一个专为Python3设计的API框架
Sep 26 Python
Python实现登陆文件验证方法
Oct 06 Python
python使用KNN算法识别手写数字
Apr 25 Python
PyQt5的安装配置过程,将ui文件转为py文件后显示窗口的实例
Jun 19 Python
python中将两组数据放在一起按照某一固定顺序shuffle的实例
Jul 15 Python
Django 创建新App及其常用命令的实现方法
Aug 04 Python
Python(PyS60)实现简单语音整点报时
Nov 18 Python
python之array赋值技巧分享
Nov 28 Python
python 实现矩阵填充0的例子
Nov 29 Python
pyqt5实现井字棋的示例代码
Dec 07 Python
Python常见内置高效率函数用法示例
Jul 31 #Python
Python使用jsonpath-rw模块处理Json对象操作示例
Jul 31 #Python
flask-socketio实现WebSocket的方法
Jul 31 #Python
深入flask之异步非堵塞实现代码示例
Jul 31 #Python
Django框架使用富文本编辑器Uedit的方法分析
Jul 31 #Python
Windows下python3.6.4安装教程
Jul 31 #Python
windows下pycharm安装、创建文件、配置默认模板
Jul 31 #Python
You might like
一个查看session内容的函数
2006/10/09 PHP
PHP5中实现多态的两种方法实例分享
2014/04/21 PHP
php使用指定字符列表生成随机字符串的方法
2015/04/18 PHP
javascript中的有名函数和无名函数
2007/10/17 Javascript
JS 的应用开发初探(mootools)
2009/12/19 Javascript
多个表单中如何获得这个文件上传的网址实现js代码
2013/03/25 Javascript
js获取视频时长代码
2014/04/10 Javascript
微信企业号开发之微信考勤百度地图定位
2015/09/11 Javascript
Bootstrap开关(switch)控件学习笔记分享
2016/05/30 Javascript
自己动手制作基于jQuery的Web页面加载进度条插件
2016/06/03 Javascript
jQuery鼠标事件总结
2016/10/13 Javascript
解析js如何获取css样式
2016/12/11 Javascript
JavaScript中从setTimeout与setInterval到AJAX异步
2017/02/13 Javascript
Vue中的ref作用详解(实现DOM的联动操作)
2017/08/21 Javascript
理顺8个版本vue的区别(小结)
2018/09/17 Javascript
详解Vue中使用Axios拦截器
2019/04/22 Javascript
ElementUI之Message功能拓展详解
2019/10/18 Javascript
[03:07]【DOTA2亚洲邀请赛】我们,梦开始的地方
2017/03/07 DOTA
[57:59]完美世界DOTA2联赛循环赛 Ink Ice vs LBZS BO2第一场 11.05
2020/11/05 DOTA
[38:38]完美世界DOTA2联赛PWL S3 access vs Rebirth 第二场 12.17
2020/12/18 DOTA
[01:04:02]DOTA2-DPC中国联赛 正赛 Elephant vs IG BO3 第二场 1月24日
2021/03/11 DOTA
举例讲解Python面相对象编程中对象的属性与类的方法
2016/01/19 Python
Python、 Pycharm、Django安装详细教程(图文)
2019/04/12 Python
python使用参数对嵌套字典进行取值的方法
2019/04/26 Python
python requests抓取one推送文字和图片代码实例
2019/11/04 Python
python Matplotlib数据可视化(2):详解三大容器对象与常用设置
2020/09/30 Python
美国照明、家居装饰和家具购物网站:Bellacor
2017/09/20 全球购物
网络方面基础面试题
2012/11/16 面试题
教师求职信范文分享
2013/12/27 职场文书
大学生村官事迹材料
2014/01/21 职场文书
大学生活动总结模板
2014/07/02 职场文书
毕业实习计划书
2015/01/16 职场文书
2015年技术工作总结范文
2015/04/20 职场文书
Python访问Redis的详细操作
2021/06/26 Python
Redis中有序集合的内部实现方式的详细介绍
2022/03/16 Redis
OpenCV实现常见的四种图像几何变换
2022/04/01 Python