flask前后端数据通信流程

最新推荐文章于 2024-10-27 21:20:17 发布

原创

最新推荐文章于 2024-10-27 21:20:17 发布 · 1k 阅读

4 ·

CC 4.0 BY-SA版权

文章标签：

#flask

本文详细介绍了Flask框架下后端与前端的数据通信流程，包括后端刷新和前端刷新两种方式。后端刷新主要涉及API接口设计、Flask应用构建、URL路由、视图函数及模板渲染；前端刷新则利用Ajax实现数据传输，结合模板动态更新页面内容。

flask前后端数据通信流程

对于服务器开发工程师来说，前端页面的刷新分后端刷新和前端刷新，
后端刷新的实现是通过模板+数据的方式实现的，前端刷新的实现是通过jQuery的Ajax + jQuery动态加载HTML、CSS的方式实现的

不管是后端刷新还是前端刷新，它们都是需要通过HTTP/HTTPS通信协议，这种协议实现数据通信，使用请求和响应完成一次完整web通信的过程

##1、后端刷新页面的流程
1.1实现服务器的API接口文档
1.2使用flask实现Web服务器应用程序的构建
1.3实现前端请求的URL，声明对应Route路由，一般情况下，一个URL对应一个路由
1.4实现对应路由的视图函数，每个视图函数都需要对应一个视图容器（模板），在这个视图函数中进行数据+模板的方式进行服务器的响应
1.5实现对应模板，模板是通过jinja2第三方插件的方式，使用在这里插入代码片模板语法来实现数据的动态显示

##2、前端刷新页面的流程
2.1 实现服务器的API接口文档
2.2 使用flask实现Web服务器应用程序的构建
2.3 实现前端请求的URL，将请求数据通过Ajax传输到对应Route路由下的服务端

<script>
        $.ajax({
            url:'http://127.0.0.1:5000/allusers',
            dataType:'json',
            success:function (data) {
                console.log(data)
                $('#show').html(data.message)
            },error:function (jqXHR) {
                console.log(jqXHR)
            }
        })
    </script>

最低0.47元/天解锁文章