Flask中前端页面的数据刷新

Flask中前端页面的数据刷新

  • Flask中前端页面的数据刷新
    • 1. 后端刷新页面的流程
      • 1.1实现服务器的API接口文档
      • 1.2使用Flask实现Web服务器应用程序的构建
      • 1.3 实现前端请求URL,声明对应Route路由,一般情况下,一个URL对应一个路由
      • 1.4实现对应路由的视图函数,每一视图函数都需要对应一个试图容器(模板) ,在这个视图函数中进行数据+模板的方式进行服务器的响应
      • 1.5实现对应模板,模板是通过jinjia2第三方插件的方式,使用模板语法来实现数据的动态显示
    • 2.前端刷新页面的流程
      • 2.1实现服务器的API接口文档
      • 2.2使用Flask实现Web服务器应用程序的构建
      • 2.3利用jQuery中的Ajax实现前端请求的url(ajax下的url),一般情况下,一个URL对应一个路由
      • 2.4声明对应路由,实现对应路由的视图函数,以json的格式将得到的数据响应给浏览器
      • 2.5利用Ajax接收响应,并放入Ajax的seccess的位置
      • 2.6使用jQuery找到放置数据的标签容器,在容器里动态生成标签,放置数据,来实现数据的动态显示

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实现对应模板,模板是通过jinjia2第三方插件的方式,使用模板语法来实现数据的动态显示

2.前端刷新页面的流程

2.1实现服务器的API接口文档

2.2使用Flask实现Web服务器应用程序的构建

2.3利用jQuery中的Ajax实现前端请求的url(ajax下的url),一般情况下,一个URL对应一个路由

Flask中前端页面的数据刷新_第1张图片
Flask中前端页面的数据刷新_第2张图片

2.4声明对应路由,实现对应路由的视图函数,以json的格式将得到的数据响应给浏览器

Flask中前端页面的数据刷新_第3张图片

2.5利用Ajax接收响应,并放入Ajax的seccess的位置

Flask中前端页面的数据刷新_第4张图片

2.6使用jQuery找到放置数据的标签容器,在容器里动态生成标签,放置数据,来实现数据的动态显示

你可能感兴趣的:(Flask)