el-upload上传文件 前后端_gomyck-fastdfs-spring-boot-starter fastDFS文件服务客户端

完美集成fastDFS文件服务客户端, 支持断点续传, 分块上传, 文件秒传, 稳定的前后端组件(前端H5), 支持多用户并发上传文件校验(文件锁), 可以快速集成fastDFS文件服务, 免去繁琐的配置, 拿来即用, 目前暂时仅支持springboot开发环境

开始使用

一.环境配置

1.在pom文件中加入仓库地址: (后续会有maven中央仓库版本发布)

gomyck-repoGomyck proxy Alihttp://nexus.gomyck.com/nexus/content/repositories/gomyck-repo/gomyck-repo-snapshotGomyck proxy Ali Snapshothttp://nexus.gomyck.com/nexus/content/repositories/gomyck-repo-snapshot/truealways

2.在pom文件中加入依赖:

com.gomyck gomyck-fastdfs-spring-boot-starter 1.0.2-SNAPSHOT

3.编辑yml文件(以下为全量配置):

#单个文件上传大小限制spring: servlet: multipart: max-file-size: 5000MB#fastdfs客户端配置fdfs: connect-timeout: 1601 thumb-image: width: 150 height: 150 pool: jmx-name-prefix: 1 jmx-name-base: 1 max-wait-millis: 102 tracker-list:  - 192.168.1.1:22122 #fastdfs服务地址 so-timeout: 1501pool: max-total: 153gomyck: config: redis: true #是否使用redis存储文件上传信息以及上传锁 redis: host: 127.0.0.1  password: xxxxx port: 6379 fastdfs: #fastdfs上传配置 chunk-size: 5 #分块大小, 上传文件分块的大小 单位: MB download-chunk-size: 100 #分块下载大小 单位: byte group-id: group1 #fastdfs的组, 文件会被存到这个组下 file-server-protocol: http #远程文件服务连接协议 file-server-url: 192.168.1.196 #远程文件服务连接地址

4.在静态资源映射表中加入以下配置

@Configurationpublic class config extends WebMvcConfigurationSupport { @Override protected void addResourceHandlers(ResourceHandlerRegistry registry) { registry.addResourceHandler("ck-fastdfs/**").addResourceLocations("classpath:/META-INF/resources/ck-fastdfs/"); registry.addResourceHandler("ck-util/**").addResourceLocations("classpath:/META-INF/resources/ck-util/"); registry.addResourceHandler("ck-3pty/**").addResourceLocations("classpath:/META-INF/resources/ck-3pty/"); super.addResourceHandlers(registry); }}

5.启动服务, 访问示例页面: host{:port}/{contextPath/}ck-fastdfs/view/ckFastDFS.html (可以渲染表示环境配置成功)

二.开发文档

本项目后端服务不在文档说明范围内, 高玩可以自行阅读修改, 只针对前端JS的使用做说明注释

1.在需要开发文件上传的页面(你的业务页面), 引入js:

host{:port}/{contextPath/}/ck-3pty/jquery/jquery-core.min.js

host{:port}/{contextPath/}/ck-fastdfs/js/webuploader.nolog.js

host{:port}/{contextPath/}/ck-fastdfs/js/ckFastDFS.js

2.开发文档

1.实例化前端上传实例:

const option = { //config something.....};const cfd = new CkFastDFS(option);

每个实例可以绑定多个上传按钮, 支持id选择器, 类选择器等jq插件支持的选择器类型

多实例存在的场景: 多个文件服务分组, 当不同的按钮上传文件到不同分组时, 可能需要页面多实例来处理

2.option参数说明:

{  baseURI: "../../