子沐课堂——Flask小帅锅勾搭Ajax萌妹纸
Flask小帅锅
为什么我们使用Flask呢?他有什么闪光点呢?现在听我慢慢道来
Flask是一个使用 Python 编写的轻量级 Web 应用框架。其 WSGI 工具箱采用 Werkzeug ,模板引擎则使用 Jinja2 。不要看他小,但是他其实也是应了一句话,叫做“麻雀虽小五脏俱全”。
Flask保留了扩增的弹性,可以用Flask-extension加入这些功能:ORM、窗体验证工具、文件上传、各种开放式身份验证技术。
说了这么多,我们发现Flask虽然会的不多,但是延展性很好。这位小帅锅也能独挡一面的。
Ajax萌妹纸
为什么说Ajax是一个萌妹纸呢?
AJAX即“Asynchronous Javascript And XML”(异步JavaScript和XML),是指一种创建交互式网页应用的网页开发技术。
AJAX = 异步 JavaScript和XML(标准通用标记语言的子集)。
AJAX 是一种用于创建快速动态网页的技术。
通过在后台与服务器进行少量数据交换,AJAX 可以使网页实现异步更新。这意味着可以在不重新加载整个网页的情况下,对网页的某部分进行更新。
传统的网页(不使用 AJAX)如果需要更新内容,必须重载整个网页页面。
Aajx很早就出现了,但是在js中Ajax处理很繁琐,今天我们来谈谈如何使用Jquery操作Ajax。
开始勾搭
首先我们要建立一个Flask入口文件,以便我们之后对于页面的访问,还有操作,新建一个python文件,保存为index.py
接下来,我们要设置默认访问的页面哦,怎么搞呢?
好了,我们设置好了。使用@app.route('/')设置了默认访问的路由,也使用render_template方法设置了访问index.html。
既然要访问index.html,那么我们就来写一写这个页面,首先我们新建两个文件夹,分别是templates和static。
templates为模板文件夹,即html文件存放地址。
static为静态文件夹,即存放js,css,img的文件夹
目录结构如图所示。
然后呢?我们在templates中新建一个html,取名为index.html
script中引入了两个文件,这个两个文件,分别存放在如下图所示的路径下。
其中jquery-1.12.0.min.js是一个jquery文件,这个任意版本其实都可以,因为Ajax对于版本要求不高。
index.js是我们自定义的一个文件,里面放上的就是我们请求Ajax的一些操作。
Id选择器的点击事件,获取输入框中的两个值,这里使用到表单选择器,然后我们使用ajax进行表单的提交,使用get形式提交数据到ajax_get处理方法里。
接收前端传递过来的get数据,使用requests.args。get方法去获取对应的属性值,如果不存在该属性,则设置默认值0,并且限定前台传递过来的是一个int类型的数值。
我们都知道,我们一般使用ajax提交的都是表单数据,不会使用get形式去提交,一般都使用post提交数据。那么flask中怎么接受post数据呢?
其中beforeSend表示在提交前,做的处理。
中间我们加上一个sleep机制,为何这么做,为了体现前台表单提交数据过程中等待的过程。
接受前台post数据使用request.form。
如此,对于Flask处理get和post的ajax请求,并返回json数据格式的处理。到这里就讲完了。是不是挺容易的。
这个也是为何我们使用Flask小帅锅的原因,轻而便捷。Django这种大胖子,虽然力量强,但是太笨重。
相关推荐
结束数据方法的参数,该如何定义?-- 集合为自定义实体类中的结合属性,有几个实体类,改变下标就行了。<input id="add" type="button" value="新增visitor&quo