AI 助理
备案控制台
开发者社区 开发与运维 文章 正文

Python全栈 Web（基于Flask框架的完整项目、项目搭建）

2018-10-11 58914
版权
版权声明：
本文内容由阿里云实名注册用户自发贡献，版权归原作者所有，阿里云开发者社区不拥有其著作权，亦不承担相应法律责任。具体规则请查看《 阿里云开发者社区用户服务协议》和 《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容，填写 侵权投诉表单进行举报，一经查实，本社区将立刻删除涉嫌侵权内容。
本文涉及的产品
RDS MySQL Serverless 基础系列，0.5-2RCU 50GB
推荐场景：
学生管理系统数据库设计 搭建个人博客
云数据库 RDS MySQL，集群系列 2核4GB
推荐场景：
搭建个人博客
云数据库 RDS MySQL，高可用系列 2核4GB
简介： Flask、Python、Django、框架、服务器、客户端、浏览器、交互、WEB、Python前端、CSS、JAVA、HTML、H5、PHP、JavaScript、JQuery、分布式开发、项目、flask项目、项目实战、flask框架、Python项目、Python的Flask框架、Python...




个人博客项目  前端模板目录结构

将动态网页放在templates模板目录中

将静态文件以及静态页面放在static目录中



项目的整体效果














搭建后端Flask项目    


数据库的建模




初始化数据库


1 创建项目数据库




2 将构建好的表进行初始化  输入密码即可导入




验证数据库



blog.sql文件



/*
Navicat MySQL Data Transfer

Source Server         : localhost
Source Server Version : 50721
Source Host           : localhost:3306
Source Database       : blog

Target Server Type    : MYSQL
Target Server Version : 50721
File Encoding         : 65001

Date: 2018-10-09 00:03:02
*/

SET FOREIGN_KEY_CHECKS=0;

-- ----------------------------
-- Table structure for `blogtype`
-- ----------------------------
DROP TABLE IF EXISTS `blogtype`;
CREATE TABLE `blogtype` (
  `id` int(11) NOT NULL AUTO_INCREMENT,
  `type_name` varchar(20) NOT NULL,
  PRIMARY KEY (`id`)
) ENGINE=InnoDB AUTO_INCREMENT=4 DEFAULT CHARSET=utf8 COMMENT='博客类型 - 个人博客,公开博客,其他博客';

-- ----------------------------
-- Records of blogtype
-- ----------------------------
INSERT INTO `blogtype` VALUES ('1', '个人博客');
INSERT INTO `blogtype` VALUES ('2', '公开博客');
INSERT INTO `blogtype` VALUES ('3', '其他博客');

-- ----------------------------
-- Table structure for `category`
-- ----------------------------
DROP TABLE IF EXISTS `category`;
CREATE TABLE `category` (
  `id` int(11) NOT NULL AUTO_INCREMENT,
  `cate_name` varchar(50) NOT NULL,
  PRIMARY KEY (`id`)
) ENGINE=InnoDB AUTO_INCREMENT=5 DEFAULT CHARSET=utf8 COMMENT='文章分类';

-- ----------------------------
-- Records of category
-- ----------------------------
INSERT INTO `category` VALUES ('1', 'Python');
INSERT INTO `category` VALUES ('2', 'Python Web');
INSERT INTO `category` VALUES ('3', '爬虫');
INSERT INTO `category` VALUES ('4', '人工智能');

-- ----------------------------
-- Table structure for `reply`
-- ----------------------------
DROP TABLE IF EXISTS `reply`;
CREATE TABLE `reply` (
  `id` int(11) NOT NULL,
  `user_id` int(11) NOT NULL,
  `topic_id` int(11) NOT NULL,
  `content` text NOT NULL,
  `reply_time` datetime DEFAULT NULL,
  PRIMARY KEY (`id`),
  KEY `FK_Reply_User` (`user_id`),
  KEY `FK_Reply_Topic` (`topic_id`),
  CONSTRAINT `FK_Reply_Topic` FOREIGN KEY (`topic_id`) REFERENCES `topic` (`id`),
  CONSTRAINT `FK_Reply_User` FOREIGN KEY (`user_id`) REFERENCES `user` (`ID`)
) ENGINE=InnoDB DEFAULT CHARSET=utf8 COMMENT='博客回复';

-- ----------------------------
-- Records of reply
-- ----------------------------

