多文件上传,避坑 [object FileList]

本文介绍了如何在前端使用FormData实现多文件上传,通过遍历files对象并逐个添加到FormData中。在后端,Java通过@RequestParam注解接收MultipartFile数组,实现对上传文件的处理。提供了解决前端上传文件问题的具体步骤和代码示例。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

提示:文章写完后,目录可以自动生成,如何生成可参考右边的帮助文档


前言

提示:这里可以添加本文要记录的大概内容:

一个input框上传多个文件避坑 [object FileList]


提示:以下是本篇文章正文内容,下面案例可供参考

一、多文件上传

说明:input框上传多个文件

二、内容

1.案例

前端传参:Form Data的键值对是 key:[object FileList]

2.解决办法

前端JS,将对象循环遍历

var files = $("#multipartFile")[0].files;
for (let index = 0; index < files.length; index++) {
	formData.append('multipartFile', files[index]);
}

java接收用"multipartFile"

public RestResponse<Boolean> uploads(@RequestParam("multipartFile") MultipartFile[] multipartFile) {
	TODO
}

总结

前车之鉴,后事之师

好的,以下是一个使用 Go 语言实现的阿里云 OSS 多文件上传的示例代码: ``` package main import ( "fmt" "os" "github.com/aliyun/aliyun-oss-go-sdk/oss" ) func main() { // 配置 OSS 客户端 endpoint := "yourEndpoint" accessKeyID := "yourAccessKeyID" accessKeySecret := "yourAccessKeySecret" bucketName := "yourBucketName" client, err := oss.New(endpoint, accessKeyID, accessKeySecret) if err != nil { fmt.Println("Error:", err) os.Exit(-1) } // 获取存储空间 bucket, err := client.Bucket(bucketName) if err != nil { fmt.Println("Error:", err) os.Exit(-1) } // 设置并发上传的协程数 oss.SetConcurrency(50) // 上传文件列表 fileList := []string{ "/path/to/file1", "/path/to/file2", "/path/to/file3", } // 遍历文件列表进行上传 for _, filePath := range fileList { // 打开文件 file, err := os.Open(filePath) if err != nil { fmt.Println("Error:", err) continue } defer file.Close() // 创建 ObjectMeta meta := oss.ObjectMeta{} // 上传文件 objectKey := "yourObjectKeyPrefix/" + filepath.Base(filePath) err = bucket.PutObject(objectKey, file, meta) if err != nil { fmt.Println("Error:", err) continue } fmt.Println("File uploaded successfully:", filePath) } } ``` 在使用该代码前,您需要先将 `yourEndpoint`、`yourAccessKeyID`、`yourAccessKeySecret` 和 `yourBucketName` 替换成您自己的阿里云 OSS 相关信息。此外,您还需要修改 `fileList` 变量,将其中的文件路径替换成您想要上传的文件路径。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值