JAVA实现客户端图片上传至服务器（SSM）（不使用input 标签使用，浏览器图片直接上传服务器）

最新推荐文章于 2021-07-19 15:45:15 发布

w18846439057

最新推荐文章于 2021-07-19 15:45:15 发布

阅读量997

点赞数 1

分类专栏： ssm 文件上传文章标签： java ajax ssm 文件上传截屏

本文链接：https://blog.csdn.net/w18846439057/article/details/83656050

版权

本文介绍了如何在不使用input标签的情况下，通过JAVA实现客户端浏览器截图并上传至SSM（Spring+SpringMVC+MyBatis）服务器。详细过程包括html2canvas截图、base64转file文件、后台处理文件并保存到服务器。

摘要由CSDN通过智能技术生成

JAVA实现客户端图片上传至服务器（SSM）（不使用input 标签使用，浏览器图片直接上传服务器）

这是本人第一篇博客想着记录一下平时学习的过程，也提供给和我一样正在学习java的同学们！！（如果有不懂的同学欢迎留言有时间一定回复，写的不好的地方请多包涵）
*

开始：
首先要写这篇博客的目的是因为跟进的项目需求实现截图上传到服务器并在数据库中保存图片在服务器的路径！本人当时采取了以下方法：

	1.使用java截图并保存到本地（不懂的同学可以参考"https://blog.csdn.net/sanluo11/article/details/61923549"）
	这种方法并不能满足我的需求，因为java截取的图片是服务器端的图片对于web项目这显然不能达到需求，因为要截取客户端（浏览器）的图片。于是采用方法二
	2.使用<input type='file'>标签 进行文件上传（此方法确实可以实现，有需要的同学可以参考"https://blog.csdn.net/swingpyzf/article/details/20230865"）
	这种方法同样不能满足需求 因为要截图上传服务器 客户本地存放图片没有任何意义 而且需要使用<input>标签去选择 所以最后 经过不断百度总结 实现了方法三（构建file文件通过request携带到controller层进行获取）
	3. html2canvas实现截图 使用Ajax. form表单进行提交及构造file文件

废话不多说上代码：
(1).html2canvas实现屏幕截图：
HTML部分：

<form method="post" id="file" action="" enctype="multipart/form-data">
		<div class="screen">
        <span class="text-info">截屏区域:</span>
            <span class="text-info">处理人:${user.userName}</span>
        <%--<input id="picture" type="button" class="btn btn-default btn-sm btn-info"  onclick="capture()" value="截屏">--%>
            <input id