java图片上传服务器及客户端显示图片
程序员dulucy2020-07-04 03:00
我在上一篇文章SSM+Layui实现文件上传服务器中展示了如何将图片上传至服务器，保存到SQL server数据库中，本篇文章主要讲的是将图片上传到服务器上，保存在服务器的磁盘上，然后将图片路径保存到数据库中，最后实现在客户端展示图片。
在上一篇文章末尾，我阐述了两种图片（文件）上传到服务器后不同的保存方式。直接存放到数据库中，适合图片较小、数量少的应用场景，因为从数据库中读取图片数据会比较慢，特别实在图片较大、网络环境差的情况下。把图片存放到服务器磁盘、数据库存放图片存放路径，前台页面直接通过路径访问图片，这种方式适合需要展示的图片数量多的场景下。
技术框架说明
前台采用的是Layui框架，后台采用Java的SSM框架。前台的框架可以替换成其他的框架，主要功能实现的逻辑在于Java部分的代码。
上传图片的html
layui上传代码上传图片JS
引入layui.js，使用upload模块
上传js这是上传的js代码，具体的解释请转到我上一篇文章查看。
需要的jar包和springmvc-config.xml配置
maven的jar包
springmvc-config.xml配置上传Java代码（重点）
①、使用MultipartFile来接收前台传过来的文件，记得设置@RequestParam("file")。其中file我没有找到关于它的说明，这个和bootstrap的文件上传有区别。
②、设置url路径，这个存放到数据库中，后续前台展示图片就是直接将这个url赋值到img标签的src上。url=returnUrl+fileName组成。重点是returnUrl的形式是：
http://+服务器的IP:端口号③、fileName重新设置图片的名字。需要考虑上传的图片存在重名的情况，我这里采用了时间+随机数的方式对图片重新命名。
getServerIp方法
以上两个方法是获取服务器IP的方法。
将图片重命名，存放到服务器的指定位置后，将路径存放到数据库，展示的时候直接在数据库中查询然后将图片的url替换到img标签的src上即可。
配置tomcat虚拟路径（重点）
存放完图片后，在实现前台展示前，最重要的是在tomcat中配置虚拟路径。
数据库中存放的url路径的形式是这样的：
在tomcat的conf文件夹下打开server.xml进行编辑：
server.xml拉到文件最后，在Host便签内添加：
<Context docBase="D:\imagestest" path="/photo" reloadable="true"/>
其中，docBase指向你存放图片的文件夹，path为虚拟的项目名。配置完使用tomcat启动项目，就能正常访问到图片。
在开发中，我们经常会使用eclipse启动tomcat，这个时候tomcat的配置就不生效，因为这种方式启动tomcat时，使用的时eclipse的tomcat配置，因此，还需要在eclipse修改tomcat的配置，具体操作如下：
双击server中的tomcat，打开tomcat的配置，选择Modules选项卡
点击Add External Web Module. ，Document base输入图片存放的文件夹路径，在path输入虚拟项目名，保存即可完成eclipse中tomcat的虚拟路径配置
至于如何展示到前台的代码我就不放图了。将你需要展示的图片url查询传递到前台，赋值到img标签的src即可。
推荐阅读：
1、Layui怎么实现根据table行数据显示不同按钮
2、sqlserver——with as使用方法和注意事项
3、Java 非对称加密算法实现登陆账号密码加密传输功能
举报/反馈
0
0
收藏
分享
