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设置windows桌面壁纸的实现代码
Jan 28 Python
Python中列表、字典、元组、集合数据结构整理
Nov 20 Python
python之DataFrame实现excel合并单元格
Feb 22 Python
基于Django URL传参 FORM表单传数据 get post的用法实例
May 28 Python
Python这样操作能存储100多万行的xlsx文件
Apr 16 Python
Python爬虫图片懒加载技术 selenium和PhantomJS解析
Sep 18 Python
如何使用Python调整图像大小
Sep 26 Python
python 实现客户端与服务端的通信
Dec 23 Python
python中time.ctime()实例用法
Feb 03 Python
Python3自带工具2to3.py 转换 Python2.x 代码到Python3的操作
Mar 03 Python
用Python简陋模拟n阶魔方
Apr 17 Python
Python激活Anaconda环境变量的详细步骤
Jun 08 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
PHP调用MsSQL Server 2012存储过程获取多结果集(包含output参数)的详解
2013/07/03 PHP
检查用户名是否已在mysql中存在的php写法
2014/01/20 PHP
PHP对接微信公众平台消息接口开发流程教程
2014/03/25 PHP
php使用ffmpeg获取视频信息并截图的实现方法
2016/05/03 PHP
深入理解PHP原理之执行周期分析
2016/06/01 PHP
最新最全PHP生成制作验证码代码详解(推荐)
2016/06/12 PHP
PHP将字符串首字母大小写转换的实例
2017/01/21 PHP
自动完成JS类(纯JS, Ajax模式)
2009/03/12 Javascript
DIY jquery plugin - tabs标签切换实现代码
2010/12/11 Javascript
JS日期和时间选择控件升级版(自写)
2013/08/02 Javascript
深入理解JS中的变量及作用域、undefined与null
2014/03/04 Javascript
jQuery添加/改变/移除CSS类及判断是否已经存在CSS
2014/08/20 Javascript
JavaScript匿名函数用法分析
2015/02/13 Javascript
JS替换字符串中空格方法
2015/04/17 Javascript
JS实现从顶部下拉显示的带动画QQ客服特效代码
2015/10/24 Javascript
jquery获取复选框checkbox的值的简单实现方法
2016/05/26 Javascript
详解VUE的状态控制与延时加载刷新
2017/03/27 Javascript
浅谈Angular4实现热加载开发旅程
2017/09/08 Javascript
Vue中的slot使用插槽分发内容的方法
2018/03/01 Javascript
详解Vue CLI3配置之filenameHashing使用和源码设计使用和源码设计
2018/08/31 Javascript
Vue.js 中的 v-show 指令及用法详解
2018/11/19 Javascript
玩转Koa之koa-router原理解析
2018/12/29 Javascript
使用jquery的cookie实现登录页记住用户名和密码的方法
2019/03/13 jQuery
微信小程序实现定位及到指定位置导航的示例代码
2019/08/20 Javascript
如何实现js拖拽效果及原理解析
2020/05/08 Javascript
[04:17]DOTA2完美盛典,rOtk、BurNIng携手巴图演唱《倔强》
2017/11/28 DOTA
python logging日志模块以及多进程日志详解
2018/04/18 Python
使用Python实现租车计费系统的两种方法
2018/09/29 Python
Python 矩阵转置的几种方法小结
2019/12/02 Python
Python语法垃圾回收机制原理解析
2020/03/25 Python
Html5移动端网页端适配(js+rem)
2021/02/03 HTML / CSS
Origins加拿大官网:雅诗兰黛集团高端植物护肤品牌
2017/11/19 全球购物
Andrew Marc官网:设计师外套的领先制造商
2019/10/30 全球购物
简单租房协议书(范本)
2014/10/13 职场文书
欠款纠纷起诉状
2015/05/19 职场文书
给原生html中添加水印遮罩层的实现示例
2021/04/02 Javascript