-- ----------------------------
-- Table structure for `topic`
-- ----------------------------
DROP TABLE IF EXISTS `topic`;
CREATE TABLE `topic` (
  `id` int(11) NOT NULL AUTO_INCREMENT,
  `title` varchar(200) NOT NULL,
  `pub_date` datetime NOT NULL,
  `read_num` int(11) DEFAULT NULL,
  `content` text NOT NULL,
  `images` text,
  `blogtype_id` int(11) DEFAULT NULL,
  `category_id` int(11) DEFAULT NULL,
  `user_id` int(11) DEFAULT NULL,
  PRIMARY KEY (`id`),
  KEY `FK_Topic_User` (`user_id`),
  KEY `FK_Topic_Blogtype` (`blogtype_id`),
  KEY `FK_Topic_Category` (`category_id`),
  CONSTRAINT `FK_Topic_Blogtype` FOREIGN KEY (`blogtype_id`) REFERENCES `blogtype` (`id`),
  CONSTRAINT `FK_Topic_Category` FOREIGN KEY (`category_id`) REFERENCES `category` (`id`),
  CONSTRAINT `FK_Topic_User` FOREIGN KEY (`user_id`) REFERENCES `user` (`ID`)
) ENGINE=InnoDB AUTO_INCREMENT=6 DEFAULT CHARSET=utf8 COMMENT='博客文章';

