一.场景还原

用户上传了一张图片,已有服务器保存路径,现由于系统配置无法直接通过图片URL打开预览图片,需实现点击预览将图片显示在浏览器上。

二.实现方法

html:

    <a href="##" onclick="preview('${file.filePath}')" >预览</a>

此处用预览按钮方法实现

Javascript:

function preview(path){
var ext=path.split('.')[1];
if(ext=="PNG"){
window.open("<%=path%>/file/showImage.do?path="+path);
}
}

此处因为测试判断了PNG

Java:

/*
* 在线预览图片
*/
@RequestMapping("/showImage.do")
public @ResponseBody
void showImage(String path) throws IOException {
getResponse().setContentType("text/html; charset=UTF-8");
getResponse().setContentType("image/jpeg");
String fullFileName = getRealPath("/upload/" + path);
FileInputStream fis = new FileInputStream(fullFileName);
OutputStream os = getResponse().getOutputStream();
try {
int count = 0;
byte[] buffer = new byte[1024 * 1024];
while ((count = fis.read(buffer)) != -1)
os.write(buffer, 0, count);
os.flush();
} catch (IOException e) {
e.printStackTrace();
} finally {
if (os != null)
os.close();
if (fis != null)
fis.close();
}
}

三.执行结果

打开一个新的窗口,显示图片。

本文为博主原创文章

转载请保留出处:http://www.cnblogs.com/zwqh/p/6494839.html 
谢谢合作

【Java】web实现图片在线预览的更多相关文章

  1. web office apps 在线预览实践

    摘要 在一些项目中需要在线预览office文档,包括word,excel,ppt等.达到预览文档的目的有很多方法,可以看我之前总结,在线预览的n种方案: [Asp.net]常见word,excel,p ...

  2. pdf.js实现图片在线预览

    项目需求 前段时间项目中遇到了一个模块,是关于在线预览word文档(PDF文件)的,所以,找了很多插件,例如,pdf.js,pdfobject.js框架,但是pdfobject.js框架对于IE浏览器 ...

  3. WEB文档在线预览解决方案

    web页面无法支持预览office文档,但是却可以预览PDF.flash文档,所以大多数解决方案都是在服务端将office文档转换为pdf,然后再通过js的pdf预览插件(谷歌浏览器等已经原生支持嵌入 ...

  4. html5上传本地图片,在线预览及裁剪(filereader,canvas)

    1 我们常常需要上传头像,点击上传按钮时候需要预览一下,使用filereader方法无需和后台交互,代码如下: //本地图片在上传之前的预览效果 //图片上传预览 function previewIm ...

  5. office web apps 整合到自己项目中(wopi实现在线预览编辑)

    借助office web apps实现在线预览和在线编辑 我所有的代码都是用go语言编写,你可以直接编译后使用,不用再有其他的操作. 最近项目实在太忙,这几天才有时间,这次是重头戏,要好好琢磨一下怎么 ...

  6. office在线预览方案

    一.服务器先转换为PDF,再转换为SWF,最后通过网页加载Flash预览 微软方:利用Office2007以上版本的一个PDF插件SaveAsPDFandXPS.exe可以导出PDF文件,然后再利用免 ...

  7. Office在线预览及PDF在线预览的实现方式史上最全大集合

    Office在线预览及PDF在线预览的实现方式大集合 一.服务器先转换为PDF,再转换为SWF,最后通过网页加载Flash预览 微软方:利用Office2007以上版本的一个PDF插件SaveAsPD ...

  8. Office在线预览及PDF在线预览的实现方式大集合

    一.服务器先转换为PDF,再转换为SWF,最后通过网页加载Flash预览 微软方:利用Office2007以上版本的一个PDF插件SaveAsPDFandXPS.exe可以导出PDF文件,然后再利用免 ...

  9. Office在线预览及PDF在线预览的实现方式

    原文链接:http://www.officeweb365.com/officetoview.html 一.服务器先转换为PDF,再转换为SWF,最后通过网页加载Flash预览 微软方:利用Office ...

随机推荐

  1. codeforces 765 D. Artsem and Saunder(数学题)

    题目链接:http://codeforces.com/contest/765/problem/D 题意:题目中给出你两个公式,g(h(x))==x,h(g(x))==f(x).现给你f(x) 让你求符 ...

  2. Windows下安装youtube-dl(下载各大网站视频)

    youtube-dl干什么用的? 惯例,看官方介绍: youtube-dl is a command-line program to download videos from YouTube.com ...

  3. Docker笔记(十):使用Docker来搭建一套ELK日志分析系统

    一段时间没关注ELK(elasticsearch —— 搜索引擎,可用于存储.索引日志, logstash —— 可用于日志传输.转换,kibana —— WebUI,将日志可视化),发现最新版已到7 ...

  4. WEB-UI自动化测试实践

    一.设计背景 随着IT行业的发展,产品愈渐复杂,web端业务及流程更加繁琐,目前UI测试仅是针对单一页面,操作量大.为了满足多页面功能及流程的需求及节省工时,设计了这款UI 自动化测试程序.旨在提供接 ...

  5. android 实现 波纹效果+图片左右无限滑动缩放效果

    项目中用到的 ,记录下.说不定下次又用到了.就提取出来了. 录制效果一般,将就看吧.代码地址如下 https://yunpan.cn/ckQaXMpYwdUnn (提取码:7ac7)

  6. cobbler高可用方案

    一.环境准备 主网IP 私网IP 主机名 角色 VIP 10.203.178.125 192.168.10.2 cnsz22VLK12919 主 10.203.178.137,192.168.10.1 ...

  7. 代理损失函数(surrogate loss function)

    Surrogate loss function,中文可以译为代理损失函数.当原本的loss function不便计算的时候,我们就会考虑使用surrogate loss function. 在二元分类 ...

  8. CentOS7上OpenResty安装

    1,OpenResty安装 通过repl源安装: sudo yum-config-manager --add-repo https://openresty.org/yum/cn/centos/Open ...

  9. Redis压缩包win10快速启动之记录一

    转载请标明出处: http://dujinyang.blog.csdn.net/ 本文出自:[奥特曼超人的博客] Redis压缩包 配置环境变量,直接CMD中启动,默认是打开redis.conf,当然 ...

  10. PLC与上位机的socket通讯——上位机C#程序(二)

    C#的网口通信 一.命令行 客户端程序:using System;using System.Collections.Generic;using System.Linq;using System.Tex ...