Python 30 天实战:个人博客网站开发(基础部分)
元素中进行展示。
四、文章发布功能
表单类定义(使用 Flask-WTF):
from flask_wtf import FlaskForm from wtforms import StringField, TextAreaField, SubmitField from wtforms.validators import DataRequired class ArticleForm(FlaskForm): title = StringField('文章标题', validators=[DataRequired(message='标题不能为空')]) content = TextAreaField('文章内容', validators=[DataRequired(message='内容不能为空')]) submit = SubmitField('发布文章')
在上述表单类中,定义了文章标题字段(title)、文章内容字段(content),都添加了不能为空的验证规则,还有一个提交按钮字段(submit)用于触发表单提交操作。
后端路由与表单处理及数据保存逻辑:
from flask import render_template, redirect, url_for from flask_wtf import FlaskForm @app.route('/create_article', methods=['GET', 'POST']) def create_article(): form = ArticleForm() if form.validate_on_submit(): title = form.title.data content = form.content.data new_article = Article(title=title, content=content) db_session.add(new_article) db_session.commit() return redirect(url_for('article_list')) return render_template('create_article.html', form=form)
在上述代码中,定义了 /create_article 路由来处理文章发布相关操作,支持 GET(用于显示文章发布页面)和 POST(用于处理表单提交)两种请求方法。在函数中先创建 ArticleForm 的实例 form,如果表单提交且通过验证,就获取表单中的标题和内容数据,创建一个新的 Article 对象并添加到数据库会话中,提交事务将新文章保存到数据库,最后重定向到文章列表页面。若表单未提交或验证不通过,则渲染 create_article.html 模板展示文章发布页面以及可能的错误提示信息。
HTML 模板设计(create_article.html):
个人博客 - 发布文章发布新文章{{ form.csrf_token }}{{ form.title.label }} {{ form.title }}{{ form.content.label }} {{ form.content }}{{ form.submit }}
在这个模板中,创建了一个 表单元素,设置表单提交方法为 POST,并且渲染了表单类中的各个字段(包括 csrf_token 用于防止跨站请求伪造攻击),用户可以在相应的输入框中输入文章标题和内容,点击提交按钮触发表单提交操作。
五、简单的 CSS 样式设计(styles.css,示例部分样式)
body { font-family: Arial, sans-serif; margin: 0; padding: 0; background-color: #f4f4f4; } h1 { text-align: center; color: #333; } ul { list-style-type: none; padding: 0; } li { margin-bottom: 10px; } a { text-decoration: none; color: #0066cc; } .article-content { margin: 20px; padding: 10px; background-color: #fff; border: 1px solid #ccc; }
上述 CSS 代码对页面的整体字体、背景颜色、标题样式、列表样式、链接样式以及文章内容展示区域的样式等进行了简单设置,让页面看起来更加整洁、美观。
通过今天这个综合练习,我们搭建起了一个简单个人博客网站的后端基础部分,实现了文章列表展示、文章详情查看以及文章发布等核心功能,并通过简单的 HTML、CSS 设计让网站具备了基本的外观。后续可以继续在此基础上完善功能,比如添加用户认证、评论功能等,以及进一步优化页面的样式设计。
#个人博客开发# #Flask 综合应用# #数据库与 Web 应用# #HTML CSS 基础# #Web 功能构建# #Python 项目实战#