基于Vue2.x全家桶、Sass预处理器,使用了三端适配、并发控制、大文件分块上传、weinre 真机调试等技术,实现了一个文件共享系统。
项目展示地址:http://wefile.leichenlong.com/
- 对于跨域的解决
- 发送一般请求部分,前端开发时使用webpack devSever 通过before 编写node 代理,上线通过nginx 代理转发。
- 发送文件上传/下载请求部分,通过跨域资源共享(CORS)解决。并使用JWT,解决认证问题。
- 对于文件上传
- 使用 localStorage 完成自动登录功能
- 通过URL 的query,解决面包屑导航
- weinre 真机调试
- 使用动态import,创建多个不同的前端开发场景(正常/尝试前后端联调/真机调试)
- 三端适配
- 暂停和取消文件上传/下载
- 报错重传(demo中已经实现)
- 视频音频的在线播放
- ......
- npm run init // 安装依赖(目前只安装前台依赖)
- npm run dev:front // 运行前台的开发环境
- npm run dev:admin // 运行后台的开发环境
- npm run gulp:front // 构建前台的生产环境
- npm run gulp:admin // 构建后台的生产环境
- npm run gulp:all // 同时构建前后台的生产环境
- cd ./we-file
- npm install // 安装前台的依赖
- npm run serve // 构建前台的开发环境
- npm run build // 构建前台的生产环境
- cd ./we-file-admin
- npm install // 安装后台的依赖
- npm run serve // 构建后台的开发环境
- npm run build // 构建后台的生产环境