springboot实现动态加载图片,查询,前端通过为VUE3,实现方法最好是img的src实现
时间: 2023-12-09 08:03:28 浏览: 116
实现动态加载图片可以使用Spring Boot提供的ResourceLoader类来加载本地文件或者通过网络获取文件,然后通过ResponseEntity将文件返回给前端。下面是一个示例代码:
```java
@GetMapping("/image")
public ResponseEntity<byte[]> getImage(@RequestParam String imagePath) throws IOException {
Resource imageResource = resourceLoader.getResource("file:" + imagePath);
InputStream imageInputStream = imageResource.getInputStream();
byte[] imageBytes = IOUtils.toByteArray(imageInputStream);
HttpHeaders headers = new HttpHeaders();
headers.setContentType(MediaType.IMAGE_JPEG);
return new ResponseEntity<>(imageBytes, headers, HttpStatus.OK);
}
```
在前端中,可以使用img标签的src属性来加载动态图片,如下所示:
```html
<img :src="getImageUrl" />
```
其中,getImageUrl是一个计算属性,通过调用后端接口获取图片的URL,如下所示:
```javascript
computed: {
getImageUrl() {
return '/image?imagePath=' + this.imagePath;
}
}
```
这样就可以实现动态加载图片了。
阅读全文