Skip to content

这是一个软件分发网站项目,采用前后端合并的方式开发。前端使用 React (TypeScript, Vite) 提供文件上传和列表功能,支持文件分类(应用、操作系统、架构)和动态选项联动。后端使用 Express (TypeScript) 处理文件上传 (使用 Multer,支持多级目录) 和下载,并提供文件列表接口。包含简单的基本认证。项目提供了 README 文档、部署说明以及开发脚本,结构上将配置、路由和组件进行了模块化划分。

License

Notifications You must be signed in to change notification settings

sihuangtech/sk-app-distribution

Repository files navigation

彩旗软件分发平台

这是一个基于现代Web技术栈构建的软件分发平台,为开发者提供便捷的应用包上传、管理和分发服务。平台支持多种操作系统和架构的安装包管理,并提供安全的用户认证和文件下载,以及灵活的配置管理和文件分类筛选功能。

技术栈

后端技术

  • Node.js - 运行时环境
  • Express.js - Web应用框架
  • TypeScript - 类型安全的JavaScript超集
  • Multer - 文件上传中间件
  • jsonwebtoken - JWT身份认证
  • js-yaml - YAML配置文件解析
  • CORS - 跨域资源共享支持
  • stream-throttle - 下载速度限制

前端技术

  • React - 用户界面库
  • TypeScript - 类型安全开发
  • React Router - 单页应用路由管理
  • Vite - 现代化构建工具和开发服务器
  • CSS3 - 现代化样式设计

开发工具

  • ES6 Modules - 现代模块系统
  • PM2 - 生产环境进程管理
  • Nginx - 反向代理和静态文件服务

核心功能

  • 🔐 JWT身份认证 - 安全的用户登录和会话管理
  • 📁 应用管理 - 创建、查看和管理应用项目
  • ⬆️ 文件上传 - 支持多种格式和平台架构的安装包上传,支持上传限制配置
  • 📋 文件列表 - 查看、搜索和筛选已上传的文件
  • 🔗 下载链接 - 自动生成简洁安全的下载链接,支持下载速度限制
  • 🎨 现代化UI - 响应式设计,支持多设备访问,提供友好的操作界面
  • ⚙️ 配置化部署 - 通过YAML文件统一管理配置,支持在线修改系统设置
  • 🚀 生产就绪 - 支持PM2和Nginx生产环境部署,优化性能和稳定性
  • 文件分类筛选 - 根据应用、操作系统、架构、版本类型进行多维度筛选
  • 🛠️ 系统设置管理 - 通过Web界面动态配置网站信息、上传和下载限制
  • 📊 版本信息监控 - 实时显示项目版本、运行环境、启动时间和运行模式等系统信息

项目结构

  • server.ts: 后端 Express 服务器,处理文件上传、下载和API请求。
  • index.html: 前端应用的入口文件。
  • src/main.tsx: React 应用的主入口。
  • src/App.tsx: 包含主应用界面和路由配置的 React 组件。
  • src/components/: 包含各种可复用 React 组件的目录。
  • src/pages/: 包含主要页面组件的目录。
  • src/routes/: 后端 Express 路由处理函数目录。
  • src/utils/: 工具函数目录,包含配置读取、事件总线等。
  • src/styles/: 样式文件目录。
  • uploads/: 上传的文件将存储在此目录。
  • data/: 存储应用信息 (apps.json) 和文件元数据 (file-metadata.json)。
  • config.yaml: 配置文件,包含服务器端口、管理员账号、网站信息、上传和下载限制(必须配置)
  • vite.config.ts: Vite配置文件,用于前端构建和开发服务器。
  • docs/: 部署文档目录,包含详细的部署指南。

开发环境准备

请确保你已经安装了 Node.js 和 npm。

安装依赖

在项目根目录下运行以下命令安装所有依赖:

npm install

配置设置

在运行项目前,请先从 config.yaml.example 文件复制一份到 config.yaml,然后配置 config.yaml 文件。所有系统配置都在此文件中统一管理:

# 服务器端口配置
server:
  backend_port: 4009
  frontend_port: 3009
  frontend_url: https://your-domain.com  # 前端访问URL,用于生成下载链接等
  backend_url: https://your-domain.com  # 后端API访问URL,用于前端API请求

# 网站信息配置
website:
  domain: https://your-domain.com # 网站域名,用于生成完整的下载链接
  title: 彩旗软件分发平台 # 网站标题
  description: 为开发者提供便捷的应用包上传、管理和分发服务 # 网站描述

# 文件上传限制配置
upload:
  max_file_size: 5120 # 最大文件大小,单位:MB
  allowed_extensions:
    - .exe
    - .msi
    - .dmg
    - .pkg
    - .deb
    - .rpm
    - .appimage
    - .apk
    - .ipa
    - .hap
    - .zip
    - .tar.gz
    - .7z
  max_files_per_app: 10000 # 每个应用允许的最大文件数量

# 文件下载配置
download:
  speed_limit_kbps: 0 # 下载速度限制,单位:KB/s,0表示不限制

