不用数据库的多用户文件自由上传投票系统(1)

yizhihongxing

下面是详细讲解“不用数据库的多用户文件自由上传投票系统(1)”的完整攻略。

系统简介

本系统是一个基于Flask框架开发的多用户投票系统,完全不依赖于数据库,所有数据都以文件的形式存储在本地。用户可以自由上传图片或视频、创建投票项目,其它用户可以对项目进行投票和评论。

系统架构

系统主要分为三个部分:

  • 用户管理模块
  • 文件上传模块
  • 投票模块

技术栈

  • Python 3.7
  • Flask 1.1.2
  • Bootstrap 4.5.0

准备工作

  1. 安装Python和Flask

本系统的开发需要使用Python和Flask框架,请确保你已经安装了Python3.X.x版本,然后使用pip命令安装Flask框架。

pip install Flask
  1. 创建项目结构

使用下面的命令创建项目目录:

mkdir flask-vote && cd flask-vote
mkdir static templates upload
touch app.py

创建的目录结构如下:

.
├── app.py
├── static
├── templates
└── upload
  1. 初始化Flask应用

app.py文件中编写Flask应用初始化代码:

from flask import Flask

app = Flask(__name__)
app.config['UPLOAD_FOLDER'] = 'upload'
app.config['ALLOWED_EXTENSIONS'] = {'png', 'jpg', 'jpeg', 'gif', 'mp4'}

我们需要配置文件上传目录和允许上传的文件类型。

  1. 编写用户管理模块

在Flask应用中编写用户管理模块代码,实现用户注册、登录和注销功能:

from flask import render_template, request, redirect, session

@app.route('/register', methods=['GET', 'POST'])
def register():
    if request.method == 'POST':
        # 处理用户提交的注册请求
        username = request.form['username']
        password = request.form['password']
        confirm = request.form['confirm']
        if password != confirm:
            return '两次输入的密码不一致'
        session[username] = password
        return '注册成功'
    # 显示注册页面
    return render_template('register.html')

@app.route('/login', methods=['GET', 'POST'])
def login():
    if request.method == 'POST':
        # 处理用户提交的登录请求
        username = request.form['username']
        password = request.form['password']
        if session.get(username) == password:
            session['username'] = username
            return '登录成功'
        else:
            return '用户名或密码错误'
    # 显示登录页面
    return render_template('login.html')

@app.route('/logout')
def logout():
    session.pop('username', None)
    return redirect('/')

上面的代码实现了用户注册、登录和注销功能,使用Flask的Session来存储用户信息。

  1. 编写文件上传模块

在Flask应用中编写文件上传模块代码,实现文件上传和预览功能:

import os
from flask import send_from_directory, redirect, url_for

def allowed_file(filename):
    return '.' in filename and \
           filename.rsplit('.', 1)[1].lower() in app.config['ALLOWED_EXTENSIONS']

@app.route('/upload', methods=['GET', 'POST'])
def upload():
    if 'username' not in session:
        return redirect(url_for('login'))
    if request.method == 'POST':
        # 处理用户提交的文件上传请求
        file = request.files['file']
        if file and allowed_file(file.filename):
            filename = secure_filename(file.filename)
            file.save(os.path.join(app.config['UPLOAD_FOLDER'], filename))
            return redirect('/')
    # 显示文件上传页面
    return render_template('upload.html')

@app.route('/uploads/<filename>')
def uploaded_file(filename):
    return send_from_directory(app.config['UPLOAD_FOLDER'],
                               filename)

上面的代码实现了文件上传和预览功能。

  1. 编写投票模块

在Flask应用中编写投票模块代码,实现投票和评论功能:

votes = []

@app.route('/', methods=['GET', 'POST'])
def vote():
    if request.method == 'POST':
        # 处理用户提交的投票请求
        vote_id = request.form['vote_id']
        option_id = request.form['option_id']
        for vote in votes:
            if vote['id'] == vote_id:
                for option in vote['options']:
                    if option['id'] == option_id:
                        option['count'] += 1
                        break
                break
        return redirect('/')
    # 显示投票页面
    return render_template('vote.html', votes=votes)

@app.route('/vote/<vote_id>', methods=['GET', 'POST'])
def show_vote(vote_id):
    if request.method == 'POST':
        # 处理用户提交的评论请求
        comment = request.form['comment']
        for vote in votes:
            if vote['id'] == vote_id:
                vote['comments'].append(comment)
                break
        return redirect('/vote/' + vote_id)
    # 显示投票详细页面
    for vote in votes:
        if vote['id'] == vote_id:
            return render_template('vote_detail.html', vote=vote)
    return '投票项目不存在'

def init_votes():
    vote = {
        'id': '1',
        'title': '投票项目 1',
        'description': '这是一个演示用的投票项目',
        'options': [
            {'id': '1', 'title': '选项 1', 'count': 0},
            {'id': '2', 'title': '选项 2', 'count': 0},
            {'id': '3', 'title': '选项 3', 'count': 0},
        ],
        'comments': []
    }
    votes.append(vote)

init_votes()

