python flask框架实现传数据到js的方法分析


Posted in Python onJune 11, 2019

本文实例讲述了python flask框架实现传数据到js的方法。分享给大家供大家参考,具体如下:

首先要清楚后台和前端交互所采用的数据格式。

一般选JSON,因为和js完美贴合。

后台返回的数据进行序列化

/homepageRecommend 路由的 view方法中返回序列化数据

dict = {"a":1, "b":2}<br data-filtered="filtered">
import json
json.dumps(dict)

2)

from flask import jsonify
jsonify(dict) #在调用jsonfiy 有时会报错,原因是jsonify 对象必须是dict

这两种序列化方式主要的区别是 jsonify 格式更美观一些

在前端利用jquary 对json进行反序列化

$.getJSON('/homepageRecommend'
    , function(data) {          // 从Flask返回的数据
      alert(data.a)           // 浏览器弹窗显示 后端返回的dict["a"]的值,此次是1
  }
)
//getJSON 函数有三个参数
//第一个是后端返回的数据的url
//第二个是要返回给服务器的data 是可选的
//第三个是对获取的反序列化数据 要继续进行的操作的函数

前端通过.get()或者.get()或者.post()方法发送请求,后端利用json.dumps(dict)返回json数据,在js中利用eval()方法,把json数据转换为js对象,后再做其他处理

$.post("{{ url_for('statistics.HomeRecommend') }}",{"id":a},function(reco_list){
 var reco_list = eval(reco_list)
//do others
})

最近在使用icharts画图的 过程中发现了另外一种传数据的方式,view中使用

return render_template('statistics/numberofuserlogin/login_number.html', result_json = json.dumps(result))

js中直接用 js_object = eval('{{result_json|safe }}') 注意 一定要加|safe 过滤否则会对字符串进行转义导致解析错误 使用这种方式传数据,能够在渲染模板的同时传数据,避免定义新的url拿数据

总结: flask 后台给前端js传数据, 需要注意序列化 和反序列化

更多资料参考 https://3water.com/article/162815.htm

希望本文所述对大家基于Flask框架的Python程序设计有所帮助。

Python 相关文章推荐
Python下线程之间的共享和释放示例
May 04 Python
利用selenium 3.7和python3添加cookie模拟登陆的实现
Nov 20 Python
Python基于hashlib模块的文件MD5一致性加密验证示例
Feb 10 Python
Python实现求一个集合所有子集的示例
May 04 Python
Tensorflow 训练自己的数据集将数据直接导入到内存
Jun 19 Python
Python tkinter的grid布局及Text动态显示方法
Oct 11 Python
python集合的创建、添加及删除操作示例
Oct 08 Python
计算Python Numpy向量之间的欧氏距离实例
May 22 Python
Django集成MongoDB实现过程解析
Dec 01 Python
Python利用imshow制作自定义渐变填充柱状图(colorbar)
Dec 10 Python
python 下划线的多种应用场景总结
May 12 Python
python百行代码实现汉服圈图片爬取
Nov 23 Python
python 求一个列表中所有元素的乘积实例
Jun 11 #Python
python ChainMap的使用和说明详解
Jun 11 #Python
python 计算一个字符串中所有数字的和实例
Jun 11 #Python
python 实现返回一个列表中出现次数最多的元素方法
Jun 11 #Python
python ChainMap 合并字典的实现步骤
Jun 11 #Python
itchat-python搭建微信机器人(附示例)
Jun 11 #Python
python itchat实现调用微信接口的第三方模块方法
Jun 11 #Python
You might like
PHP二维数组去重实例分析
2016/11/18 PHP
php图像处理函数imagecopyresampled用法详解
2016/12/02 PHP
PHP数据库操作二:memcache用法分析
2017/08/16 PHP
javascript背投广告代码的完善
2008/04/08 Javascript
js中查找最近的共有祖先元素的实现代码
2010/12/30 Javascript
自己写的兼容ie和ff的在线文本编辑器类似ewebeditor
2012/12/12 Javascript
JQuery解析HTML、JSON和XML实例详解
2014/03/29 Javascript
自定义jquery模态窗口插件无法在顶层窗口显示问题
2014/05/29 Javascript
jQuery焦点图轮播特效代码分享(3款)
2015/09/05 Javascript
Javascript函数式编程语言
2015/10/11 Javascript
基于JavaScript实现瀑布流效果(循环渐近)
2016/01/27 Javascript
jquery ezUI 双击行记录弹窗查看明细的实现方法
2016/06/01 Javascript
原生JS实现风箱式demo,并封装了一个运动框架(实例代码)
2016/07/22 Javascript
基于KO+BootStrap+MVC实现的分页控件代码分享
2016/11/07 Javascript
详解如何实现Element树形控件Tree在懒加载模式下的动态更新
2019/04/25 Javascript
vue中父子组件传值,解决钩子函数mounted只运行一次的操作
2020/07/27 Javascript
vscode 使用Prettier插件格式化配置使用代码详解
2020/08/10 Javascript
[04:04]DOTA2亚洲邀请赛比赛场馆&酒店全攻略
2017/03/23 DOTA
在Python中调用ggplot的三种方法
2015/04/08 Python
Python将阿拉伯数字转换为罗马数字的方法
2015/07/10 Python
Python爬取qq music中的音乐url及批量下载
2017/03/23 Python
Python 中开发pattern的string模板(template) 实例详解
2017/04/01 Python
pandas将DataFrame的列变成行索引的方法
2018/04/10 Python
django模板结构优化的方法
2019/02/28 Python
django 通过URL访问上传的文件方法
2019/07/28 Python
Python socket连接中的粘包、精确传输问题实例分析
2020/03/24 Python
HTML5 中新的全局属性(整理)
2013/07/31 HTML / CSS
北美大型运动类产品商城:Champs Sports
2017/01/12 全球购物
惠普香港官方商店:HP香港
2019/04/30 全球购物
戴尔新西兰官网:Dell New Zealand
2020/01/07 全球购物
给同学的道歉信
2014/01/16 职场文书
2014年乡镇安全生产工作总结
2014/12/02 职场文书
施工安全员岗位职责
2015/04/11 职场文书
2015年消防工作总结
2015/04/24 职场文书
红色故事汇观后感
2015/06/18 职场文书
2019年大学推荐信
2019/06/24 职场文书