u网站建设,徐州专业三合一网站开发,商城网站入驻系统,有没有做cad单的网站SpringMvc上传下载功能实现
1.创建新的项目
1#xff09;项目信息填写
Spring Initializr (单击选中)Name(填写项目名字)Language#xff08;选择开发语言#xff09;Type#xff08;选择工具Maven#xff09;Group#xff08;#xff09;JDK#xff08;jdk选择17 项目信息填写
Spring Initializr (单击选中)Name(填写项目名字)Language选择开发语言Type选择工具MavenGroupJDKjdk选择17 Next(下一步) 2选择所用的包
Springboot (选择SpringBoot版本)输入(web)选择Spring Web选择Thymeleafcreate 3创建controller包 4创建DownLoadController类 package com.xiji.springdemo01.controller;import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.ResponseBody;Controller
public class DownLoadController {RequestMapping(/)public String index(){return index;}}5创建UpLoadController类 package com.xiji.springdemo01.controller;import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.ResponseBody;/*** 文件上传功能*/
Controller
public class UpLoadController {RequestMapping(/up)public String uploadPage(){return upload;}
}在resources文件的static创建img文件夹》导入图片 打开templates文件夹
6创建index.html !DOCTYPE html
html langzh
headmeta charsetUTF-8title精美主页面/titlestyle/* styles.css */body {font-family: Arial, sans-serif;margin: 0;padding: 0;background-color: #f4f4f4;}header {background-color: #333;color: white;padding: 10px 0;text-align: center;}nav ul {list-style-type: none;padding: 0;}nav ul li {display: inline;margin-right: 10px;}nav ul li a {color: white;text-decoration: none;}main {padding: 20px;background-color: white;margin: 20px;}section {margin-bottom: 20px;}footer {background-color: #333;color: white;text-align: center;padding: 10px 0;position: fixed;width: 100%;bottom: 0;}/style
/head
body
headernavullia href#home首页/a/lilia href#services服务/a/lilia href#about关于我们/a/lilia href#contact联系我们/a/li/ul/nav
/header
maindi stylewidth: 200px;height: 200px; a th:href{/download}文件下载/a/di/main
footerp版权所有 © 2023 我们的公司/p
/footer
/body
/html 注:a th:href{/download}文件下载/a 这个路径对应的是后端的下载接口 7创建upload.html !DOCTYPE html
html langzh-CN
headmeta charsetUTF-8meta nameviewport contentwidthdevice-width, initial-scale1.0title文件上传/titlelink relstylesheet hrefhttps://cdn.jsdelivr.net/npm/bootstrap5.3.0/dist/css/bootstrap.min.cssstylebody {font-family: Arial, sans-serif;background-color: #f4f4f9;margin: 0;padding: 0;}.container {max-width: 600px;margin: 50px auto;padding: 20px;background-color: #fff;border-radius: 10px;box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);}h1 {text-align: center;color: #333;}.form-group {margin-bottom: 20px;}.btn-primary {width: 100%;}.custom-file-input ~ .custom-file-label {background-color: #e9ecef;border-color: #ced4da;}.custom-file-input:focus ~ .custom-file-label {border-color: #80bdff;box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);}/style
/head
body
div classcontainerh1文件上传/h1form iduploadForm methodpost actionhttp://127.0.0.1:8080/upload enctypemultipart/form-datadiv classform-grouplabel forfileInput选择文件:/labelinput typefile classform-control-file idfileInput namefileInput/divbutton typesubmit classbtn btn-primary上传文件/button/form
/divscript srchttps://cdn.jsdelivr.net/npm/bootstrap5.3.0/dist/js/bootstrap.bundle.min.js/script
script/script
/body
/htmlj 注input typefile classform-control-file idfileInput namefileInput name值与接口值一致 解释
form 元素创建了一个表单其属性包括 id 设置为 uploadForm可以在JavaScript中引用此表单。method 设置为 post表示数据将通过POST方法提交到服务器。action 指定了接收上传文件的服务器端脚本地址。enctype 设置为 multipart/form-data这是必须的因为它允许表单发送二进制文件数据如图片或文档。 input 类型为 file允许用户从本地文件系统选择一个或多个文件进行上传。最后一个带有类 btn btn-primary 的按钮用于提交表单。 2.实现上传功能
1关键代码 /*** 通过MultipartFile实现上传*/
RequestMapping(/upload)
ResponseBody
public String upload(MultipartFile fileInput) throws IOException {PathMatchingResourcePatternResolver resolver new PathMatchingResourcePatternResolver();//获取上传文件夹的路径资源Resource resource resolver.getResource(classpath:static/img/); //获取文件夹真实路径String path resource.getFile().getPath();//路径拼接String filePath path File.separator fileInput.getOriginalFilename();//通过transferTo()方法返回给前端fileInput.transferTo(new File(filePath));return 上传成功;} 2详情解释
注解说明: RequestMapping(/upload): 定义了处理 HTTP 请求的 URL 映射。ResponseBody: 表示该方法返回的内容将直接作为 HTTP 响应体返回给客户端。接收上传文件: MultipartFile fileInput: 用于接收上传的文件。获取文件夹路径: PathMatchingResourcePatternResolver resolver: 用于解析文件资源路径。resolver.getResource(classpath:static/img/): 获取指定路径下的文件夹资源。String path resource.getFile().getPath();: 获取文件夹的真实路径。拼接文件路径: String filePath path File.separator fileInput.getOriginalFilename();: 拼接完整的文件路径。保存文件: fileInput.transferTo(new File(filePath));: 将上传的文件保存到指定路径。返回结果: return 上传成功;: 返回上传成功的消息。
3功能测试 打开 http://127.0.0.1:8080/up http://127.0.0.1:8080/up 任选一张图片 打开idea target classes static img 看到已经成功上传到服务器 可以看到已经上传成功了 3.文件下载功能实现
1关键代码 /**** 通过PathMatchingResourcePatternResolver ResponseEntity 下载文件*/
RequestMapping(/download)
ResponseBody
public ResponseEntitybyte[] download() throws IOException {//获取文件地址 PathMatchingResourcePatternResolver resolver new PathMatchingResourcePatternResolver();Resource resource resolver.getResource(static/img/1.png); // 1.png修改为你导入的图片名称//获取文件File file resource.getFile(); //获取文件流FileInputStream fileInputStream new FileInputStream(file);//创建每次读取的字节数为文件本身大小byte[] bytes new byte[fileInputStream.available()];//相当于把文件流 输入到 bytes 字节数组中fileInputStream.read(bytes);//设置下载方式HttpHeaders httpHeaders new HttpHeaders();httpHeaders.add(Content-Disposition, attachment; filename file.getName());//状态码设置HttpStatus ok HttpStatus.OK;//创建ResponseEntity返回给前端ResponseEntitybyte[] responseEntity new ResponseEntity(bytes, httpHeaders, ok);return responseEntity;
} 2详细解释 注解说明: RequestMapping(/download): 定义了处理 HTTP 请求的 URL 映射。ResponseBody: 表示该方法返回的内容将直接作为 HTTP 响应体返回给客户端。文件资源解析: PathMatchingResourcePatternResolver: 用于解析文件资源路径。 getResource(static/img/1.png): 获取指定路径下的文件资源。文件对象获取: File file resource.getFile();: 将资源转换为 File 对象。设置响应头: HttpHeaders httpHeaders: 创建响应头对象。 httpHeaders.add(Content-Disposition, attachment; filename file.getName()): 设置响应头指定文件以附件形式下载并设置文件名。状态码设置: HttpStatus ok HttpStatus.OK: 设置 HTTP 状态码为 200 OK。读取文件内容: FileInputStream fileInputStream new FileInputStream(file);: 创建文件输入流。byte[] bytes new byte[fileInputStream.available()];: 创建字节数组。 fileInputStream.read(bytes);: 读取文件内容到字节数组中。创建响应实体: ResponseEntitybyte[] responseEntity new ResponseEntity(bytes, httpHeaders, ok);:创建 ResponseEntity 对象包含文件内容、响应头和状态码。返回响应: return responseEntity;: 返回响应实体。
3功能测试 打开网址 打开网址打开网址 http://127.0.0.1:8080/打开网址 可以看到我们已经下载成功了 4.附:
1完整的DownLoadController 类代码
package com.xiji.springdemo01.controller;import org.springframework.core.io.Resource;
import org.springframework.core.io.support.PathMatchingResourcePatternResolver;
import org.springframework.http.HttpHeaders;
import org.springframework.http.HttpStatus;
import org.springframework.http.ResponseEntity;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.ResponseBody;import java.io.File;
import java.io.FileInputStream;
import java.io.IOException;Controller
public class DownLoadController {/**** 通过PathMatchingResourcePatternResolver ResponseEntity 下载文件*/RequestMapping(/download)ResponseBodypublic ResponseEntitybyte[] download() throws IOException {//获取文件地址PathMatchingResourcePatternResolver resolver new PathMatchingResourcePatternResolver();Resource resource resolver.getResource(static/img/1.png);//获取文件File file resource.getFile();//获取文件流FileInputStream fileInputStream new FileInputStream(file);//创建每次读取的字节数为文件本身大小byte[] bytes new byte[fileInputStream.available()];//相当于把文件流 输入到 bytes 字节数组中fileInputStream.read(bytes);//设置下载方式HttpHeaders httpHeaders new HttpHeaders();httpHeaders.add(Content-Disposition, attachment; filename file.getName());//状态码设置HttpStatus ok HttpStatus.OK;ResponseEntitybyte[] responseEntity new ResponseEntity(bytes, httpHeaders, ok);return responseEntity;}RequestMapping(/)public String index(){return index;}}2完整的UpLoadController 代码
package com.xiji.springdemo01.controller;import org.springframework.context.support.ClassPathXmlApplicationContext;
import org.springframework.core.io.Resource;
import org.springframework.core.io.support.PathMatchingResourcePatternResolver;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.ResponseBody;
import org.springframework.web.multipart.MultipartFile;import java.io.File;
import java.io.IOException;/*** 文件上传功能*/
Controller
public class UpLoadController {/*** 通过MultipartFile实现上传*/RequestMapping(/upload)ResponseBodypublic String upload(MultipartFile fileInput) throws IOException {PathMatchingResourcePatternResolver resolver new PathMatchingResourcePatternResolver();Resource resource resolver.getResource(classpath:static/img/);String path resource.getFile().getPath();//路径拼接String filePath path File.separator fileInput.getOriginalFilename();fileInput.transferTo(new File(filePath));return 上传成功;}RequestMapping(/up)public String uploadPage(){return upload;}
}
