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 实现接收前端发来的图片和视频以及在页面上展示图片和视频的更多相关文章

  1. web页面上展示图片时,图片不显示,报错:ERR_CONTENT_LENGTH_MISMATCH

      问题描述 前端页面加载css,和js文件的时候,经常出现ERR_CONTENT_LENGTH_MISMATCH的报错情况.   查找问题 在单独打开hearder中css,js的网络地址是能打开的 ...

  2. 使用 jQuery 操作页面元素的方法,实现浏览大图片的效果,在页面上插入一幅小图片,当鼠标悬停到小图片上时,在小图片的右侧出现与之相对应的大图片

    查看本章节 查看作业目录 需求说明: 使用 jQuery 操作页面元素的方法,实现浏览大图片的效果,在页面上插入一幅小图片,当鼠标悬停到小图片上时,在小图片的右侧出现与之相对应的大图片 实现思路: 在 ...

  3. 使用JavaScript 中的Math对象和勾股定理公式,计算鼠标的位置与页面图片中心点的距离,根据距离对页面上的图片进行放大或缩小处理。距离远时图片放大,距离近时图片缩小

    查看本章节 查看作业目录 需求说明: 使用JavaScript 中的Math对象和勾股定理公式,计算鼠标的位置与页面图片中心点的距离,根据距离对页面上的图片进行放大或缩小处理.距离远时图片放大,距离近 ...

  4. SpringBoot 后端接收前端传值的方法

    1.通过HttpServletRequest接收,适用于GET 和 POST请求方式       通过HttpServletRequest对象获取请求参数 @RestController @Reque ...

  5. 一段实现页面上的图片延时加载的js

    大家如果使用firebug去查看的话就会发现,当你滚动到相应的行时,当前行的图片才即时加载的,这样子的话页面在打开只加可视区域的图片,而其它隐藏的图片则不加载,一定程序上加快了页面加载的速度,对于比较 ...

  6. 前端H5,点击选择图片控件,图片直接在页面上展示~

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  7. javaweb页面上展示动态图片

    HTML <img alt="点击设定" name="CONSTRUCTIONPLANHIS_IMAGE_curr_img_0" src="vi ...

  8. Python Django CMDB项目实战之-3创建form表单,并在前端页面上展示

    基于之前的项目代码 Python Django CMDB项目实战之-1如何开启一个Django-并设置base页.index页.文章页面 Python Django CMDB项目实战之-2创建APP. ...

  9. java 通过流的方式读取本地图片并显示在jsp 页面上(类型以jpg、png等结尾的图片)

    Java代码: File filePic = new File(path+"1-ab1.png"); if(filePic.exists()){ FileInputStream i ...

  10. 关于springmvc 只能在index.jsp页面显示图片的处理办法jsp页面无法显示图片

    首先,已经配置好了mvc对静态资源的处理 只有index,jsp可以显示图片 其他页面同样的代码则不显示 后来折腾了半天,发现 index是static的父目录的级别文件 可以向下访问 但是其他的js ...

随机推荐

  1. 如何用BI制作图表组合?

    BI(Business Intelligence)是一种通过收集.分析和可视化数据来帮助企业做出决策的技术和工具.在BI中,制作图表组合是一种常见的方式,可以将不同的图表类型组合在一起,以更全面地呈现 ...

  2. java中父类方法return this.对象还是变量,子类去调用this.这个方法的问题

    这个问题很简单 public class this_test01 { public static void main(String[] args) { zi j=new zi(); j.pri(); ...

  3. Go语言实现GoF设计模式:适配器模式

    本文分享自华为云社区<[Go实现]实践GoF的23种设计模式:适配器模式>,作者:元闰子. 简介 适配器模式(Adapter)是最常用的结构型模式之一,在现实生活中,适配器模式也是处处可见 ...

  4. Winform 好看控件库推荐:MaterialSkin.2

    MaterialSkin.2 控件包是在 MaterialSkin 及基础上二次开发而来的,在原控件基础上修复了一些Bug,丰富了主题以及动画效果,效果非常好. MaterialSkin.2 现在处于 ...

  5. MySQL日期查询

    MySQL日期查询 1.今天 select * from 表名 where to_days(时间字段名) = to_days(now()); 2.昨天 SELECT * FROM 表名 WHERE T ...

  6. JS对后端响应的long类型数据处理精度丢失问题

    1.数据库的数据 2.前端拿到的数据 前端帮我们进行四舍五入了,这并不是我想要的 3.解决办法 把后端响应的数据long类型转成string类型,可以使用Stream流的方式或者for循环的方式,对响 ...

  7. 【UniApp】-uni-app-数据传递补充

    前言 好,经过上个章节的介绍完毕之后,了解了一下 uni-app-CompositionAPI传递数据 那么了解完了uni-app-CompositionAPI传递数据之后,这篇文章来给大家介绍一下 ...

  8. MySQL运维6-Mycat垂直分库

    一.垂直分库场景 场景:在业务系统中,涉及一下表结构,但是由于用户与订单每天都会产生大量的数据,单台服务器的数据存储以及处理能力是有限的,可以对数据库表进行拆分,原有数据库如下 说明1:整个业务系统中 ...

  9. HP LoadRunner 11.00安装+破解+汉化

    里面包含多个破解码,最高支持6.5w个并发: https://blog.csdn.net/xianjie0318/article/details/78625980

  10. .NET周刊【1月第1期 2023-01-07】

    一月头条:C# 被评为2023年度编程语言! 在TIOBE指数的历史上,祝贺 C# 首次赢得了年度编程语言奖项!C# 已经是十大顶尖选手超过两个十年了,现在它正在迎头赶上四大语言,凭借一年内最大增幅( ...