springboot 实现接收前端发来的图片和视频以及在页面上展示图片和视频
springboot 实现接收前端发来的图片和视频以及在页面上展示图片和视频
一、效果:
1、上传图片

2、显示上传的图片

3、上传的视频

4、显示上传的视频

二、代码
没依赖特殊的包,引入springweb就行
1、配置文件:
# 应用名称
spring.application.name=demo
# 应用服务 WEB 访问端口
server.port=8080 #设置上传文件大小,默认是1M
spring.servlet.multipart.max-request-size=200MB
spring.servlet.multipart.max-file-size=200MB
2、controller类:
package com.example.demo; import org.springframework.web.bind.annotation.*;
import org.springframework.web.multipart.MultipartFile;
import javax.servlet.http.HttpServletResponse;
import java.io.File;
import java.io.FileInputStream;
import java.io.IOException;
import java.io.OutputStream; /**
* <p>描述: 图片和视频上传和查看。</p>
* <p>文件名称: Controller.java</p>
* <p>创建时间: 2022-07-08 </p>
* @author 万笑佛
* @since 2022-07-08
*/ @RestController
@RequestMapping("/editor")
public class Controller { /**
* 图片上传。
*
* @param fileUpload
* @return JSONObject
*/
@PostMapping(value = "/image/upload" )
@ResponseBody
public void imageUpload(@RequestParam("file") MultipartFile fileUpload) { //获取文件名
String fileName = fileUpload.getOriginalFilename();
String tmpFilePath = "D://test//image//" ; //没有路径就创建路径
File tmp = new File(tmpFilePath);
if (!tmp.exists()) {
tmp.mkdirs();
}
String resourcesPath = tmpFilePath + "//" + fileName; File upFile = new File(resourcesPath);
try {
fileUpload.transferTo(upFile);
} catch (IOException e) {
e.printStackTrace();
} } /**
* 图片查看。 * @return String
*/
@GetMapping("/image/look")
public String imageLook (HttpServletResponse response) { File file = new File("D:\\test\\image\\1.png");
byte[] bytes = new byte[1024];
try (OutputStream os = response.getOutputStream();
FileInputStream fis = new FileInputStream(file)){
while ((fis.read(bytes)) != -1) {
os.write(bytes);
os.flush();
}
} catch (IOException e) {
e.printStackTrace();
}
return "success";
} /**
* 视频上传。
*
* @param fileUpload
* @return JSONObject
*/
@PostMapping(value = "/video/upload" )
@ResponseBody
public void videoUpload(@RequestParam("file") MultipartFile fileUpload) { //获取文件名
String fileName = fileUpload.getOriginalFilename();
String tmpFilePath = "D://test//video//" ;
//没有路径就创建路径
File tmp = new File(tmpFilePath);
if (!tmp.exists()) {
tmp.mkdirs();
}
String resourcesPath = tmpFilePath + "//" + fileName;
File upFile = new File(resourcesPath);
try {
fileUpload.transferTo(upFile);
} catch (IOException e) {
e.printStackTrace();
} } /**
* 视频查看。 * @return String
*/
@GetMapping("/video/look")
public String videoLook (HttpServletResponse response) {
File file = new File("D:\\test\\video\\1.mp4");
byte[] bytes = new byte[1024];
try (OutputStream os = response.getOutputStream();
FileInputStream fis = new FileInputStream(file)){
while ((fis.read(bytes)) != -1) {
os.write(bytes);
os.flush();
}
} catch (IOException e) {
e.printStackTrace();
}
return "success";
} }
推荐一个适合零基础学习SQL的网站:不用安装数据库,在线轻松学习SQL!
springboot 实现接收前端发来的图片和视频以及在页面上展示图片和视频的更多相关文章
- web页面上展示图片时,图片不显示,报错:ERR_CONTENT_LENGTH_MISMATCH
问题描述 前端页面加载css,和js文件的时候,经常出现ERR_CONTENT_LENGTH_MISMATCH的报错情况. 查找问题 在单独打开hearder中css,js的网络地址是能打开的 ...
- 使用 jQuery 操作页面元素的方法,实现浏览大图片的效果,在页面上插入一幅小图片,当鼠标悬停到小图片上时,在小图片的右侧出现与之相对应的大图片
查看本章节 查看作业目录 需求说明: 使用 jQuery 操作页面元素的方法,实现浏览大图片的效果,在页面上插入一幅小图片,当鼠标悬停到小图片上时,在小图片的右侧出现与之相对应的大图片 实现思路: 在 ...
- 使用JavaScript 中的Math对象和勾股定理公式,计算鼠标的位置与页面图片中心点的距离,根据距离对页面上的图片进行放大或缩小处理。距离远时图片放大,距离近时图片缩小
查看本章节 查看作业目录 需求说明: 使用JavaScript 中的Math对象和勾股定理公式,计算鼠标的位置与页面图片中心点的距离,根据距离对页面上的图片进行放大或缩小处理.距离远时图片放大,距离近 ...
- SpringBoot 后端接收前端传值的方法
1.通过HttpServletRequest接收,适用于GET 和 POST请求方式 通过HttpServletRequest对象获取请求参数 @RestController @Reque ...
- 一段实现页面上的图片延时加载的js
大家如果使用firebug去查看的话就会发现,当你滚动到相应的行时,当前行的图片才即时加载的,这样子的话页面在打开只加可视区域的图片,而其它隐藏的图片则不加载,一定程序上加快了页面加载的速度,对于比较 ...
- 前端H5,点击选择图片控件,图片直接在页面上展示~
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- javaweb页面上展示动态图片
HTML <img alt="点击设定" name="CONSTRUCTIONPLANHIS_IMAGE_curr_img_0" src="vi ...
- Python Django CMDB项目实战之-3创建form表单,并在前端页面上展示
基于之前的项目代码 Python Django CMDB项目实战之-1如何开启一个Django-并设置base页.index页.文章页面 Python Django CMDB项目实战之-2创建APP. ...
- java 通过流的方式读取本地图片并显示在jsp 页面上(类型以jpg、png等结尾的图片)
Java代码: File filePic = new File(path+"1-ab1.png"); if(filePic.exists()){ FileInputStream i ...
- 关于springmvc 只能在index.jsp页面显示图片的处理办法jsp页面无法显示图片
首先,已经配置好了mvc对静态资源的处理 只有index,jsp可以显示图片 其他页面同样的代码则不显示 后来折腾了半天,发现 index是static的父目录的级别文件 可以向下访问 但是其他的js ...
随机推荐
- Android 图表开源库调研及使用示例
原文地址: Android图表开源库调研及使用示例 - Stars-One的杂货小窝 之前做的几个项目都是需要实现图表统计展示,于是做之前调研了下,做下记录 概述 AAChartCore-Kotlin ...
- 2023年奔走的总结---吉特日化MES 智能搬运AGV 篇三
<2023年奔走的总结---吉特日化MES 项目趣事 篇一> <2023年奔走的总结---吉特日化MES 制药项目 篇二> <2023年奔走的总结---吉特日化MES 智 ...
- Hive SQL之表与建表
数据类型: 建表 create database itheima; --1.创建一张表 -- 表名 --字段 名称 类型 顺序 --字段之间的分隔符 create table itheima.t_a ...
- The second day learning summary
1.什么是接口测试? 接口测试是测试系统组件间接口的一种测试.接口测试主要用于外部系统与系统之间以及内部各个子系统之间的交互点,定义特定的交互点,然后通过这些交互点来,通过一些特殊的规则也就是协议,来 ...
- python 解析网址信息
python 解析网址信息 本篇文章主要讲述python 中如何解析一个url的信息. 1: requests获取网页信息 #!/usr/bin/python3 # -*- coding: UTF-8 ...
- 变更(重命名)AD域名称
文章来自:https://blog.51cto.com/sxleilong/1377731 示例将域名contoso.com重命名为Corp.sxleilong.com 查看当前fsmo的5个角色. ...
- 最新系统MacOs13 Ventura(M1/M2芯片) + Parallels Desktop 18(PD18史上最强虚拟机)永久使用攻略
众神殿内,高朋满座,胜友如云,Vmware.VirtualBox.Utm等虚拟机大神群英荟萃,只见位于C位王座上的Parallels怅惘抬头,缓缓逡巡,睥睨群小,目光到处,无人敢抬头对视. 是的,如果 ...
- 浅谈DWS函数出参方式
摘要:DWS的PL/pgSQL函数/存储过程中有一个特殊的语法PERFORM语法,用于执行语句但是丢弃执行结果的场景,常用于一些状态判断的场景. 本文分享自华为云社区<GassDB(DWS)功能 ...
- MindSpore实践:对篮球运动员目标的检测
摘要:本文讲述的是MindSpore对篮球运动员目标的检测应用,通过AI技术辅助对篮球赛场进行分析. 本文分享自华为云社区<MindSpore大V博文系列:AI对篮球运动员目标的检测>,原 ...
- OpenMetric与时序数据库模型之主流TSDB分析
摘要:为大家带来当下时序数据模型的主流TSDB分析及云厂商在时序数据模型方面的最新动态. 本文分享自华为云社区<[万字干货]OpenMetric与时序数据库存储模型分析(下)>,作者:敏捷 ...