-- ----------------------------
-- Records of topic
-- ----------------------------
INSERT INTO `topic` VALUES ('1', '简单而直接的Python Web框架', '2018-08-08 20:37:20', '123', 'From：https://www.oschina.net/question/5189_4306\r\n\r\nFrom：https://www.oschina.net/question/5189_4306\r\n\r\n\r\n\r\nWeb.py Cookbook 简体中文版：http://webpy.org/cookbook/index.zh-cn\r\n\r\nweb.py 0.3 新手指南：http://webpy.org/docs/0.3/tutorial.zh-cn\r\n\r\n\r\n\r\nwebpy 官网文档：http://webpy.org/ web.py 十分钟创建简易博客：http://blog.csdn.net/freeking101/article/details/53020728\r\n\r\nweb.py 是一个Python 的web 框架，它简单而且功能强大。web.py 是公开的，无论用于什么用途都是没有限制的。而且相当的小巧，应当归属于轻量级的web 框架。但这并不影响web.py 的强大，而且使用起来很简单、很直接。在实际应用上，web.py 更多的是学术上的价值，因为你可以看到更多web 应用的底层，这在当今“抽象得很好”的web 框架上是学不到的 ：） 如果想了解更多web.py，可以访问web.py 的官方文档。 先感受一下web.py 的简单而强大：\r\n\r\n上面就是一个基于web.py 的完整的Web 应用。将上面的代码保存为文件code.py，在命令行下执行python code.py。然后打开你的浏览器，打开地址：http://localhost:8080 或者 http://localhost:8080/test 没有意外的话(当然要先安装web.py，下面会有介绍)，浏览器会显示“Hello, world”或者 “Hello, test”。 \r\n\r\n\r\n\r\n1. 安装 下载 web.py 的安装文件，将下载得到的文件 web.py 解压，进入解压后的文件夹，在命令行下执行：python setup.py install，在Linux 等系统下，需要root 的权限，可以执行：sudo python setup.py install。 2. URL 处理 对于一个站点来说，URL 的组织是最重要的一个部分，因为这是用户看得到的部分，而且直接影响到站点是如何工作的，例如：www.baidu.com ，其URLs 甚至是网页界面的一部分。而web.py 以简单的方式就能够构造出一个强大的URLs。 在每个web.py 应用，必须先import web 模块：', 'images/banner01.jpg', '1', '2', '1');
INSERT INTO `topic` VALUES ('2', 'Python-win10下使用定时任务执行程序', '2017-10-01 00:00:00', '4567', 'webpy 官网文档：http://webpy.org/ web.py 十分钟创建简易博客：http://blog.csdn.net/freeking101/article/details/53020728\r\n\r\nweb.py 是一个Python 的web 框架，它简单而且功能强大。web.py 是公开的，无论用于什么用途都是没有限制的。而且相当的小巧，应当归属于轻量级的web 框架。但这并不影响web.py 的强大，而且使用起来很简单、很直接。在实际应用上，web.py 更多的是学术上的价值，因为你可以看到更多web 应用的底层，这在当今“抽象得很好”的web 框架上是学不到的 ：） 如果想了解更多web.py，可以访问web.py 的官方文档。 先感受一下web.py 的简单而强大：\r\n\r\n上面就是一个基于web.py 的完整的Web 应用。将上面的代码保存为文件code.py，在命令行下执行python code.py。然后打开你的浏览器，打开地址：http://localhost:8080 或者 http://localhost:8080/test 没有意外的话(当然要先安装web.py，下面会有介绍)，浏览器会显示“Hello, world”或者 “Hello, test”。 \r\n\r\n\r\n\r\n1. 安装 下载 web.py 的安装文件，将下载得到的文件 web.py 解压，进入解压后的文件夹，在命令行下执行：python setup.py install，在Linux 等系统下，需要root 的权限，可以执行：sudo python setup.py install。 2. URL 处理 对于一个站点来说，URL 的组织是最重要的一个部分，因为这是用户看得到的部分，而且直接影响到站点是如何工作的，例如：www.baidu.com ，其URLs 甚至是网页界面的一部分。而web.py 以简单的方式就能够构造出一个强大的URLs。 在每个web.py 应用，必须先import web 模块：\r\nwebpy 官网文档：http://webpy.org/ web.py 十分钟创建简易博客：http://blog.csdn.net/freeking101/article/details/53020728\r\n\r\nweb.py 是一个Python 的web 框架，它简单而且功能强大。web.py 是公开的，无论用于什么用途都是没有限制的。而且相当的小巧，应当归属于轻量级的web 框架。但这并不影响web.py 的强大，而且使用起来很简单、很直接。在实际应用上，web.py 更多的是学术上的价值，因为你可以看到更多web 应用的底层，这在当今“抽象得很好”的web 框架上是学不到的 ：） 如果想了解更多web.py，可以访问web.py 的官方文档。 先感受一下web.py 的简单而强大：\r\n\r\n上面就是一个基于web.py 的完整的Web 应用。将上面的代码保存为文件code.py，在命令行下执行python code.py。然后打开你的浏览器，打开地址：http://localhost:8080 或者 http://localhost:8080/test 没有意外的话(当然要先安装web.py，下面会有介绍)，浏览器会显示“Hello, world”或者 “Hello, test”。 \r\n\r\n\r\n\r\n1. 安装 下载 web.py 的安装文件，将下载得到的文件 web.py 解压，进入解压后的文件夹，在命令行下执行：python setup.py install，在Linux 等系统下，需要root 的权限，可以执行：sudo python setup.py install。 2. URL 处理 对于一个站点来说，URL 的组织是最重要的一个部分，因为这是用户看得到的部分，而且直接影响到站点是如何工作的，例如：www.baidu.com ，其URLs 甚至是网页界面的一部分。而web.py 以简单的方式就能够构造出一个强大的URLs。 在每个web.py 应用，必须先import web 模块：\r\nwebpy 官网文档：http://webpy.org/ web.py 十分钟创建简易博客：http://blog.csdn.net/freeking101/article/details/53020728\r\n\r\nweb.py 是一个Python 的web 框架，它简单而且功能强大。web.py 是公开的，无论用于什么用途都是没有限制的。而且相当的小巧，应当归属于轻量级的web 框架。但这并不影响web.py 的强大，而且使用起来很简单、很直接。在实际应用上，web.py 更多的是学术上的价值，因为你可以看到更多web 应用的底层，这在当今“抽象得很好”的web 框架上是学不到的 ：） 如果想了解更多web.py，可以访问web.py 的官方文档。 先感受一下web.py 的简单而强大：\r\n\r\n上面就是一个基于web.py 的完整的Web 应用。将上面的代码保存为文件code.py，在命令行下执行python code.py。然后打开你的浏览器，打开地址：http://localhost:8080 或者 http://localhost:8080/test 没有意外的话(当然要先安装web.py，下面会有介绍)，浏览器会显示“Hello, world”或者 “Hello, test”。 \r\n\r\n\r\n\r\n1. 安装 下载 web.py 的安装文件，将下载得到的文件 web.py 解压，进入解压后的文件夹，在命令行下执行：python setup.py install，在Linux 等系统下，需要root 的权限，可以执行：sudo python setup.py install。 2. URL 处理 对于一个站点来说，URL 的组织是最重要的一个部分，因为这是用户看得到的部分，而且直接影响到站点是如何工作的，例如：www.baidu.com ，其URLs 甚至是网页界面的一部分。而web.py 以简单的方式就能够构造出一个强大的URLs。 在每个web.py 应用，必须先import web 模块：\r\nFrom：https://www.oschina.net/question/5189_4306\r\n\r\nFrom：https://www.oschina.net/question/5189_4306\r\n\r\n\r\n\r\nWeb.py Cookbook 简体中文版：http://webpy.org/cookbook/index.zh-cn\r\n\r\nweb.py 0.3 新手指南：http://webpy.org/docs/0.3/tutorial.zh-cn\r\n\r\n\r\n\r\nwebpy 官网文档：http://webpy.org/ web.py 十分钟创建简易博客：http://blog.csdn.net/freeking101/article/details/53020728\r\n\r\nweb.py 是一个Python 的web 框架，它简单而且功能强大。web.py 是公开的，无论用于什么用途都是没有限制的。而且相当的小巧，应当归属于轻量级的web 框架。但这并不影响web.py 的强大，而且使用起来很简单、很直接。在实际应用上，web.py 更多的是学术上的价值，因为你可以看到更多web 应用的底层，这在当今“抽象得很好”的web 框架上是学不到的 ：） 如果想了解更多web.py，可以访问web.py 的官方文档。 先感受一下web.py 的简单而强大：\r\n\r\n上面就是一个基于web.py 的完整的Web 应用。将上面的代码保存为文件code.py，在命令行下执行python code.py。然后打开你的浏览器，打开地址：http://localhost:8080 或者 http://localhost:8080/test 没有意外的话(当然要先安装web.py，下面会有介绍)，浏览器会显示“Hello, world”或者 “Hello, test”。 \r\n\r\n\r\n\r\n1. 安装 下载 web.py 的安装文件，将下载得到的文件 web.py 解压，进入解压后的文件夹，在命令行下执行：python setup.py install，在Linux 等系统下，需要root 的权限，可以执行：sudo python setup.py install。 2. URL 处理 对于一个站点来说，URL 的组织是最重要的一个部分，因为这是用户看得到的部分，而且直接影响到站点是如何工作的，例如：www.baidu.com ，其URLs 甚至是网页界面的一部分。而web.py 以简单的方式就能够构造出一个强大的URLs。 在每个web.py 应用，必须先import web 模块：', 'images/banner02.jpg', '1', '2', '1');
INSERT INTO `topic` VALUES ('3', '爬虫微课5小时 python学习路线', '2015-10-01 00:00:00', '0', 'Python 安装配置及基本语法篇 Python 语言速成 Python 基本知识 Python 常用表达式 Python 基础语法 Python 语法篇：菜鸟的Python笔记 Python精要参考：快速入门 《Python标... ', 'images/banner03.jpg', '1', '2', '1');
INSERT INTO `topic` VALUES ('4', 'linux升级Pip3,安装pip svn', '2016-09-21 00:00:00', '234', 'python中打开TXT文件报错2017年03月09日 14:30:57 阅读数:676 在IDLE命令行引用一文件夹下的函数,来了条错误提示:FileNotFoundError: [Errno 2] No such ...', 'images/toppic01.jpg', '1', '2', '1');
INSERT INTO `topic` VALUES ('5', '精通python变成', '2017-12-04 00:00:00', '999', '随便写点内容吧', 'images/zd01.jpg', '1', '2', '1');

