向后端传输参数格式为form-data 普通数据的处理

18 篇文章 0 订阅

后端需要传递表单数据时的处理方式

表单数据

将普通数据转换为表单数据方法:
        let formData=new FormData()
        formData.append('fileName',fileName)
        formData.append('geoJson',JSONObject)
        
        // 传给后端
        方法名(formData).then((res) => {
            console.log('返回值是:',res);
          })
          .catch();

  • 1
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
好的,这里给出一个 Java 前端传输文件数据并在后端接收的案例,以 Spring Boot 框架为例: 前端代码 ```html <form method="POST" action="/upload" enctype="multipart/form-data"> <input type="file" name="file" /> <input type="submit" value="Upload" /> </form> ``` 上述代码中,我们使用了 HTML 的表单元素来实现文件上传功能。在表单提交时,我们通过 `enctype="multipart/form-data"` 属性来指定表单的 MIME 类型为文件上传类型。 后端代码 ```java import org.springframework.boot.SpringApplication; import org.springframework.boot.autoconfigure.SpringBootApplication; import org.springframework.web.bind.annotation.PostMapping; import org.springframework.web.bind.annotation.RequestParam; import org.springframework.web.bind.annotation.RestController; import org.springframework.web.multipart.MultipartFile; @SpringBootApplication @RestController public class FileUploadApplication { @PostMapping("/upload") public String uploadFile(@RequestParam("file") MultipartFile file) { System.out.println("Received file: " + file.getOriginalFilename()); return "File uploaded successfully"; } public static void main(String[] args) { SpringApplication.run(FileUploadApplication.class, args); } } ``` 上述代码中,我们使用了 Spring Boot 框架来处理文件上传。在 Spring Boot 应用中,我们定义了一个 POST 方法的路由 `/upload`,并使用 `@RequestParam("file")` 注解来接收上传的文件数据。在方法处理后,我们可以通过 `file.getOriginalFilename()` 方法获取到上传的文件名。最后,我们返回一个字符串表示文件上传成功。 需要注意的是,在使用 Spring Boot 处理文件上传时,需要在 `application.properties` 中配置上传文件的最大大小和缓存目录等参数。例如: ``` spring.servlet.multipart.max-file-size=10MB spring.servlet.multipart.max-request-size=10MB spring.servlet.multipart.enabled=true spring.servlet.multipart.file-size-threshold=0 ```
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值