您的位置：首页 > 编程语言 > Python开发

在windows创建第一个Flask框架的Python Web

2017-12-22 11:43 831 查看

本文介绍windows环境下的Flask框架的python web的搭建。

首先当然需要安装Flask，直接pip install Flask即可。

安装了Flask之后，首先定义一个入口文件：

form flask import Flask,render_template

app = Flask(__name__)
@app.route("/")
def index():
return """
<html>
<body>
<h1>Hello,user</h1>
</body>
</html>
"""

在这里Flask是一个类，传递的参数是当前app的名称，这里直接使用__name__表示当前py文件的名称。

app.route("/")表示路由，"/"表示访问根路径的时候就执行下面的函数，返回字符串显示在web上。

下一步需要设置FLASK_APP这个环境变量的值：

set FLASK_APP = C:/Users/m1834/Desktop/代码/flaskTest/flaskTest.py

这里FLASK_APP的值是当前py文件的路径，这里是我自己的路径，读者需要改成自己的路径。

然后启动Flask：

flask run

windows终端显示如下：

然后就可以通过这里的url，也就是访问127.0.0.1:5000访问我们的python web了：

可是在return里这样以字符串的形式写HTML代码实际上是很麻烦的，这个时候就用到了render_template，修改代码如下：

from flask import Flask,render_template

app = Flask(__name__)

@app.route("/")
def index():
return render_template("index.html")

可以看到我们把return的东西从字符串改成了render_template("index.html")。我们在当前py文件路径下创建一个templates文件夹（这个名称是默认约定，templates不要写错），在templates文件夹内新建一个index.html的文件，里面写上刚才的HTML代码：

<html>
<body>
<h1>Hello,user</h1>
</body>
</html>

ctrl+c把刚才的python web停止之后使用flask run命令重新启动，访问127.0.0.1:5000，可以看到运行结果和刚才一样：

可是我们还是不满足，想要把user显示成对应的用户名怎么办？

实际上就可以通过render_template()这个函数来传递，代码修改如下：

from flask import Flask,render_template

app = Flask(__name__)

@app.route("/")
@app.route("/<name>")
def index(name):
return render_template("index.html",name=name)

可以看到路由多了一个url，也就是这个函数不但可以匹配根路径，还可以匹配根路径后面的一个名字，我们把这个名字传进index(name)函数。

render_template()也多了一个参数，第二个参数就表示把当前的name传给index.html。

这样前端就可以直接通过{{}}对变量进行访问了，也就是：

<html>
<body>
<h1>hello,{{name}}</h1>
</body>
</html>

重启flask，访问127.0.0.1:5000/Bob，运行结果如下：

那么如果我们想要把这个参数在前端的js代码中使用怎么办呢？直接在js中{{name}}表示name变量，直接使用可以吗？测试一下，把index.html改为：

<html>
<body>
<h1>hello,{{name}}</h1>
<script type="text/javascript">
alert({{name}});
</script>
</body>
</html>

重启flask，访问127.0.0.1:5000/Bob：

发现js报错了，这是为什么呢？因为实际上{{name}}对应的变量中特殊字符为了防止注入而被做了转义比如这里实际上就是"Bob"中的引号被转义了。利用js的tojson就可以解决这个问题，index.html修改如下：

<html>
<body>
<h1>hello,{{name}}</h1>
<script type="text/javascript">
alert({{name|tojson}});
</script>
</body>
</html>

运行结果就正常了：

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航