-- ----------------------------
-- Table structure for `user`
-- ----------------------------
DROP TABLE IF EXISTS `user`;
CREATE TABLE `user` (
  `ID` int(11) NOT NULL AUTO_INCREMENT,
  `loginname` varchar(50) NOT NULL,
  `uname` varchar(30) NOT NULL,
  `email` varchar(200) NOT NULL,
  `url` varchar(200) DEFAULT NULL,
  `upwd` varchar(30) NOT NULL,
  `is_author` tinyint(4) DEFAULT '0',
  PRIMARY KEY (`ID`)
) ENGINE=InnoDB AUTO_INCREMENT=4 DEFAULT CHARSET=utf8 COMMENT='用户信息表';

-- ----------------------------
-- Records of user
-- ----------------------------
INSERT INTO `user` VALUES ('1', 'piye', 'Paris', 'wei5218023@gmail.com', null, '123456', '1');
INSERT INTO `user` VALUES ('2', 'weiye', '魏爷', 'weimz@163.com', null, '123456', '0');
INSERT INTO `user` VALUES ('3', 'lvye', '吕爷', 'lvye@163.com', null, '123456', '0');

-- ----------------------------
-- Table structure for `voke`
-- ----------------------------
DROP TABLE IF EXISTS `voke`;
CREATE TABLE `voke` (
  `id` int(11) NOT NULL,
  `user_id` int(11) NOT NULL,
  `topic_id` int(11) NOT NULL,
  PRIMARY KEY (`id`),
  KEY `FK_Voke_User` (`user_id`),
  KEY `FK_Voke_Topic` (`topic_id`),
  CONSTRAINT `FK_Voke_Topic` FOREIGN KEY (`topic_id`) REFERENCES `topic` (`id`),
  CONSTRAINT `FK_Voke_User` FOREIGN KEY (`user_id`) REFERENCES `user` (`ID`)
) ENGINE=InnoDB DEFAULT CHARSET=utf8 COMMENT='点赞';

-- ----------------------------
-- Records of voke
-- ----------------------------




项目的整体划分





搭建目录结构





整体结构搭建好以后当然是要疯狂调试了


1 首先创建一个app构建函数  并将app连接到mysql数据库并做主要配置




# blogapp下的__init__.py文件
# 将整个应用初始化
# 主要工作
#     1：构建flask应用以及各种配置
#     2：构建SQLAlchemy的应用

from flask import Flask
from flask_sqlalchemy import SQLAlchemy
import pymysql
pymysql.install_as_MySQLdb()

db = SQLAlchemy()


def create_app():
    app = Flask(__name__)
    # 配置启动模式为调试模式
    app.config["DEBUG"] = True
    # 配置数据库的连接
    app.config["SQLALCHEMY_DATABASE_URI"] = "mysql://root:ParisPython@127.0.0.1:3306/blog"
    # 配置数据库内容在更新时自动提交
    app.config["SQLALCHEMY_COMMIT_ON_TEARDOWN"] = True
    # 配置session所需要的秘钥
    app.config["SECRET_KEY"] = "Paispasswordkey"
    # 数据库的初始化
    db.init_app(app)
    return app



