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 返回汉字的汉语拼音
Feb 27 Python
Python计算一个文件里字数的方法
Jun 15 Python
Python爬取三国演义的实现方法
Sep 12 Python
python 通过xml获取测试节点和属性的实例
Mar 31 Python
Python按钮的响应事件详解
Mar 04 Python
Python实现微信翻译机器人的方法
Aug 13 Python
opencv python如何实现图像二值化
Feb 03 Python
TensorFlow基本的常量、变量和运算操作详解
Feb 03 Python
python游戏开发的五个案例分享
Mar 09 Python
python基于pygame实现飞机大作战小游戏
Nov 19 Python
利用python查看数组中的所有元素是否相同
Jan 08 Python
Python列表删除重复元素与图像相似度判断及删除实例代码
May 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
解析PHP多种序列化与反序列化的方法
2013/06/06 PHP
定义php常量的详解
2013/06/09 PHP
php验证码实现代码(3种)
2015/09/07 PHP
php文件上传你必须知道的几点
2015/10/20 PHP
php使用glob函数遍历文件和目录详解
2016/09/23 PHP
PHP生成图片缩略图类示例
2017/01/12 PHP
PHP中的self关键字详解
2019/06/23 PHP
javascript网页关闭时提醒效果脚本
2008/10/22 Javascript
Javascript select下拉框操作常用方法
2009/11/09 Javascript
jquery 锁定弹出层实现代码
2010/02/23 Javascript
js左右弹性滚动对联广告代码分享
2014/02/19 Javascript
js统计录入文本框中字符的个数并加以限制不超过多少
2014/05/23 Javascript
JS实现清除指定cookies的方法
2014/09/20 Javascript
jsMind通过鼠标拖拽的方式调整节点位置
2015/04/13 Javascript
基于jquery实现导航菜单高亮显示(两种方法)
2015/08/23 Javascript
vue实现添加标签demo示例代码
2017/01/21 Javascript
AngularJS改变元素显示状态
2017/04/20 Javascript
vue仿淘宝滑动验证码功能(样式模仿)
2019/12/10 Javascript
用js限制网页只在微信浏览器中打开(或者只能手机端访问)
2020/12/24 Javascript
vue添加锚点,实现滚动页面时锚点添加相应的class操作
2020/08/10 Javascript
[03:27]《辉夜杯》线下训练营 导师CU和海涛指点迷津
2015/10/23 DOTA
使用python存储网页上的图片实例
2018/05/22 Python
Python实现曲线拟合操作示例【基于numpy,scipy,matplotlib库】
2018/07/12 Python
Python引用计数操作示例
2018/08/23 Python
Python使用MyQR制作专属动态彩色二维码功能
2019/06/04 Python
python解析xml简单示例
2019/06/21 Python
python 单线程和异步协程工作方式解析
2019/09/28 Python
python实现图片插入文字
2019/11/26 Python
使用css3和jquery实现可伸缩搜索框
2014/02/12 HTML / CSS
美国隐形眼镜零售商:LensPure
2019/03/10 全球购物
Easy Spirit官网:美国休闲鞋履中的代表品牌
2019/04/12 全球购物
介绍一些UNIX常用简单命令
2014/11/11 面试题
2015年暑期社会实践方案
2015/07/14 职场文书
股东合作协议书模板2篇
2019/11/05 职场文书
MySQL提取JSON字段数据实现查询
2022/04/22 MySQL
详解ZABBIX监控ESXI主机的问题
2022/06/21 Servers