创意电子

标题: python的web服务器：flask+boostrap 实现网站框架，源码分享 [打印本页]

作者: 小辉算个球 时间: 2018-2-5 00:07
标题: python的web服务器：flask+boostrap 实现网站框架，源码分享
先介绍一下flask中必须的两个功能。
模板渲染

用python生成html十分无趣，而且相当繁琐，因为你必须手动对html做转义来包管应用的安全。为此，flask配备了Jinja2模板引擎。
你可以使用render_template()方法来渲染模板。你需要做的一切就是将模板名和你想作为关键字的参数传入模板的变量。举例如下：
首先在你的代码中添加from flask import render_template
然后再添加如下函数

flask会在templates文件夹中探求模板，所以如果你的应用是个模块，那templates文件夹应该与模块同级；如果它是一个包，那这个templates文件夹作为包的子目录。
我们再看一下hello.html文件的内容

然后运行你的app，并用浏览器访问/hello或者/hello/username的网址，应该都能得到相应的页面。这里就不多说了。
在模板里，你也可以访问request，session和g对象，以及get_flashed_messages()函数。
静态文件

动态web应用也会需要静态文件，通常是CSS和js文件。抱负状况下，你已经设置好web服务器来提供静态文件，但是在开发中，flask也可以做到。只要在你的包中或者模块所在的目录中创建一个名为static的文件夹，在应用中使用/static即可访问。
给静态文件生成URL，使用特别的‘static’端点名：
url_for('static',filename='style.css')
这个文件应该存储在文件系统上的static/style.css
bootstrap应用

好了，学到这里，我们就可以使用bootstrap前端来实现一个网站的根本框架了。
1.首先去bootstrap网站下载一个前端的例子
网站列出了许多例子，小编选择了最后一个，Carousel jumbotron。打开这个例子的链接 http://getbootstrap.com/2.3.2/examples/carousel.html ，小编要做的就是在本身的网站上实现同样的网页。用如下命令可以下载网页的全部内容。
sudo wget -r http://getbootstrap.com/2.3.2/examples/carousel.html
下载完成后进入路径getbootstrap.com/2.3.2，你应该能看到两个文件夹assets和examples. assets里面满是静态文件，examples里面只有一个carousel.html文件，我把这个文件改成index.html文件了。
2.首先创建一个简朴的应用
实在小编也没有创建新的应用，就是使用了hello.py，在hello.py里面添加了如下代码：

3.把bootstrap文件放入flask工程
这里只有两个步骤，把index.html文件放入templates文件夹中，把assets里面的内容放入static文件夹。templates和static文件夹如果不存在，请自行创建。
4.修改index.html文件
由于静态文件的路径改变了，因此需要在index.html中修改引用静态文件的路径。修改方法都是一致的，例如"../assets/css/bootstrap.css" 修改为"static/css/bootstrap.css".
最终显示结果如下：

源代码分享

私信我，内容为"bootstrap",系统会自动回复链接哦。

作者: 小辉算个球 时间: 2018-2-5 00:30
bootstrap的页面不错，出自twitter之手，效果果然前卫。

作者: 广东陈百祥 时间: 2018-2-5 00:35
没看到自动回复

作者: 大大小小的家 时间: 2018-2-5 01:13
收到，谢谢

作者: 新乡北斗 时间: 2018-2-5 06:52
不是flask-bootstrap吗？

作者: 释永信的师父 时间: 2018-12-7 22:57
转发了

作者: 魅帝180373496 时间: 2018-12-15 17:10
这个简单但是前后台数据交换我代码没问题但总是报404 烦的人快疯了下一期可以出个这个嘛？

欢迎光临创意电子 (https://wxcydz.cc/)