2 将数据库中的所有表映射到Python中





# 当前项目相关的模型文件 所有 实体类
from . import db

# 博客分类
class Category(db.Model):
    __tablename__ = "category"
    id = db.Column(db.Integer, primary_key=True)
    cate_name = db.Column(db.String(50), nullable=False)

    # 反向引用 topic表 每个category对象都有一个topic属性
    topic = db.relationship("Topic", backref="category", lazy="dynamic")

# 博客类型
class BlogType(db.Model):
    __tablename__ = "blogtype"
    id = db.Column(db.Integer, primary_key=True)
    type_name = db.Column(db.String(20), nullable=False)

    # 反向引用 topic表 每个blogtype对象都有一个topic属性
    topic = db.relationship("Topic", backref="blogtype", lazy="dynamic")

# 用户信息
class User(db.Model):
    __tablename__ = "user"
    id = db.Column(db.Integer, primary_key=True)
    loginname = db.Column(db.String(50), nullable=False)
    uname = db.Column(db.String(30), nullable=False)
    email = db.Column(db.String(200), nullable=False)
    url = db.Column(db.String(200))
    upwd = db.Column(db.String(30), nullable=False)
    is_author = db.Column(db.String(4), default=0)

    # 反向引用 topic表 每个user对象都有一个topic属性
    topic = db.relationship("Topic", backref="user", lazy="dynamic")
    # 反向引用 reply表 每个user对象都有一个reply属性
    reply = db.relationship("Reply", backref="user", lazy="dynamic")

    # 关系：多对多
    # 增加与topic之间的关联关系
    voke_topic = db.relationship("Topic",
                                 secondary="voke",
                                 backref=db.backref("voke_user", lazy="dynamic"),
                                 lazy="dynamic"
                                 )

# 主题内容
class Topic(db.Model):
    __tablename__ = "topic"
    id = db.Column(db.Integer, primary_key=True)
    title = db.Column(db.String(200), nullable=False)
    pub_date = db.Column(db.DateTime, nullable=False)
    read_num = db.Column(db.Integer, default=0)
    content = db.Column(db.Text, nullable=False)
    images = db.Column(db.Text)

    # 关系：一（blogtyp，category，user）对多 (topic)

    # 外键关联blogtype表每个topic对象都有一个blogtype属性
    blogtype_id = db.Column(db.Integer, db.ForeignKey("blogtype.id"))
    # 外键关联category表每个topic对象都有一个category属性
    category_id = db.Column(db.Integer, db.ForeignKey("category.id"))
    # 外键关联user表每个topic对象都有一个user属性
    user_id = db.Column(db.Integer, db.ForeignKey("user.id"))

    # 反向引用 reply表 每个topic对象都有一个reply属性
    reply = db.relationship("Reply", backref="topic", lazy="dynamic")

# 回复内容信息
class Reply(db.Model):
    __tablename__ = "reply"
    id = db.Column(db.Integer, primary_key=True)
    content = db.Column(db.Text, nullable=False)
    reply_time = db.Column(db.DateTime)

    # 关系：一（topic，user）对多 (reply)

    # 外键关联user表  reply对象都有一个user属性
    user_id = db.Column(db.Integer, db.ForeignKey("user.id"), nullable=False)
    # 外键关联topic表 reply对象都有一个topic属性
    topic_id = db.Column(db.Integer, db.ForeignKey("topic.id"), nullable=False)


# 多对多  第三张关联关系表
Voke = db.Table(
    "voke",
    db.Column("id", db.Integer, primary_key=True),
    db.Column("user_id", db.Integer, db.ForeignKey("user.id")),
    db.Column("topic_id", db.Integer, db.ForeignKey("topic.id"))
)



3 在项目管理文件中创建一个APP 并作为项目的启动文件 




# 主目录 manage.py
# 启动和管理项目
from blogapp import create_app

app = create_app()


if __name__ == "__main__":
    app.run()


4  将user业务和main业务 利用蓝图关联到app  并且让app能够处理users和main的视图函数 




# users针对用户逻辑处理的目录
# __init__.py 针对用户业务逻辑的初始化操作

# 将flask框架的蓝图导入
from flask import Blueprint
# 构建蓝图程序
users = Blueprint("users", __name__)
# 导入当前包的路由和视图函数
from . import views



# main 包含主要的业务逻辑的路由和视图函数
# __init__.py  对主业务逻辑程序的初始化操作

# 将flask框架的蓝图导入
from flask import Blueprint
# 构建蓝图程序
main = Blueprint("main", __name__)
# 导入当前包的路由和视图函数
from . import views








# blogapp下的__init__.py文件
# 将整个应用初始化
# 主要工作
#     1：构建flask应用以及各种配置
#     2：构建SQLAlchemy的应用

from flask import Flask
from flask_sqlalchemy import SQLAlchemy
import pymysql
pymysql.install_as_MySQLdb()

