Day14: Flask太空站搭建指南：从零到超光速的Web开发之旅-CSDN博客

🧩 Flask基础结构：太空舱组装手册

# app/__init__.py
from flask import Flask
from .views import main_blueprint

def create_app():
    """应用工厂函数"""
    app = Flask(__name__)
    
    # 配置超空间参数
    app.config.update(
        SECRET_KEY='your_cosmic_key',
        TEMPLATES_AUTO_RELOAD=True
    )
    
    # 注册蓝图模块
    app.register_blueprint(main_blueprint)
    
    return app

# app/views.py
from flask import Blueprint
main_blueprint = Blueprint('main', __name__)

@main_blueprint.route('/launch')
def launch_sequence():
    """发射倒计时视图"""
    return '<h3>🚀 燃料填充完成：T-10秒！</h3>'

# 启动命令
if __name__ == '__main__':
    app = create_app()
    app.run(host='0.0.0.0', port=5000, debug=True)

运行体验：访问http://localhost:5000/launch查看你的第一个太空界面！

🎮 路由与视图：星际导航系统

基础航道设定

@main_blueprint.route('/planet/<string:planet_name>')
def planet_info(planet_name: str):
    """行星资料页面"""
    return f'''
        <h2>🌌 {planet_name.upper()}星球档案</h2>
        <p>重力：3.7m/s²</p>
        <p>大气组成：二氧化碳 96%</p>
    '''

# 访问示例：/planet/mars 显示火星信息

多引擎请求处理

from flask import request

@main_blueprint.route('/search', methods=['GET', 'POST'])
def cosmic_search():
    """星际搜索引擎"""
    if request.method == 'POST':
        keyword = request.form.get('keyword')
        return f'🔍 正在搜索：{keyword}'
    return '''
        <form method="POST">
            <input type="text" name="keyword">
            <button>启动量子搜索</button>
        </form>
    '''

🎨 Jinja2模板引擎：空间站皮肤系统

基础模板设计

<!-- templates/base.html -->
<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <title>{% block title %}太空总署{% endblock %}</title>
    <link rel="stylesheet" href="/static/css/nebula.css">
</head>
<body>
    <div class="container">
        <header class="cosmic-header">
            <h1>🌠 星际航行日志</h1>
        </header>
        {% block content %}{% endblock %}
    </div>
</body>
</html>

动态页面实例

<!-- templates/crew.html -->
{% extends "base.html" %}

{% block title %}船员名单{% endblock %}

{% block content %}
<section class="crew-list">
    <h2>👨🚀 当前在岗船员（共{{ crew_members|length }}人）</h2>
    <ul>
        {% for member in crew_members %}
        <li class="{{ 'captain' if member.is_captain }}">
            {{ member.name }} - {{ member.position }}
        </li>
        {% endfor %}
    </ul>
</section>
{% endblock %}

模板渲染控制器

from flask import render_template

@main_blueprint.route('/crew')
def crew_roster():
    """船员名单视图"""
    crew_data = [
        {"name": "王星海", "position": "舰长", "is_captain": True},
        {"name": "林月", "position": "舵手", "is_captain": False},
        {"name": "张天宇", "position": "工程师", "is_captain": False}
    ]
    return render_template('crew.html', crew_members=crew_data)

🚢 数据库引擎室：SQLAlchemy 对接

# models.py
from flask_sqlalchemy import SQLAlchemy

db = SQLAlchemy()

class Spaceship(db.Model):
    """星舰数据库模型"""
    id = db.Column(db.Integer, primary_key=True)
    name = db.Column(db.String(80), unique=True)
    speed = db.Column(db.Float)
    crew_capacity = db.Column(db.Integer)
    
    def __repr__(self):
        return f'<Spaceship {self.name}>'

# 初始化数据库
def init_db(app):
    app.config['SQLALCHEMY_DATABASE_URI'] = 'sqlite:///spaceships.db'
    db.init_app(app)
    with app.app_context():
        db.create_all()

🚀 综合实战：星际贸易系统

from flask import redirect, url_for

@main_blueprint.route('/trade', methods=['GET', 'POST'])
def intergalactic_trade():
    """星际贸易处理视图"""
    if request.method == 'POST':
        item = request.form['item']
        quantity = int(request.form['quantity'])
        # 保存交易记录到数据库
        new_trade = Trade(item=item, quantity=quantity)
        db.session.add(new_trade)
        db.session.commit()
        return redirect(url_for('main.trade_history'))
    
    return render_template('trade_form.html')

@main_blueprint.route('/trades')
def trade_history():
    """贸易历史记录"""
    trades = Trade.query.order_by(Trade.timestamp.desc()).all()
    return render_template('trades.html', trades=trades)

🌌 部署到深空网络

生产环境部署指南

# 安装超级引擎
pip install gunicorn

# 启动命令
gunicorn -w 4 --bind 0.0.0.0:8000 "app:create_app()"

# Nginx 配置文件示例
location / {
    proxy_pass http://localhost:8000;
    proxy_set_header Host $host;
    proxy_set_header X-Real-IP $remote_addr;
}