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元组操作实例解析
Sep 23 Python
Python Web框架Flask信号机制(signals)介绍
Jan 01 Python
Python线程的两种编程方式
Apr 14 Python
Python验证文件是否可读写代码分享
Dec 11 Python
PyQt5主窗口动态加载Widget实例代码
Feb 07 Python
python 获取一个值在某个区间的指定倍数的值方法
Nov 12 Python
python爬取酷狗音乐排行榜
Feb 20 Python
Python判断字符串是否xx开始或结尾的示例
Aug 08 Python
Python容器使用的5个技巧和2个误区总结
Sep 26 Python
Python搭建代理IP池实现存储IP的方法
Oct 27 Python
pycharm通过anaconda安装pyqt5的教程
Mar 24 Python
Python绘制地图神器folium的新人入门指南
May 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
《忧国的莫里亚蒂》先导宣传图与STAFF公开
2020/03/04 日漫
php中session定期自动清理的方法
2015/11/12 PHP
Javascript 文件夹选择框的两种解决方案
2009/07/01 Javascript
asp.net中System.Timers.Timer的使用方法
2013/03/20 Javascript
在JavaScript中处理字符串之fontcolor()方法的使用
2015/06/08 Javascript
基于jQuery实现Ajax验证用户名是否存在实例
2016/03/30 Javascript
JavaScript检测原始值、引用值、属性
2016/06/20 Javascript
jQuery 3.0 的 setter和getter 模式详解
2016/07/11 Javascript
微信小程序-横向滑动scroll-view隐藏滚动条
2017/04/20 Javascript
微信小程序中form 表单提交和取值实例详解
2017/04/20 Javascript
JavaScript对象_动力节点Java学院整理
2017/06/23 Javascript
webpack4的迁移的使用方法
2018/05/25 Javascript
node.js调用C++函数的方法示例
2018/09/21 Javascript
小程序中this.setData的使用和注意事项
2019/08/28 Javascript
微信小程序如何通过用户授权获取手机号(getPhoneNumber)
2020/01/21 Javascript
VUE+Element实现增删改查的示例源码
2020/11/23 Vue.js
vuex的使用步骤
2021/01/06 Vue.js
python requests post多层字典的方法
2018/12/27 Python
Python socket实现多对多全双工通信的方法
2019/02/13 Python
Python3.4学习笔记之 idle 清屏扩展插件用法分析
2019/03/01 Python
python PyQt5/Pyside2 按钮右击菜单实例代码
2019/08/17 Python
python实现抠图给证件照换背景源码
2019/08/20 Python
python解析xml文件方式(解析、更新、写入)
2020/03/05 Python
Python求解排列中的逆序数个数实例
2020/05/03 Python
python创建文本文件的简单方法
2020/08/30 Python
LocalStorage记住用户和密码功能
2017/07/24 HTML / CSS
美国最大的家庭鞋类零售商之一:Shoe Carnival
2017/10/06 全球购物
会计实习期自我鉴定
2013/10/06 职场文书
税务专业毕业生自荐信
2013/11/10 职场文书
学生就业推荐信
2013/11/13 职场文书
后勤工作职责
2013/12/22 职场文书
农村婚礼证婚词
2014/01/10 职场文书
万能检讨书开头与结尾怎么写
2015/02/17 职场文书
2015年文明创建工作总结
2015/04/30 职场文书
运动会运动员赞词
2015/07/22 职场文书
2016年八一建军节活动总结
2016/04/05 职场文书