db = SQLAlchemy()


def create_app():
    app = Flask(__name__)
    # 配置启动模式为调试模式
    app.config["DEBUG"] = True
    # 配置数据库的连接
    app.config["SQLALCHEMY_DATABASE_URI"] = "mysql://root:ParisPython@127.0.0.1:3306/blog"
    # 配置数据库内容在更新时自动提交
    app.config["SQLALCHEMY_COMMIT_ON_TEARDOWN"] = True
    # 配置session所需要的秘钥
    app.config["SECRET_KEY"] = "Paispasswordkey"
    # 数据库的初始化
    db.init_app(app)

    # 将main蓝图程序与app关联到一起
    from .main import main as main_blueprint
    # 注册名为main的app
    app.register_blueprint(main_blueprint)

    # 将users蓝图程序与APP关联到一起
    from .users import users as users_blueprint
    # 注册名为users的app
    app.register_blueprint(users_blueprint)  # url_prefix="/user"
    return app


5 接下来就是路由、视图函数、数据库的CRUD、模板 的配置了


先将所有模板的基本路由配置好 确保 在点击网页button时能够实现正常跳转



# main主业务逻辑中的视图和路由的定义

from flask import render_template, request
# 导入蓝图程序用于构建路由
from . import main
# 导入db用于操作数据库
from .. import db
# 导入实体列 用户操作数据库
from ..models import *


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


@main.route("/list")
@main.route("/list.html")
def main_list():
    return render_template("list.html")


@main.route("/photo")
@main.route("/photo.html")
def main_photo():
    return render_template("photo.html")


@main.route("/time")
@main.route("/time.html")
def mian_time():
    return render_template("time.html")


@main.route("/gbook")
@main.route("/gbook.html")
def main_gbook():
    return render_template("gbook.html")


@main.route("/about")
@main.route("/about.html")
def main_about():
    return render_template("about.html")


@main.route("/release")
@main.route("/release.html")
def main_release():
    return render_template("release.html")


@main.route("/info")
@main.route("/info.html")
def main_info():
    return render_template("info.html")









# users针对用户业务逻辑处理的视图和路由
from flask import render_template
# 导入蓝图程序用于构建路由
from . import users
# 导入db用于操作数据库
from .. import db
# 导入实体列 用户操作数据库
from ..models import *


@users.route("/login")
@users.route("/login.html")
def users_login():
    return render_template("login.html")


@users.route("/register")
@users.route("/register.html")
def users_register():
    return render_template("register.html")



启动主程序  确保URL可以正常request





首页





确保没问题就可以 其他的就不截图了





6  CRUD模板的动态配置



首页加载完成后从数据库读取当前hover的div显示内容

默认有5个分类 

数据库的数据只写了4个这样可以看出是否修改成功






上图5个分类都是静态的 先将静态html修改成模板嵌入Python代码

这里我没删只是将原来的注释掉了

不知道是不是Mac系统的原因pycharm的快捷键注释 都是单行 不是文本注释

看起来别扭 


后端将查询结构传递给前端



@main.route("/")
@main.route("/index")
@main.route("/index.html")
def main_index():
    # 查询所有的Category的信息
    categories = Category.query.all()
    return render_template("index.html", **locals())



前端进行显示



          <ul class="sub-nav">
            <!--<li><a href="list.html">Python</a></li>-->
            <!--<li><a href="list.html">python Web</a></li>-->
            <!--<li><a href="list.html">爬虫</a></li>-->
            <!--<li><a href="list.html">人工智能</a></li>-->
            <!--<li><a href="list.html">JS实例索引</a></li>-->

            {% for category in categories %}
              <li>
                <a href="/list?cateid={{category.id}}">{{category.cate_name}}</a>
              </li>
            {% endfor %}
          </ul>


刷新网页 查看是否修改成功







7轮播图以及侧边置顶的动态配置




大体和上面一样  几乎相同的配置


后端查询数据  查询的方式有很多种 看个人喜好



@main.route("/")
@main.route("/index")
@main.route("/index.html")
def main_index():
    # 查询所有的Category的信息
    categories = Category.query.all()
    # 查询所有的topic的信息
    # topics = Topic.query.all()[0:5]
    topics = Topic.query.limit(5).all()
    return render_template("index.html", **locals())



找到轮播图的html

进行动态创建



          <!--<li class="slide"><a href="info.html" target="_blank"><img src="../static/images/banner01.jpg"><span class="imginfo">爬虫微课5小时-->
                <!--python学习路线!</span></a></li>-->
          <!--<li class="slide"><a href="info.html" target="_blank"><img src="../static/images/banner02.jpg"><span class="imginfo">干货|如何优雅的在手机上进行Python编程</span></a></li>-->
          <!--<li class="slide"><a href="info.html" target="_blank"><img src="../static/images/banner03.jpg"><span class="imginfo">python-win10下使用定时任务执行程序</span></a></li>-->
          {% for topic in topics[:3] %}
            <li class="slide">
              <a href="/info?topic_id={{ topic.id }}" target="_blank">
                <img src="../static/{{ topic.images }}">
                <span class="imginfo">{{ topic.title }}</span>
              </a>
            </li>
          {% endfor %}

