Python Flask 简明教程(12)--Flask获取Ajax传输的JSON数据

简介: 本文目录1. 前言2. 创建项目结构3. 发起Ajax请求4. 编写app.py5. 接收JSON数据6. 测试7. 小结

本文目录

1. 前言

2. 创建项目结构

3. 发起Ajax请求

4. 编写app.py

5. 接收JSON数据

6. 测试

7. 小结

1. 前言

上一篇讲了Flask接收URL参数及表单参数,其实这两种方式用的比较少了,现在还是流行通过Ajax传输JSON数据。


本篇就通过一个完整的FlaskWeb项目,演示下如何实现Flask获取Ajax传输的JSON数据。


2. 创建项目结构

使用VSCode创建项目文件夹flask-ajax-demo,结构如下:


其中app.py是Python程序,user.html是静态页面。


3. 发起Ajax请求

编写user.html,代码如下:


<!DOCTYPE html>

<html>

<body>

   <input type="button" value="发送数据" onclick="btnSendData()">

   <script type="text/javascript" src="https://cdn.bootcdn.net/ajax/libs/jquery/1.9.1/jquery.min.js"></script>

   <script>

       function btnSendData() {

           var input = {

               'name': 'tom',

               'password': '123456'

           };

           $.ajax({

               url: '/addUser',

               type: 'post',

               contentType: 'application/json',

               data: JSON.stringify(input),

               success: function (res) {

                   console.log(res);

               }

           });

       }

   </script>

</body>

</html>


首先,我们引用了jquery,以便使用$.ajax发起Ajax请求。


然后,点击【发送数据】按钮时,发送Ajax请求,注意访问路径为/addUser,请求方式post,内容类型application/json。


重点来了,此处要将input对象转换为JSON字符串发送,所以使用JSON.stringify(input)将发送对象转换为JSON字符串。


4. 编写app.py

编写app.py启动程序,然后编写一个路由方法user,以便跳转到user.html:


from flask import Flask, render_template, request

app = Flask(__name__)


@app.route('/user')

def user():

   return render_template('user.html')


if __name__ == '__main__':

   app.run(debug=True)


5. 接收JSON数据

编写addUser方法,接收网页发过来的JSON数据


@app.route('/addUser', methods=['POST'])

def login():

   json = request.json

   print('recv:', json)

   return json


此处注意我们的返回值,也是json类型。


6. 测试

启动程序,访问http://127.0.0.1:5000/user,此时会显示user.html页面,效果如下:


点击按钮,Python控制台打印如下,已成功接收json数据。


recv: {'name': 'tom', 'password': '123456'}

1

查看控制台,输出如下,网页也已经成功接收到后台返回的数据。



7. 小结

本篇演示了如何使用Flask获取Ajax传输过来的JSON数据,还是相当简单的,直接通过request.json即可实现。


目录
打赏
0
0
0
0
464
分享
相关文章
Python 语言结合 Flask 框架来实现一个基础的代购商品管理、用户下单等功能的简易系统
这是一个使用 Python 和 Flask 框架实现的简易代购系统示例,涵盖商品管理、用户注册登录、订单创建及查看等功能。通过 SQLAlchemy 进行数据库操作,支持添加商品、展示详情、库存管理等。用户可注册登录并下单,系统会检查库存并记录订单。此代码仅为参考,实际应用需进一步完善,如增强安全性、集成支付接口、优化界面等。
使用Python和Flask构建简易Web API
使用Python和Flask构建简易Web API
194 3
使用Python和Flask构建简单的RESTful API
使用Python和Flask构建简单的RESTful API
PHP与Ajax在Web开发中的交互技术。PHP作为服务器端脚本语言,处理数据和业务逻辑
本文深入探讨了PHP与Ajax在Web开发中的交互技术。PHP作为服务器端脚本语言,处理数据和业务逻辑;Ajax则通过异步请求实现页面无刷新更新。文中详细介绍了两者的工作原理、数据传输格式选择、具体实现方法及实际应用案例,如实时数据更新、表单验证与提交、动态加载内容等。同时,针对跨域问题、数据安全与性能优化提出了建议。总结指出,PHP与Ajax的结合能显著提升Web应用的效率和用户体验。
88 3
抓取和分析JSON数据:使用Python构建数据处理管道
在大数据时代,电商网站如亚马逊、京东等成为数据采集的重要来源。本文介绍如何使用Python结合代理IP、多线程等技术,高效、隐秘地抓取并处理电商网站的JSON数据。通过爬虫代理服务,模拟真实用户行为,提升抓取效率和稳定性。示例代码展示了如何抓取亚马逊商品信息并进行解析。
104 1
抓取和分析JSON数据:使用Python构建数据处理管道
利用Python和Flask构建轻量级Web应用的实战指南
利用Python和Flask构建轻量级Web应用的实战指南
193 2
Python中序列化/反序列化JSON格式的数据
【11月更文挑战第4天】本文介绍了 Python 中使用 `json` 模块进行序列化和反序列化的操作。序列化是指将 Python 对象(如字典、列表)转换为 JSON 字符串,主要使用 `json.dumps` 方法。示例包括基本的字典和列表序列化,以及自定义类的序列化。反序列化则是将 JSON 字符串转换回 Python 对象,使用 `json.loads` 方法。文中还提供了具体的代码示例,展示了如何处理不同类型的 Python 对象。
如何使用Python和Flask构建一个简单的RESTful API。Flask是一个轻量级的Web框架
本文介绍了如何使用Python和Flask构建一个简单的RESTful API。Flask是一个轻量级的Web框架,适合小型项目和微服务。文章从环境准备、创建基本Flask应用、定义资源和路由、请求和响应处理、错误处理等方面进行了详细说明,并提供了示例代码。通过这些步骤,读者可以快速上手构建自己的RESTful API。
265 2
Python Web框架比较:Django vs Flask vs Pyramid
Python Web框架比较:Django vs Flask vs Pyramid
75 1

热门文章

最新文章