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

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

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

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

目录结构：

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

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

如何借鉴：

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

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

特别提示：

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

• https://www.npmjs.com/~lihongyao