# ftperWeb

**Repository Path**: masaikk/ftper-web

## Basic Information

- **Project Name**: ftperWeb
- **Description**: ftper文件阅读器的网页版
- **Primary Language**: TypeScript
- **License**: WTFPL
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 3
- **Forks**: 0
- **Created**: 2022-10-16
- **Last Updated**: 2025-12-25

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# ftperWeb

#### 介绍
ftper文件阅读器的网页版。

#### 软件架构
使用了vue3和django。

主要是将图片的信息存到数据库，然后由django管理ORM将信息发给前端，前端使用响应式渲染这些图片。

经过图片压缩后，加载速度明显改善。

服务器是Azure白嫖的，加载慢请忍一忍。

使用nextjs写了一个服务端上传的后台，正在调试中。

#### 安装教程

1. clone 本项目。
2. 在根页面进入到ftper-web，安装依赖`yarn`或者`npm install`。再运行连接本地后台的后端`npm run dev:loc`。
3. 在根页面进入到后端的ftper，安装相关依赖比如说是django,django-cors-headers,django-simpleui。再运行`python manage.py runserver`。
4. 打开前端页面查看文件，使用点赞，精选等功能将社区变好！

#### 使用说明

1. 与项目负责人联系获取url和密码。
2. 如果您有好的想法，欢迎提issue或者PR。
3. 如果有资源的加载问题，请联系网站负责人。


#### 部署说明
##### 前端部分
使用vite进行打包，在ftp-web文件夹下运行命令`npm run build`进行打包。可以在打包之后使用vite的preview功能，即运行`npm run preview`命令查看打包之后的页面。
在部署上，我们使用了docker的nginx进行部署，首先登录服务器，再将文件部署到nginx容器里面的html文件夹里面使得ngnix能够代理index.html文件。
最后重启nginx容器。`docker stop ID`以及`docker start ID`。

##### 前端目录
ftper-web
├── public                     // 公共文件
│   └── favicon.ico            // favicon图标
├── src                        // 源代码
│   ├── api                    // 所有请求
│   ├── assets                 // 主题 字体等静态资源
│   ├── components             // 全局公用组件
│   ├── pages                  // 页面级组件
│   ├── router                 // 路由
│   ├── store                  // 全局store管理
│   ├── theme                  // 自定义主题
│   ├── types                  // 类型定义 
│   ├── utils                  // 全局公用方法
│   ├── App.vue                // 入口页面
│   ├── env.d.ts               // 定义全局环境变量的类型
│   └── main.ts                // 入口 加载组件 初始化等
├── .env                       // 全局环境变量
├── .env.loc                   // 开发环境配置
├── .env.rem                   // 生产环境配置
├── .gitignore                 // git 忽略项
└── package.json               // package.json

##### 后端部分
由于本项目还在开发阶段，所以我们暂时不考虑uWSGI部署，直接使用tmux托管terminal，再使用Django的runserver运行后端，注意ip的广播和端口映射。

##### 后端目录
ftper
├── ftper            // 包含项目级别的文件和配置
│   ├── \_\_init\_\_.py  // 告诉 Python 这是一个包
│   ├── asgi.py      // ASGI 入口点
│   ├── settings.py  // 配置信息
│   ├── urls.py      // URL 配置
│   └── wsgi.py      // WSGI 入口点
│
├── server           // 业务app
│   ├── migrations   // 管理数据库迁移
│   ├── \_\_init\_\_.py  // 告诉 Python 这是一个包
│   ├── admin.py     // 管理员配置
│   ├── apps.py      // app配置
│   ├── config.py    // 全局变量
│   ├── models.py    // 模型定义
│   ├── tests.py     // 测试代码
│   ├── urls.py      // URL 配置
│   ├── utils.py     // 工具函数
│   └── views.py     // 视图函数
│
├── user             // 用户app
│   ├── migrations   // 管理数据库迁移
│   ├── \_\_init__.py  // 告诉 Python 这是一个包
│   ├── admin.py     // 管理员配置
│   ├── apps.py      // app配置
│   ├── models.py    // 模型定义
│   ├── tests.py     // 测试代码
│   ├── urls.py      // URL 配置
│   └── views.py     // 视图函数
│
├── .gitignore       // git 忽略项
├── manage.py        // 运行项目的各种管理命令
└── requirements.txt // 项目所需 Python 软件包, 版本