上面的代码实现了投票和评论功能,投票数据保存在内存中。

示例

下面是两个示例:

示例一

  1. 打开浏览器,进入系统主页(http://localhost:5000)。
  2. 点击“注册”按钮,填写用户名、密码和确认密码,点击“注册”按钮。
  3. 点击“上传”按钮,选择一张图片并上传。
  4. 在主页上,点击“投票”按钮,选择一项进行投票。
  5. 在主页上,点击“查看”按钮,查看投票结果和评论。

示例二

  1. 打开浏览器,进入系统主页(http://localhost:5000)。
  2. 点击“注册”按钮,填写用户名、密码和确认密码,点击“注册”按钮。
  3. 在主页上,点击“上传”按钮,选择一个视频并上传。
  4. 在主页上,点击“投票”按钮,选择一项进行投票。
  5. 在主页上,点击“查看”按钮,查看投票结果和评论。

本站文章如无特殊说明,均为本站原创,如若转载,请注明出处:不用数据库的多用户文件自由上传投票系统(1) - Python技术站

(0)
上一篇 2023年6月10日
下一篇 2023年6月10日

相关文章

  • CSS如何对齐文本框和其旁边的图像按钮比如搜索框等等

    在 CSS 中,我们可以使用多种方法来对齐文本框和其旁边的图像按钮,例如搜索框等。下面是完整攻略,包含了如何使用 CSS 实现对齐的过程和两个示例说明。 CSS 实现对齐文本框和其旁边的图像按钮 步骤一:使用 display:inline-block 属性 我们可以使用 display:inline-block 属性来对齐文本框和其旁边的图像按钮。例如: &…

    css 2023年5月18日
    00
  • H5移动端适配 Flexible方案

    H5移动端适配 Flexible方案是目前比较流行的一种移动端适配方案,以下是完整攻略: 一、什么是Flexible方案 Flexible方案是一种基于JavaScript的解决方案,它利用了浏览器的缩放特性,在页面加载的时候动态改变HTML文档的font-size属性,从而实现页面的自适应调整。 二、Flexible方案的具体实现 创建一个基准值变量并计算…

    css 2023年6月10日
    00
  • css中间自适应布局的5种解法详解

    在CSS中,实现中间自适应布局是一种常见的需求。以下是五种实现中间自适应布局的方法,包括两个示例说明: 1. 使用flexbox布局 使用flexbox布局是一种简单的方法,可以实现中间自适应布局。可以将左侧和右侧的元素设置为固定宽度,将中间的元素设置为flex-grow属性,以填充剩余的空间。例如: <div class="containe…

    css 2023年5月18日
    00
  • Python pyecharts数据可视化实例详解

    Python pyecharts数据可视化实例详解 一、背景介绍 随着数据科学和人工智能的快速发展,数据可视化成为数据分析和决策制定的关键。Python是一个强大的编程语言,有很多数据可视化的工具和库可以使用,而pyecharts是其中的一款非常流行的工具。本文将介绍pyecharts的基本用法和两个实例说明。 二、pyecharts基本用法 1.安装pye…

    css 2023年6月9日
    00
  • Vue记住滚动条和实现下拉加载的完美方法

    Vue是一款非常流行的前端开发框架,可以通过它来构建高效、响应式的单页面应用。下面就介绍“Vue记住滚动条和实现下拉加载的完美方法”的完整攻略。 记住滚动条位置 有时候在用户通过页面滚动操作访问页面时,为了用户体验,我们需要保留滚动条的位置。比如,在用户查看一篇文章的时候,如果用户点击了文章内容中的链接,跳转到新的页面中,当用户点击浏览器后退按钮返回到原来的…

    css 2023年6月10日
    00
  • 新版chrome浏览器设置允许跨域的实现

    略 I.前言: 在前端开发过程中,我们会遇到跨域问题,一些浏览器设置默认是不允许跨域的。Chrome浏览器是目前使用人数最多的浏览器,由于chrome浏览器的更新迭代比较频繁,所以每个版本的设置有所不同,我的系统是macOSBig Sur10.15.7,Chrome版本为94.0.4606.61,本文详细讲解该版本Chrome浏览器设置允许跨域的三种实现方式…

    css 2023年6月9日
    00
  • jquery+css实现侧边导航栏效果

    下面我就来详细讲解“jquery+css实现侧边导航栏效果”的攻略。 1. 准备工作 首先需要准备的是jquery和css文件。可以通过相应的CDN链接或者下载文件到本地。 2. HTML结构 侧边导航栏的HTML结构主要包括两个部分:导航栏头部和导航栏内容。可以通过以下示例粘贴到HTML代码中: <div class="nav-header…

    css 2023年6月10日
    00
  • 移动端布局之动态rem的实现

    移动端布局是现在Web前端开发的重要一环,其中动态rem是解决移动端适配的好方法之一。下面是基本的实现步骤: 1. 设置页面的viewport 首先在HTML文档的head标签中设置viewport,这样才能正确显示在移动设备上: <meta name="viewport" content="width=device-wi…

    css 2023年6月9日
    00
合作推广
合作推广
分享本页
返回顶部