记一次springboot上传文件要重启或bulid才能显示的问题

记一次springboot上传文件要重启或bulid才能显示的问题

问题:Springboot文件上传功能上传图片时,前端不能很快的显示图片,每次都要上传图片后要重新build一下才能看得见上传的图片

原因:这是对服务器的保护措施导致的,服务器不能对外部暴露真实的资源路径,需要配置虚拟路径映射访问。

解决方法:

在application.yml文件加入了静态资源文件夹:

spring:
  #获取静态文件
  resources:
    static-locations:
      - classpath:/static/
      - classpath:/templates/
      - classpath:/public/

然后增加一个配置类

package com.cheng.Config;

import org.springframework.context.annotation.Configuration;
import org.springframework.web.servlet.config.annotation.ResourceHandlerRegistry;
import org.springframework.web.servlet.config.annotation.WebMvcConfigurer;

/**
 * @Author ASUS
 * @Create 2021-05-03 15:44
 * @Version 1.0
 * @Description 新增加一个类用来添加虚拟路径映射
 */
@Configuration
public class MyPicConfig implements WebMvcConfigurer {
	@Override
	public void addResourceHandlers(ResourceHandlerRegistry registry) {
		String path = System.getProperty("user.dir") + "\\src\\main\\resources\\public\\upload\\";
		// /upload/**是对应resource下工程目录
		registry.addResourceHandler("/upload/**").addResourceLocations("file:" + path);
	}
}

然后重启项目,上传文件后就可以看到图片了

image-20210503155847453

  • 2
    点赞
  • 4
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
要实现Spring Boot文件进度显示,可以使用以下步骤: 1. 添加依赖:在pom.xml文件中添加以下依赖: ```xml <dependency> <groupId>commons-fileupload</groupId> <artifactId>commons-fileupload</artifactId> <version>1.4</version> </dependency> ``` 2. 创建上控制器:创建一个Spring Boot控制器来处理文件请求。在该控制器中,我们需要使用Apache Commons FileUpload库来解析文件请求,并将文件保存到服务器上。此外,我们还需要计算上进度并将其发送给客户端。 ```java @RestController public class UploadController { @PostMapping("/upload") public ResponseEntity<?> uploadFile(@RequestParam("file") MultipartFile file) { // Get file size long fileSize = file.getSize(); // Create a new file on the server File serverFile = new File("/path/to/upload/directory/" + file.getOriginalFilename()); try (InputStream is = file.getInputStream(); BufferedOutputStream bos = new BufferedOutputStream(new FileOutputStream(serverFile))) { byte[] buffer = new byte[4096]; long uploaded = 0; int read; while ((read = is.read(buffer)) != -1) { bos.write(buffer, 0, read); uploaded += read; // Calculate upload progress double progress = (double) uploaded / fileSize * 100; // Send progress update to client // This can be done using WebSockets, Server-Sent Events or polling // For this example, we will use a simple JSON response Map<String, Double> response = new HashMap<>(); response.put("progress", progress); return ResponseEntity.ok(response); } } catch (IOException e) { return ResponseEntity.status(HttpStatus.INTERNAL_SERVER_ERROR).build(); } return ResponseEntity.ok().build(); } } ``` 3. 客户端实现:客户端需要发送文件请求,并通过一种方式来接收和显示进度更新。这可以通过WebSockets,Server-Sent Events或轮询来完成。在此示例中,我们将使用Ajax轮询来检索进度更新。 ```javascript function uploadFile() { var formData = new FormData(); formData.append("file", document.getElementById("file").files[0]); var xhr = new XMLHttpRequest(); xhr.upload.addEventListener("progress", function(event) { if (event.lengthComputable) { var percentComplete = event.loaded / event.total * 100; console.log(percentComplete.toFixed(2) + "%"); } }, false); xhr.onreadystatechange = function() { if (this.readyState === 4 && this.status === 200) { var response = JSON.parse(this.responseText); var progress = response.progress; console.log(progress.toFixed(2) + "%"); } }; xhr.open("POST", "/upload"); xhr.send(formData); } ``` 此外,还可以使用第三方库,如ng-file-upload,来实现更高级的文件和进度显示功能。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值