「手机秒变照片传送门!使用 Flask 打造你的个人云相册!」

目录

简介:

源代码:

服务端:

服务端源代码说明:

web端源代码:

web端源代码说明:

效果如下所示:


简介:

这个应用可以应用到很多场景中,比如:

扫描二维码关注公众号,回复: 14665153 查看本文章
  1. 个人云相册:用户可以通过该应用将自己手机中的照片上传到云端,随时随地浏览自己的相片。

  2. 家庭相册:家庭成员可以将自己的照片上传到同一个云端相册,方便分享和查看。

  3. 团队协作:团队成员可以将工作相关的照片上传到云端,方便团队成员共享和查看。

  4. 活动相册:活动主办方可以将活动相关的照片上传到云端相册,供参与者查看和分享。

总之,该应用可以方便用户上传、存储、分享和浏览照片,适用于各种需要管理大量照片的场景。

源代码:

服务端:

from flask import Flask, render_template, request, redirect, url_for
from gevent import pywsgi
import os


app = Flask(__name__)

# 设置上传文件的保存目录
app.config['UPLOAD_FOLDER'] = './uploads'

# 允许上传的文件类型
ALLOWED_EXTENSIONS = {'jpg', 'jpeg', 'png', 'gif'}

# 检查文件是否是允许的类型
def allowed_file(filename):
    return '.' in filename and filename.rsplit('.', 1)[1] in ALLOWED_EXTENSIONS

@app.route('/')
def index():
    return render_template('index2.html')

@app.route('/upload', methods=['POST'])
def upload():
    # 获取上传的文件
    file = request.files['file']
    if file and allowed_file(file.filename):
        # 保存文件到指定目录
        filename = file.filename
        file.save(os.path.join(app.config['UPLOAD_FOLDER'], filename))
        return '文件上传成功!'
    else:
        return '只允许上传以下类型的文件:{}。'.format(', '.join(ALLOWED_EXTENSIONS))

if __name__ == '__main__':
    server = pywsgi.WSGIServer(('192.168.1.11', 5000), app)
    server.serve_forever() 
    app.run()

服务端源代码说明:

在这个示例中,我们使用了Flask框架创建了一个基本的Web程序,包括一个主页和一个上传接口。我们设置了上传文件的保存目录为./uploads,并指定了允许上传的文件类型为jpgjpegpnggif。当用户上传文件时,我们使用request.files获取上传的文件,并检查文件是否是允许的类型。如果文件符合要求,我们就将其保存到指定的目录中。

web端源代码:

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>上传照片</title>
</head>
<body>
    <form action="{
   
   { url_for('upload') }}" method="post" enctype="multipart/form-data">
        <input type="file" name="file">
        <input type="submit" value="上传">
    </form>
</body>
</html>

web端源代码说明:

 您还需要在templates目录中创建一个名为index.html的模板文件,作为Web程序的主页。以下是一个基本的示例代码:

在这个示例中,我们创建了一个表单,允许用户上传照片。表单的action属性指向我们在Flask应用程序中定义的上传接口,method属性设置为POSTenctype属性设置为multipart/form-data。在表单中,我们使用input元素的type="file"属性允许用户选择文件进行上传,使用input元素的type="submit"属性创建一个提交按钮。

效果如下所示:

 

 

 

猜你喜欢

转载自blog.csdn.net/winniezhang/article/details/129426656