# 管理员账号配置
admin:
  username: your_admin_username # 请替换为你的管理员用户名
  password: your_admin_password # 请替换为你的管理员密码
  sessionDuration: 30 # 登录有效期(天数)

# JWT认证配置
jwt:
  secret: your_jwt_secret_key_here # 请替换为你的JWT密钥,务必修改为一个复杂且安全的字符串!

# 地理信息配置
geolocation:
  enabled: true # 是否启用IP地理信息查询功能
  api_provider: ipapi # 地理信息API提供商:ipapi, ipstack, ipgeolocation, ip2location
  api_key: '' # API密钥 (ipapi免费,无需密钥,其他需要)
  cache_duration: 86400 # 地理信息缓存时长,单位:秒 (默认24小时,即86400秒)

⚠️ 重要:在运行项目前,必须先配置 config.yaml 文件。所有关键配置(包括端口、管理员账号、JWT密钥)都在此文件中统一管理。

重要说明

  • 前后端端口完全从 config.yaml 文件读取,代码中无任何硬编码端口
  • 前端通过Vite代理自动转发API请求到后端端口
  • 生产环境和开发环境统一使用相对路径
  • 修改配置只需更新配置文件或在设置页面修改,无需修改代码
  • 如果配置文件缺失、格式错误或关键配置项缺失,服务器将拒绝启动

运行项目

推荐使用以下命令同时启动后端服务器和前端开发服务器:

npm run dev

这将同时启动后端服务器和前端应用,端口均从配置文件读取。

你也可以单独启动后端或前端:

  1. 启动后端服务器:
npm start
  1. 启动前端开发服务器:
npm run frontend-dev

功能说明

  • 用户登录: 开发者需要使用 config.yaml 中配置的管理员账号登录才能使用平台。会话有效期为配置的天数(默认30天)。
  • 应用管理: 可以创建、查看和管理应用,每个应用可以上传多个版本的安装包。
  • 文件上传: 登录后可以通过上传页面选择应用并上传安装包。支持通过设置页面配置最大文件大小、允许的扩展名以及每个应用的最大文件数量。
  • 文件管理: 在"已上传应用"页面查看、搜索和按应用、操作系统、架构、版本类型对已上传的文件进行多维度筛选。支持复制下载链接和删除文件。
  • 文件下载: 提供简洁的下载链接,支持通过设置页面配置下载速度限制(单位:MB/s)。
  • 下载统计: 详细的下载统计功能,包括文件下载次数、下载历史记录、IP地理信息显示等。支持按时间、文件类型等多维度筛选。
  • 地理信息: 可选的IP地理信息显示功能,支持多个API提供商(IP-API、IPStack、IPGeolocation),智能缓存减少API调用。
  • 系统设置: 提供Web界面 /settings,管理员登录后可以动态查看和修改网站信息、文件上传限制、下载速度限制和地理信息配置。配置修改实时生效。
  • 版本信息: 在设置页面底部显示详细的系统版本信息,包括项目版本、Node.js版本、前后端框架版本、服务启动时间和运行模式(开发/生产),以2行4列布局展示。
  • 动态配置: 前后端通过读取 config.yaml 实现动态配置,无需硬编码。

页面导航

  • /upload:文件上传界面,支持新建应用和选择现有应用上传文件。
  • /apps:应用管理页面,查看和管理应用列表。
  • /stats:下载统计页面,查看下载统计概览、文件统计和下载历史记录(需要登录)。
  • /settings:系统设置页面,管理网站、上传、下载和地理信息配置(需要登录)。
  • /list:已上传文件列表页面,查看、筛选和管理文件(已合并到 /apps 页面)。

应用管理

新建应用

  1. 在上传页面或应用管理页面点击"新建应用"按钮
  2. 填写应用信息:
    • 应用名称:用于内部标识,只能包含字母、数字、下划线和连字符
    • 显示名称:用户看到的应用名称
    • 应用描述:可选,简要描述应用功能
  3. 点击"创建应用"完成创建

应用数据存储

  • 应用信息存储在 data/apps.json 文件中
  • 支持应用的增删查改操作
  • 每个应用包含唯一ID、名称、显示名称、描述和创建时间
  • 文件元数据存储在 data/file-metadata.json 文件中,包含原始文件名、系统文件名、所属应用、平台信息、上传时间等。

注意事项

  • 请确保在生产环境中使用强密码并定期更换。
  • 建议在生产环境中使用 HTTPS 协议。
  • 所有关键配置统一在 config.yaml 中管理,或通过设置页面修改。

项目部署

详细的部署指南请参考:部署文档

About

这是一个软件分发网站项目,采用前后端合并的方式开发。前端使用 React (TypeScript, Vite) 提供文件上传和列表功能,支持文件分类(应用、操作系统、架构)和动态选项联动。后端使用 Express (TypeScript) 处理文件上传 (使用 Multer,支持多级目录) 和下载,并提供文件列表接口。包含简单的基本认证。项目提供了 README 文档、部署说明以及开发脚本,结构上将配置、路由和组件进行了模块化划分。

Resources

License

Stars

Watchers

Forks

Packages

No packages published