# upload-tools

**Repository Path**: lihongyao/upload-tools

## Basic Information

- **Project Name**: upload-tools
- **Description**: 上传图片小工具
- **Primary Language**: JavaScript
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2021-12-08
- **Last Updated**: 2023-03-21

## Categories & Tags

**Categories**: Uncategorized

**Tags**: 文件上传, 工具

## README

# Li-HONGYAO'S Upload-Tools

 ![](https://qn.d-dou.com/dcep/dbean/3f48e7f9aeb8470992de109c9c69c57ejredas.gif)

## 1. 概述
在实际开发过程中，对于一些体积比较大的图片，我们一般选择上传至CDN或者服务器中通过链接访问，而不会存放在本地（这样会增加项目体积，影响加载速度）。

由于工作中，每次上传都需要把图片甩给后端操作，非常不方便，而且会消耗后端人员不必要的开发时间。作为一个合格的程序员，闲暇之余特开发此文件上传的小工具使用。这样自己想上传的时候直接上传即可。

当然，为了规范不同项目的存储目录，所以在上传前需选择对应的项目（当然如果只是一个独立项目的管理，则不需求）。

## 2. 技术实现

本示例使用 HTML + CSS + JS + jQuery开发。

目录结构：

```
Upload-tools
.
├── css
│	└──	index.css    # 样式文件
├── images           # 静态图片，如 logo
├── js
│   ├── constants.js # 常量定义 
│   ├── index.js     # 脚本主文件
│	└──	utils.ts     # 工具函数文件，封装上传、剪贴板、登录等方法
├── mockindex.html
└── REAME.md
```

## 3. 如何借鉴

本着开源/共享精神，分享此代码，大家可以自行下载demo示例根据需要修改。

**如何借鉴**：

1）查看 `js/constants.js` 文件，根据需要修改常量定义；

2）查看 `js/utils.js` 文件，根据需要修改并调用；

**特别提示：**

> - 使用者自行根据需要选择上传类型（七牛云/阿里云/腾讯云/天翼云），这些账号需自行准备。
> - 鉴于考虑到公司服务器压力，本示例中登录接口所用到的账号/密码已删除。所以本示例在演示上传时会提示 “上传失败，请重新上传~”。
> - 示例demo只供大家参考
## 4. 更多开源工具
- https://www.npmjs.com/~lihongyao