现在不想使用后端模板渲染的方式来显示静态页面了，我们要做到**前后端分离**(当然更彻底的是直接前端业务作为一个单独的服务提供)，可以通过配置 蓝图 加载静态 html 资源的方式来呈现前端页面
在 `app/static/html` 目录下新建 `index.html` 代码如下
```
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<link rel="stylesheet" type="text/css" href="/static/css/style.css">
<title>前后端分离静态页面</title>
</head>
<body>
* 前后端分离的静态 HTML
</body>
</html>
```
在 `app` 目录下新建 `html.py` 文件，代码如下
```
#!/usr/bin/env python3
# -*- encoding: utf-8 -*-
from flask import Blueprint, make_response,current_app
html = Blueprint("html", __name__)
@html.route("/<re(r'.*'):html_file_name>")
def get_html(html_file_name):
if not html_file_name:
html_file_name = "index.html"
if html_file_name != "favicon.ico":
html_file_name = "html/"+html_file_name
# flask 提供的返回静态文件的方法
resp = make_response(current_app.send_static_file(html_file_name))
return resp
```
在改造下我们创建应用的工厂，导入提供静态页面的蓝图
对 `app` 目录下的 ` __init__` 初始化文件进行如下改造
```
#!/usr/bin/env python3
# -*- encoding: utf-8 -*-
from flask import Flask
from flask_sqlalchemy import SQLAlchemy
import logging
from logging.handlers import RotatingFileHandler
from config import config_map
from app.utils.commons import ReCoverter
# 创建数据库对象
db = SQLAlchemy()
# 设置日志的记录级别
logging.basicConfig(level=logging.DEBUG) # 调试级别 debug
# 创建日志记录器，指明日志保存路径、每个日志文件的最大大小 100Kb、保存的日志文件个数上限
file_log_handler = RotatingFileHandler("logs/log", maxBytes=1024*1024*100, backupCount=10)
# 创建日志记录格式 日志等级 输入日志信息的文件名 行数 日志错误
formatter = logging.Formatter('%(levelname)s %(filename)s:%(lineno)d %(message)s')
# 为刚创建的日志记录器设置日志记录格式
file_log_handler.setFormatter(formatter)
# 为全局的日志工具对象 (flask app使用) 添加日志记录器
logging.getLogger().addHandler(file_log_handler)
# 工厂模式
def create_app(config_name):
app = Flask(__name__)
# 设置 flask 的配置信息
config_class = config_map[config_name]
app.config.from_object(config_class)
# 使用 app 初始化 db
db.init_app(app)
# 为 flask 添加自定义的转换器
app.url_map.converters["re"] = ReCoverter
# 注册蓝图
from app import api_1_0
app.register_blueprint(api_1_0.bp, url_prefix="/api/v1.0")
# from app import admin
# app.register_blueprint(admin.bp, url_prefix="/admin")
# 注册提供静态文件的蓝图
from app import html
app.register_blueprint(html.html)
return app
```
此时访问 `http://localhost:5000/`