侧边置顶  这里是采用的是前5条数据 以切片的方式进行遍历的数据

还有一个注意点就是模型对象的外键关联以及反向引用 都有对应的属性或隐式属性

所以这里我用了 topic模型对象的反向引用隐式属性category

也就是在Category模型中反向引用Topic模型时为Topic模型创建的隐式属性category


      <div class="toppic">
        <!--<li> <a href="info.html" target="_blank"> <i><img src="../static/images/toppic01.jpg"></i>-->
            <!--<h2>linux升级py3,安装pip,svn</h2>-->
            <!--<span>Linux</span>-->
          <!--</a> </li>-->
        <!--<li> <a href="info.html" target="_blank"> <i><img src="../static/images/zd01.jpg"></i>-->
            <!--<h2>精通Python编程——Python深入浅出教程</h2>-->
            <!--<span>python</span>-->
          <!--</a> </li>-->

        {% for topic in topics[3:5] %}
          <li>
            <a href="info?topic_id={{ topic.id }}" target="_blank">
              <i>
                <img src="../static/{{ topic.images }}">
              </i>
              <h2>{{ topic.title }}</h2>
              <span>{{ topic.category.cate_name }}</span>
            </a>
          </li>
        {% endfor %}

      </div>


刷新网页依然可以正常显示








未完待续。。。


文章标签：
云数据库 RDS MySQL 版
Python
移动开发
数据库
Linux
关系型数据库
关键词：
web框架
Python项目
Python Web框架
Python web
web全栈
相关实践学习
如何在云端创建MySQL数据库
开始实验后，系统会自动创建一台自建MySQL的 源数据库 ECS 实例和一台 目标数据库 RDS。
全面了解阿里云能为你做什么
阿里云在全球各地部署高效节能的绿色数据中心，利用清洁计算为万物互联的新世界提供源源不断的能源动力，目前开服的区域包括中国（华北、华东、华南、香港）、新加坡、美国（美东、美西）、欧洲、中东、澳大利亚、日本。目前阿里云的产品涵盖弹性计算、数据库、存储与CDN、分析与搜索、云通信、网络、管理与监控、应用服务、互联网中间件、移动服务、视频服务等。通过本课程，来了解阿里云能够为你的业务带来哪些帮助 &nbsp; &nbsp; 相关的阿里云产品：云服务器ECS 云服务器 ECS（Elastic Compute Service）是一种弹性可伸缩的计算服务，助您降低 IT 成本，提升运维效率，使您更专注于核心业务创新。产品详情: https://www.aliyun.com/product/ecs
巴黎香榭
目录
相关文章
土木林森
|
3天前
|
数据采集 存储 JSON
Python网络爬虫：Scrapy框架的实战应用与技巧分享
【10月更文挑战第27天】本文介绍了Python网络爬虫Scrapy框架的实战应用与技巧。首先讲解了如何创建Scrapy项目、定义爬虫、处理JSON响应、设置User-Agent和代理，以及存储爬取的数据。通过具体示例，帮助读者掌握Scrapy的核心功能和使用方法，提升数据采集效率。
土木林森
23 6
土木林森
|
3天前
|
设计模式 前端开发 数据库
Python Web开发：Django框架下的全栈开发实战
【10月更文挑战第27天】本文介绍了Django框架在Python Web开发中的应用，涵盖了Django与Flask等框架的比较、项目结构、模型、视图、模板和URL配置等内容，并展示了实际代码示例，帮助读者快速掌握Django全栈开发的核心技术。
土木林森
72 44
龙大吉
|
1天前
|
SQL 安全 PHP
探索PHP的现代演进：从Web开发到框架创新
PHP 自发布以来一直在 Web 开发领域占据重要地位，历经多次重大更新，从简单的脚本语言进化为支持面向对象编程的现代语言。本文探讨 PHP 的演进历程，重点介绍其在 Web 开发中的应用及框架创新。自 PHP 5.3 引入命名空间后，PHP 迈向了面向对象编程时代；PHP 7 通过优化内核大幅提升性能；PHP 8 更是带来了属性、刚性类型等新特性。
龙大吉
7 3
土木林森
|
4天前
|
数据采集 前端开发 中间件
Python网络爬虫：Scrapy框架的实战应用与技巧分享
【10月更文挑战第26天】Python是一种强大的编程语言，在数据抓取和网络爬虫领域应用广泛。Scrapy作为高效灵活的爬虫框架，为开发者提供了强大的工具集。本文通过实战案例，详细解析Scrapy框架的应用与技巧，并附上示例代码。文章介绍了Scrapy的基本概念、创建项目、编写简单爬虫、高级特性和技巧等内容。
土木林森
21 4
二二*一一
|
4天前
|
前端开发 JavaScript
Bootstrap Web 前端 UI 框架
Bootstrap 是快速开发 Web 应用程序的前端工具包。
二二*一一
17 3
土木林森
|
3天前
|
网络协议 调度 开发者
Python网络编程：Twisted框架的异步IO处理与实战
【10月更文挑战第27天】本文介绍了Python网络编程中的Twisted框架，重点讲解了其异步IO处理机制。通过反应器模式，Twisted能够在单线程中高效处理多个网络连接。文章提供了两个实战示例：一个简单的Echo服务器和一个HTTP服务器，展示了Twisted的强大功能和灵活性。
土木林森
12 0
游客qf4jmczx4xu2y
|
6月前
|
开发框架 开发者 Python
深入探究Python Web开发框架：Flask与Django
Python作为一种广泛应用于Web开发的编程语言，其拥有众多优秀的Web开发框架。本文将深入探讨其中两大知名框架——Flask与Django。通过对它们的概念与实践进行比较分析，帮助读者更好地理解和选择适合自己项目需求的Web开发框架。
游客qf4jmczx4xu2y
104 1
土木林森
|
6月前
|
前端开发 数据库 Python
Python Web 开发： 解释 Django 框架的 MVC 架构是什么？
Python Web 开发： 解释 Django 框架的 MVC 架构是什么？
土木林森
116 0
东方睿赢
|
4月前
|
开发框架 JSON API
震撼发布！Python Web开发框架下的RESTful API设计全攻略，让数据交互更自由！
【7月更文挑战第22天】在Python Web开发中，设计高效的RESTful API涉及选择框架（如Flask或Django）、明确资源及使用HTTP方法（GET, POST, PUT, DELETE）来操作数据。响应格式通常是JSON，错误处理也很重要。示例展示了使用Flask创建图书管理API，包括版本控制、文档化、安全性和性能优化是最佳实践。这样的API使数据交互更顺畅。
东方睿赢
92 2
土木林森
|
4天前
|
安全 数据库 开发者
Python Web开发：Django框架下的全栈开发实战
【10月更文挑战第26天】本文详细介绍了如何在Django框架下进行全栈开发，包括环境安装与配置、创建项目和应用、定义模型类、运行数据库迁移、创建视图和URL映射、编写模板以及启动开发服务器等步骤，并通过示例代码展示了具体实现过程。
土木林森
21 2

