如何为我的服务器制作一个简易的文件上传页面？

直接用原生技术栈实现，无需引入Uppy等复杂第三方工具，全程仅需2个文件即可跑通：

1. 前端页面代码（index.html） #

纯原生HTML编写，无需额外依赖：

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>文件上传</title>
</head>
<body>
    <h1>上传文件到服务器</h1>
    <form id="uploadForm" enctype="multipart/form-data">
        <input type="file" id="fileInput" name="upload_file" required>
        <button type="submit">上传</button>
        <p id="tip"></p>
    </form>
    <script>
        const form = document.getElementById('uploadForm');
        const tip = document.getElementById('tip');
        form.addEventListener('submit', async (e) => {
            e.preventDefault();
            const formData = new FormData(form);
            try {
                const res = await fetch('/upload', {
                    method: 'POST',
                    body: formData
                });
                if (res.ok) {
                    tip.textContent = '上传成功！';
                    tip.style.color = 'green';
                } else {
                    tip.textContent = '上传失败，请重试';
                    tip.style.color = 'red';
                }
            } catch (err) {
                tip.textContent = '网络错误，请检查服务是否正常启动';
                tip.style.color = 'red';
            }
        })
    </script>
</body>
</html>

2. 后端服务代码（app.py，Python+Flask实现） #

仅需十几行代码即可实现文件接收存储：

from flask import Flask, request, send_from_directory
import os

app = Flask(__name__)
# *修改此处为你服务器上要存储文件的指定文件夹绝对路径*
UPLOAD_FOLDER = '/path/to/your/target/folder'
# 可自行修改允许上传的最大文件大小，此处为100MB
app.config['MAX_CONTENT_LENGTH'] = 100 * 1024 * 1024
os.makedirs(UPLOAD_FOLDER, exist_ok=True)

# 访问根路径直接返回上传页面
@app.route('/')
def index():
    return send_from_directory('.', 'index.html')

# 处理上传请求
@app.route('/upload', methods=['POST'])
def upload_file():
    if 'upload_file' not in request.files:
        return '无上传文件', 400
    file = request.files['upload_file']
    if file.filename == '':
        return '未选择文件', 400
    if file:
        file.save(os.path.join(UPLOAD_FOLDER, file.filename))
        return '上传成功', 200

if __name__ == '__main__':
    # 0.0.0.0代表允许所有IP访问，端口可自行修改
    app.run(host='0.0.0.0', port=8080, debug=False)

3. 运行步骤 #

• 服务器上先安装Python，执行pip install flask安装依赖
• 将上面两个文件放到服务器同一目录下，修改app.py里的UPLOAD_FOLDER为你实际要存文件的路径
• 执行python app.py启动服务
• 访问服务器IP加端口8080即可使用上传功能

注意事项 #

• 如需对外正式使用，建议添加文件类型校验、重命名防覆盖、用户鉴权等逻辑，避免安全风险
• 服务器对应端口需在防火墙/安全组中放通，否则无法正常访问

内容的提问来源于stack exchange，提问作者Zipzap829