python使用flask与js进行前后台交互的例子


Posted in Python onJuly 19, 2019

flask与js进行前后台交互代码如下,后台给前端发数据:

python部分:

# -*- coding: utf-8 -*-
from flask import Flask,jsonify,render_template
import json
 
app = Flask(__name__)#实例化app对象
 
testInfo = {}
 
@app.route('/test_post/nn',methods=['GET','POST'])#路由
def test_post():
  testInfo['name'] = 'xiaoming'
  testInfo['age'] = '28'
  return json.dumps(testInfo)
 
@app.route('/')
def hello_world():
  return 'Hello World!'
 
@app.route('/index')
def index():
  return render_template('index.html')
 
 
if __name__ == '__main__':
  app.run(host='0.0.0.0',#任何ip都可以访问
      port=7777,#端口
      debug=True
      )

js部分:

<!DOCTYPE html>
<html lang="en">
 
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>echarts</title>
  <style type="text/css">
    html,
    body {
      width: 100%;
      height: 100%;
    }
 
    body {
      margin: 0px;
      padding: 0px
    }
 
    div {
      float: left;
    }
 
    #container {
      width: 50%;
      height: 100%;
    }
 
    #info {
      padding: 10px 20px;
    }
  </style>
</head>
 
<body>
  <div id="container"></div>
  <div id="info">数据展示:</div>
  <script src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.js"></script>
	<script>
    $.ajax({
    url: "test_post/nn",
    type: "POST",
    dataType: "json",
    success: function (data) {
      console.log(data)
    }
    })
 
	</script>
  
</body>
 
</html>

以上这篇python使用flask与js进行前后台交互的例子就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Python 相关文章推荐
简单使用Python自动生成文章
Dec 25 Python
怎么使用pipenv管理你的python项目
Mar 12 Python
Python wxPython库消息对话框MessageDialog用法示例
Sep 03 Python
python将.ppm格式图片转换成.jpg格式文件的方法
Oct 27 Python
python3+selenium实现qq邮箱登陆并发送邮件功能
Jan 23 Python
selenium+python截图不成功的解决方法
Jan 30 Python
对python特殊函数 __call__()的使用详解
Jul 02 Python
keras Lambda自定义层实现数据的切片方式,Lambda传参数
Jun 11 Python
没编程基础可以学python吗
Jun 17 Python
Python使用xpath实现图片爬取
Sep 16 Python
Python类型转换的魔术方法详解
Dec 23 Python
Python列表元素删除和remove()方法详解
Jan 04 Python
Django 模型类(models.py)的定义详解
Jul 19 #Python
Tensorflow实现神经网络拟合线性回归
Jul 19 #Python
使用TensorFlow实现简单线性回归模型
Jul 19 #Python
详解将Python程序(.py)转换为Windows可执行文件(.exe)
Jul 19 #Python
简单了解django缓存方式及配置
Jul 19 #Python
python实现最小二乘法线性拟合
Jul 19 #Python
这可能是最好玩的python GUI入门实例(推荐)
Jul 19 #Python
You might like
4.与数据库的连接
2006/10/09 PHP
php仿ZOL分页类代码
2008/10/02 PHP
Pain 全世界最小最简单的PHP模板引擎 (普通版)
2011/10/23 PHP
php中的常用魔术方法总结
2013/08/02 PHP
php批量更改数据库表前缀实现方法
2013/10/26 PHP
PHP开发微信支付的代码分享
2014/05/25 PHP
php简单实现无限分类树形列表的方法
2015/03/27 PHP
php+ajax 实现输入读取数据库显示匹配信息
2015/10/08 PHP
PHP中用mysqli面向对象打开连接关闭mysql数据库的方法
2016/11/05 PHP
jQuery Ajax文件上传(php)
2009/06/16 Javascript
JQuery UI DatePicker中z-index默认为1的解决办法
2010/09/28 Javascript
深入理解Javascript作用域与变量提升
2013/12/09 Javascript
node.js中的http.createServer方法使用说明
2014/12/14 Javascript
node.js require() 源码解读
2015/12/13 Javascript
js enter键激发事件实例代码
2016/08/17 Javascript
微信小程序 input表单与redio及下拉列表的使用实例
2017/09/20 Javascript
对vue里函数的调用顺序介绍
2018/03/17 Javascript
vue项目中使用Svg的方法
2018/10/24 Javascript
vue+canvas实现移动端手写签名
2020/05/21 Javascript
vue 使用post/get 下载导出文件操作
2020/08/07 Javascript
解决vue项目中出现Invalid Host header的问题
2020/11/17 Javascript
[01:05:07]DOTA2-DPC中国联赛 正赛 DLG vs Dragon BO3 第一场2月1日
2021/03/11 DOTA
详解Python的Django框架中的通用视图
2015/05/04 Python
web.py在SAE中的Session问题解决方法(使用mysql存储)
2015/06/24 Python
python下解压缩zip文件并删除文件的实例
2018/04/24 Python
解决tensorflow模型参数保存和加载的问题
2018/07/26 Python
Python+OpenCV图片局部区域像素值处理详解
2019/01/23 Python
Python简单基础小程序的实例代码
2019/04/28 Python
python3.6编写的单元测试示例
2019/08/17 Python
行政管理人员精品工作推荐信
2013/11/04 职场文书
党的群众路线教育实践活动个人整改措施材料
2014/11/04 职场文书
大学宣传委员竞选稿
2015/11/19 职场文书
2016年社区国庆节活动总结
2016/04/01 职场文书
经典人生语录分享:不畏将来,不念过去,笑对当下
2019/12/12 职场文书
python实现批量提取指定文件夹下同类型文件
2021/04/05 Python
Python数据可视化之用Matplotlib绘制常用图形
2021/06/03 Python