热门文章

最新文章

  • 1
    什么是云盾Web应用防火墙？阿里云服务器如何接入云盾Web应用防火墙？
  • 2
    HTML5 Web Workers
  • 3
    wifi的web 认证。
  • 4
    探讨 使用GWT 做一个web游戏。如何设计一个web游戏。
  • 5
    WEB应用数据验证指南
  • 6
    struts2获取web元素的方式和方法
  • 7
    IIS 7.5 Express 让Web 应用程序开发工作变得简单、顺畅
  • 8
    CDP中使用YARN Web UI和CLI
  • 9
    web worker 是运行在后台的 JavaScript，不会影响页面的性能。
  • 10
    eclipse 发布web工程，修改tomcat端口
  • 1
    如何在本地安装Flask并将其web界面发布到公网上远程访问协同开发
    289
  • 2
    python flask服务如何注册到nacos
    286
  • 3
    盘点Flask与数据库的交互插件——Flask-Sqlalchemy
    94
  • 4
    盘点Python网页开发轻量级框架Flask知识
    106
  • 5
    使用Python的Flask框架开发验证码登录功能
    143
  • 6
    Python项目开发：Flask基于Python的天气数据可视化平台
    212
  • 7
    使用Python和Flask构建简单的博客后端
    75
  • 8
    构建高效Python Web应用：Flask框架与RESTful API设计实践
    794
  • 9
    python flask 使用 redis 写一个例子给我
    147
  • 10
    Python 潮流周刊#18：Flask、Streamlit、Polars 的学习教程
    106

    • 相关课程

    更多
  • Python Web 框架 Flask 快速入门
  • Python Web开发基础
  • Python爬虫实战
  • Python开发基础入门
  • Python常用数据科学库
  • Python网络爬虫实战

    • 相关电子书

    更多
  • From Python Scikit-Learn to Sc
  • Data Pre-Processing in Python:
  • 双剑合璧-Python和大数据计算平台的结合

    • 相关实验场景

    更多
  • 搭建Java Web开发环境
  • Internet Information Services（IIS）部署Web项目
  • Python新手入门
  • Python入门
  • 零基础部署一个Django Blog到Serverless架构
  • WEB网页编程实战

    • 推荐镜像

    更多
  • python-release
  • nodejs-release
  • linuxmint-packages
    • 下一篇
    阿里云无影云电脑免费试用，最长可试用3个月