最近在项目(B/S)中客户要求页面中实现屏幕截图的功能(如WEB QQ屏幕截图那种),起初看了很多JS实现图片截取,如Jquery的插件Jcrop,但是功能和所需要的不一样。此类插件只是实现已有图片的剪切,实现原理一般是在客户端定位需要剪切的图片x,y坐标,然后将参数传给服务器,由服务器实现图片的截取, 实现类似新浪博客头像编辑的功能。
http://www.iteye.com/topic/510980
Google之后,目前做这种实现的一般有以下几种方式:
1. 使用AcitveX或者其他的浏览器插件。
看了下Web QQ,貌似是按照这种方式做的,不过测试了目前只有IE和FF可以支持屏幕截图,Chrome下连图标都没有。由于系统需要跨浏览器访问,如果为了实现这个功能分别为不同的浏览器开发插件的话就比较麻烦了。
2. Flash
不熟,请高手指点。
3. Java Applet
首先,在JAVA中做屏幕截图是可以的。感谢leesonhomme提供的源码
http://leesonhomme.iteye.com/blog/451840。
然后将用到的类打成jar包, Cmd 切换到web-info/classes目录下,通过如下命令打包:
jar -cvf snapshot.jar *.*
当然,也可以使用其它工具如Fatjar。
现在,可以编写页面了:
<HTML>
<BODY >
<APPLET
code = "Snapshot.class"
ARCHIVE = "snapshot.jar"
width = "70"
height = "30"
>
</APPLET>
</BODY>
</HTML>
此时访问该页面,会提示Access Denied错误,这是由于Java的沙盒安全模型的存在,使得未签名的applet在客户端被禁止执行某些操作,比如读写文件或者连接局域网。经过签名的applet能够向用户验证applet的编写者:他是否真的编写了这个applet;此jar文件离开 服务器后,内容是否被篡改过。如果没有这些最基本的保证,applet将不被允许执行任何有可能破坏用户机器,或者侵犯用户隐私的操作。要在互联网上安全地使用applet,这些限制非常重要,不过相对来说,这也限制了applet的能力。
为了使得applet能够访问本地的应用,比如剪切板,需要给它签名。
keytool -genkey -keystore snapshot.store -alias snapshot
这个命令用来产生一个密匙库,执行完毕后应该产生一个 hello.store的文件,这个名字你可以对它进行修改。另外在执行命令的时候还有提示你输入密匙库的密码,这里你一定要记住,否则后面要用的时候无法输入。输入密码后,它会提示你输入用户名,公司名等信息,这些都不是必须输入的,你可以直接回车跳过,最后问你输入是否正确,你可以输入y或n回答正确或错误。
keytool -export -keystore snapshot.store -alias snapshot -file snapshot.cert
这个命令用来产生签名时所要用的证书,这个命令执行完后产生一个pepper.cert的文件.
jarsigner -keystore snapshot.store snapshot.jar snapshot
这个命令用上面产生的证书将我们的jar文件进行了签名。最后把该jar包拷贝到jsp文件所在地目录下。
再访问网页,我们所需要的功能就有了。不过有一个缺陷:就是applet中的按键样式和页面统一风格不统一。
我们可以用JNLP的方式加载java文件。首先编写JNLP配置文件:
<?xml version="1.0" encoding="UTF-8"?>
<!-- file snapshot.jnlp -->
<jnlp codebase="http://localhost:8080/snapshot/" href="http://localhost:8080/snapshot/snapshot.jnlp">
<information>
<title>Snapshot</title>
<vendor>Snapshot</vendor>
<icon href="google.jpg"/>
</information>
<resources>
<j2se version="1.2+"/>
<jar href="snapshot.jar"/>
</resources>
<application-desc main-class="ScreenCapture"/>
</jnlp>
在上面的代码基础上,需要加上以下属性:
<security>
<all-permissions/>
</security>
否则在运行时同样会报access denied错误。
编写页面文件:
<a href="snapshot.jnlp">Snapshot</a>
但这样做同样有个缺陷,就是每次点击它的时候都需要弹出下载窗口然后打开,用户体验很不好。
于是,修改之前的页面如下:
<a href="#" onclick="openSnapshot()">Snapshot2</a>
<div id="test">test</div>
<script type="text/javascript">
function openSnapshot() {
//window.open("index2.html");
$("#test").load("index2.html",function(){
console.log("success");
})
}
</script>
index2.html:
<HTML>
<BODY >
<APPLET
code = "Snapshot.class"
ARCHIVE = "snapshot.jar"
width = "0"
height = "0"
>
</APPLET>
</BODY>
</HTML>
applet的宽度和高度都为0,相当于是个隐藏的元素。
附上源码,供大家讨论指教。
修改【2011-4-8】:
当我将页面放到项目中时,出现一个诡异的问题:当从HTML文件使用AJAX加载Applet时运行正常;当从JSP文件中(Struts2中的Action)加载时一直出现classNotFoundException。经过不断的尝试,最终发现是ARCHIVE设置的问题。
如果从Action页面中加载,ARCHIVE需要从项目根路径开始找,于是将其修改为:
<HTML>
<BODY >
<APPLET name="screenshotApplet" id="screenshotApplet" code = "org.myproject.snapshot.Screenshot.class"
ARCHIVE = "/【项目名】/screenshot/snapshot.jar" codebase="." width = "0" height = "0">
</APPLET>
</BODY>
</HTML>
还有就是IE中有时出现JVM 加载失败,Firefox中有时打开后看到鼠标变成了叉,但是选取的时候没有任何反应,不晓得是怎么回事。。。
分享到:
相关推荐
网上购物系统采用B/S结构,即Browser/Server(浏览器/服务器)架构,是现代电子商务系统中广泛应用的一种设计模式。这种结构充分利用了互联网的分布式特性,为用户提供了便捷的访问方式,用户只需要通过标准的Web...
9. **移动设备兼容**:随着移动设备的普及,Web报表B/S系统需支持响应式设计,适应各种屏幕尺寸,确保在手机和平板上也能良好展示。 10. **API集成**:系统通常提供API接口,允许其他应用或服务调用报表,实现数据...
**B/S架构学生信息管理系统详解** B/S架构(Browser/Server,浏览器/服务器模式)是一种分布式客户端-服务器架构,它将应用逻辑主要放在服务器端,而客户端只需通过浏览器即可访问和交互。这种架构大大简化了用户的...
【基于B/S的学生信息管理系统】是一种典型的Web应用程序,它遵循浏览器/服务器(Browser/Server)架构模式,使得用户可以通过Web浏览器来访问、管理和更新学生信息。这种系统在教育机构中广泛应用,简化了对大量学生...
Dreamweaver,mysql ,java”指的是一种使用B/S(Browser/Server,浏览器/服务器)架构开发的在线体育用品销售平台,它结合了Dreamweaver作为网页设计工具,MySQL作为后台数据库系统,以及Java作为服务器端编程语言的...
1. **B/S架构**:B/S架构的核心特点在于客户端只需通过浏览器即可访问服务器,减轻了客户端的维护负担,降低了系统的部署成本。服务器端则负责处理复杂的业务逻辑和数据管理。 2. **Java技术栈**:在Java环境下,...
在IT行业中,B/S(Browser/Server)架构是一种广泛应用的网络应用模式,它将客户端的大部分功能交由浏览器来处理,而服务器主要负责数据管理和业务逻辑处理。在"newpages.zip_B/S新闻"这个压缩包中,我们看到的是一...
在线考试系统B/S是一种基于浏览器/服务器(Browser/Server)架构的软件系统,它使得学生可以在互联网上进行考试,而教师或管理员可以便捷地管理考试题目、安排考试时间以及批改试卷。这样的系统大大提高了教育机构的...
B/S(Browser/Server,浏览器/服务器)架构是一种常见的网络应用程序架构模式,它基于Web浏览器和服务器之间的交互来实现业务逻辑。在这个架构中,用户通过浏览器进行操作,所有的业务处理和数据存储都在服务器端...
在线考试系统B/S版是一种基于浏览器/服务器架构(Browser/Server)的应用程序,它允许用户通过互联网进行在线考试、测试和评估。这种系统通常由一个中央服务器管理,学生和教师可以使用任何支持Web的设备访问,无需...
为了减少对现有自动化系统的干扰,文中特别提到仅在技术监控席部署终端软件,以实现系统应用的验证。 Java语言作为系统开发的核心,主要用于实现屏幕录像的MPG4编码,同时采用了Shell脚本在Unix系统下实现文件传输...
系统采用B/S(Browser/Server)架构,即浏览器/服务器模式,这意味着用户可以通过网页来访问和控制监控系统,无需安装特定客户端软件,提升了使用的便捷性和兼容性。 1. **Java技术**:Java是该系统的后端开发语言...
* 实现网站的客户端逻辑:B/S系统模式可以实现网站的客户端逻辑,如用户界面、数据交互等。 * 实现网站的服务器逻辑:B/S系统模式可以实现网站的服务器逻辑,如数据处理、业务逻辑等。 * 实现网站的数据交互:B/S...
本论文将探讨一个基于Java JSP技术,利用SSH框架构建的B/S模式文章发布系统的设计与实现。 **一、系统架构** 1. **B/S模式**:B/S(Browser/Server)模式是一种客户端/服务器架构,用户通过浏览器访问服务器上的...
总的来说,B/S网站后台管理静态页的设计和开发涵盖了前端技术的多个层面,不仅需要考虑页面的视觉呈现,还要注重用户体验和功能实现,同时也要遵循良好的开发实践,以实现高效、稳定和可维护的后台管理界面。
这里,我们主要关注的是一个名为"rhs_web"的B/S(浏览器/服务器)架构的网上注册功能模块和"rhs_sjj"的C/S(客户端/服务器)架构的聊天系统,该系统具有远程控制功能。 首先,让我们了解一下"rhs_web"。这是一个...
远程视频监控系统通常分为C/S(客户端/服务器)结构和B/S(浏览器/服务器)结构。C/S结构安全性高,但用户固定;B/S结构则用户可随时访问,但安全性相对较低。考虑到系统的灵活性和实用性,本设计可能采用了B/S结构...
B/S模式则无需安装客户端,用户通过浏览器即可访问白板服务,系统维护和升级更为方便,适用于需要跨平台访问的场景。 关键技术五:协议设计 在网络通信过程中,需要定义特定的通信协议来确保信息的正确解析和处理。...
Web端通常基于B/S架构(Browser/Server),用户通过浏览器即可访问和操作。在这个系统中,"tpt-web端源码.zip"包含了前端界面和后端服务器逻辑。前端可能采用了HTML、CSS和JavaScript,构建了用户友好的交互界面,而...
基于JAVA技术的B/S结构视频会议系统旨在解决传统硬件和C/S结构视频会议系统的局限性。传统的硬件解决方案成本高昂,而C/S结构需要安装客户端,限制了移动性和可移植性。本系统采用JAVA的Java Media Framework (JMF)...