功能概述
优道图片版权保护控件（UUDoc Image Control）是一款图片版权保护中间件产品，支持使用加密传输的方式从远程加载图片，运行时可禁止屏幕截图工具对所展示图片进行的截取，能有效的保护您所展示的图片。控件使用独特的服务器端配置模式，支持在服务器端对控件进行属性设置, 防止了客户端通过脚本对版权控制功能进行篡改的可能.
控件采用ActiveX技术和NPAPI标准进行开发，自带有缩放、拖拽、旋转等常用图片展示控制功能，可以轻松的嵌入到各类网站、Web应用系统和桌面客户端程序当中，能有效的和您目前的应用进行集成，给您最有力的数字版权保护功能支持。
控件支持查看大格式图片文件，支持的图片格式众多，目前可以支持的文件格式有：BMP, ICO, GIF, JPEG, PNG, JFIF, EXIF, TIFF, WMF, EMF, DIB 等
运行环境
服务器端：支持Windows和Linux操作系统，支持任何的服务器编程语言，例如asp,asp.net,php,java,python,ruby等
控件客户端支持的操作系统：WindowsXP/2003/2008/Vista/Win7/Win8
支持32位及64位操作系统和浏览器
支持嵌入到基于ActiveX技术的IE浏览器和使用NPAPI技术的非IE浏览器中
网页中嵌入控件
您可以参考我们提供的演示文件在网页中嵌入优道图片版权保护控件：
控件的PlogId为:UdImage.Viewer
控件的ClassId为:726CEE05-A023-46AC-993F-C9C0134EBFE8
控件的ContentType为: application/udimage-plugin
<object id="udImg" width="800" height="600"
classid="CLSID:726CEE05-A023-46AC-993F-C9C0134EBFE8"
codebase="axUdImage32.msi#version=1,6,0,0">
<param name="License" value="" />
<param name="FileId" value="0" />
<param name="Encryped" value="1" />
<param name="HashKey" value="3CE59E850E2C590AFD6E4D3516BA3F1B" />
<embed id="udImagePlugin" width="800" height="600" type="application/udimage-plugin"
License="" EnableCapture="0" HashKey="3CE59E850E2C590AFD6E4D3516BA3F1B"
onReady="f_onReady" onClick="f_onClick" onDblClick="f_onDblClick" onDownload="f_onDownload"
onZoom="f_onZoom" onRotate="f_onRotate" onReady="f_onReady onError="f_onError"></embed>
</object>
其中axUdImage32.msi为控件的32位安装程序，axUdImage64.msi为控件的64位安装程序，安装后控件支持IE访问；npUdImage.msi为NPAPI版的安装程序，安装后支持FireFox、Chrome、Safari等使用NPAPI标准的非IE浏览器使用。
判断控件是否安装：
<script type="text/javascript">
var ctl;
var UDIMAGE_VERSION = "1.6.0";//当前最新的控件版本号
//版本比较，检查是否安装了新版本
function f_hasNewVer(instVer)
{
var newVer = UDIMAGE_VERSION.split(".");
var curVer = instVer.split(".");
if(parseInt(newVer[0]) > parseInt(curVer[0]))
return true;
if(parseInt(newVer[0]) == parseInt(curVer[0])
&& parseInt(newVer[1]) > parseInt(curVer[1]))
return true;
if(parseInt(newVer[0]) == parseInt(curVer[0])
&& parseInt(newVer[1]) == parseInt(curVer[1])
&& parseInt(newVer[2]) > parseInt(curVer[2]))
return true;
return false;
}
//初始化加载
function f_onload() {
if(window.ActiveXObject)//IE
{
var axobj = null;
var setupFile = "UdImage/axUdImage32.msi";
//64位浏览器安装文件
if(window.navigator.platform == "Win64"
|| window.navigator.cpuClass == "x64")
setupFile = "UdImage/axUdImage64.msi";
try{
axobj = new ActiveXObject('UdImage.Viewer');
}catch(e){}
if(axobj) {
if(f_hasNewVer(axobj.GetVersion())){
document.getElementById("ctlDiv").innerHTML =
"<a href='" + setupFile + "'
class='inst'>优道图片控件有新版本v" + UDIMAGE_VERSION
+ "，点这里升级安装...</a>";
}
else{
ctl = document.getElementById("udImageCtl");
}
}
else{
document.getElementById("ctlDiv").innerHTML =
"<a href='" + setupFile + "' class='inst'
>您尚未安装优道图片控件，点这里进行安装...</a>";
}
}
else
{
//NOT IE
var setupFile = "UdImage/npUdImage.msi";
if (navigator.plugins && navigator.plugins.length > 0)
{
var plugin = navigator.plugins["UdImage Plugin"];
if(plugin){
ctl = document.getElementById("udImagePlugin");
if(f_hasNewVer(ctl.GetVersion())){
document.getElementById("ctlDiv").innerHTML =
"<a href='" + setupFile + "' target='_blank'
class='inst'>优道图片插件有新版本v" + UDIMAGE_VERSION
+ "，点这里升级安装...</a>";
}
}
else{
document.getElementById("ctlDiv").innerHTML =
"<a href='" + setupFile + "' target='_blank' class='inst'
>您尚未安装优道图片插件，点这里进行安装...</a>";
}
}
else
document.getElementById("ctlDiv").innerHTML = "当前浏览器不支持插件";
}
}
</script>
属性的设置示例：
<script type="text/javascript">
//根据复选框判断是否显示边框，并指定边框颜色为红色
function f_showBorder() {
if (document.getElementById("chkShowBorder").checked) {
//边框显示为红色,RGB = R + G * 256 + B * 256 * 256
ctl.BorderColor = 255;
ctl.ShowBorder = 1;
}
else {
ctl.ShowBorder = 0;
}
}
</script>
方法的调用示例
<script type="text/javascript">
//顺时针旋转图片
function f_rotateLeft() {
ctl.RotateLeft();
}
//逆时针旋转图片
function f_rotateRight() {
ctl.RotateRight();
}
</script>
事件的捕捉示例，兼容所有浏览器：
<script type="text/javascript" event="OnError()" for="udImageCtl">
f_onError(errorCode);
</script>
<script type="text/javascript">
function f_onError(errorCode){
document.getElementById("info").innerHTML = "OnError事件，错误码：" + errorCode;
}
</script>
服务器图片加密
使用优道科技提供的文档加密工具UdImgTools.exe对图片进行加密，加密后的文件会在原扩展名前加上en前缀。加密工具支持命令行方式。
加密时可以指定加密密码，加密后需要将密码的哈希值填写到控件的HashKey参数当中
将加密后的文件上传到服务器上，在控件页面根据所传递的参数将需要的加密文件读取并进行输出
若不想别人通过页面获取到参数的配置情况，可以使用此工具对属性配置内容进行加密，原配置字符串使用"&"分隔的键值对格式，多个参数之间使用"|"进行分隔，支持相应的属性或方法名称
也可在服务器上调用加密命令行工具直接完成普通图片文件到加密文件的转换，命令行使用说明：
参数说明:
-input <file> 要进行加密保护的图片文件名
-output <folder> 指定加密后的文件输出目录
-password <password> 设置加密使用的密码,会返回加密过的哈希码,可放在图片控件的HashKey属性当中
-encrypt <config> 创建使用"&"进行分隔的加密字符串,可在控件的EncryptConfig属性
和EncryptExecute方法中使用
-help 显示UdImgTools.exe的使用帮助信息
使用示例:
UdImgTools -input c:\test.jpg -output "c:\hello world" -password 123abc
以下是对属性配置进行加密,加密后的字符串可以放在EncryptConfig属性当中
UdImgTools -encrypt "EnableCapture=false&EnableZoom=true"
以下是对方法进行加密,支持"|"分隔的多个参数,加密后的字符串可以用EncryptExecute(string)函数来执行
UdImgTools -encrypt "LoadFromWeb=getfile.asp|post"
ActiveX控件的FileId会被提交回服务器，可以根据该值输出不同的文件，以下是C#的服务器ASP.NET示例代码，也可方便的用其它语言编写：
protected void Page_Load(object sender, EventArgs e)
{
if (Request.Form["uudoc_getfile"] == "1")//如果是提交请求文件
{
//可以通过HashKey的设置进行HTTP头安全校验
if (Request.Headers["UdImage-HashKey"] != "3CE59E850E2C590AFD6E4D3516BA3F1B")
return;
//根据文件ID获取不同的加密文件或原始文件，需要根据实际情况编写自己的业务逻辑
if (Request.Form["uudoc_encrypted"] == "1")//是否使用加密读取方式
{
//读取加密过的图片
Response.WriteFile(Server.MapPath("upload/"
+ Request.Form["uudoc_fileid"] + ".enjpg"));
}
else
{
//读取原始文件
Response.WriteFile(Server.MapPath("upload/"
+ Request.Form["uudoc_fileid"] + ".jpg"));
}
Response.End();
}
}
提交的参数说明：
| 参数名称 | 参数说明 |
|---|---|
| uudoc_getfile | 1表示开始从后台读取文件 |
| uudoc_fileid | 文件Id值，用来判断要读取的文件名称，对应前端控件设置的FileId属性值 |
| uudoc_encrypted | 1表示采用的是加密文件读取方式 |
服务器端版权控制
优道图片版权保护控件支持服务器端的属性设置，在服务器端进行属性设置后客户端的部分版权控制功能将不再有效，从而更安全的保护了图片的安全性。
服务器端使用http头的方式对控件属性进行设置，支持的http头设置的名称为UdImage-Config和UdImage-EncryptConfig。
UdImage-Config配置的参数值为使用“&”分隔的字符串，例如"EnableCapture=false&EnableZoom=false"。
UdImage-EncryptConfig配置的参数值为以上加密后的字符串内容，具体加密方法请参看上一节中UdImgTools.exe工具的使用
在C#/VB.NET中可以使用Response.AppendHeader进行http头的设置，例如：
Response.AppendHeader("UdImage-Config", "EnableCapture=false&Zoom=100");
或者：
Response.AppendHeader("UdImage-EncryptConfig", "***加密后的字符串***");
在Java语言中可以使用response.setHeader进行http头的设置，例如：
response.setHeader("UdImage-Config", "EnableCapture=false&EnableZoom=false");
或者：
response.setHeader("UdImage-EncryptConfig", "***加密后的字符串***");
使用http头进行属性设置后下列和版权保护相关的属性在客户端的设置将不再有效：
| 服务器端设置影响的属性 | 参数说明 |
|---|---|
| HashKey | 加密密码Hash值，该值同时会被以http头的方式提交回服务器 |
| EnableCapture | 是否允许屏幕截图 |
| EnableZoom | 是否允许使用鼠标进行缩放操作 |
ActiveX控件向服务器请求文件的时候同时会以http头的方式提交下列值：
- UdImage-Version：优道图片版权保护控件的当前版本号
- UdImage-HashKey：HashKey属性，可用作请求合法性校验
- UdImage-UrlType：如果使用相对路径来请求的这里值为0，使用绝对路径值为1，可以用来控制是否只允许相对路径来获取文件
在C#/VB.NET语言中可以使用Request.Headers["UdImage-UrlType"]来获取到相关的http头的值，Java中可以使用request.getHeader("UdImage-UrlType")来获取。
控件属性
| 属性名称 | 类型 | 属性说明 |
|---|---|---|
| Width | 整数 | 控件区域宽度 |
| Height | 整数 | 控件区域高度 |
| FillColor | 颜色 | 获取或设置控件的背景填充色 |
| ShowBorder | 布尔 | 获取或设置是否显示边框，默认为false |
| BorderColor | 颜色 | 获取或设置控件边框的颜色 |
| License | 字符 | 获取或设置控件的注册码信息 |
| HashKey | 字符 | 获取或设置密码的MD5 Hash值，可以用UdImgTools.exe命令行工具加参数-password <password>获取 |
| FileId | 字符 | 获取或设置文件的ID值，该值会提交回服务器端 |
| Zoom | 浮点 | 获取或设置图片的缩放比例，通常为10至1000之间；若设置为100，则按1：1显示；若设置为-1，则自动适应大小显示 |
| Encrypted | 布尔 | 获取或设置是否采用加密方式加载图片，默认为true，加载加密过的图片；若设置为false，则加载原始未加密的图片 |
| EnableZoom | 布尔 | 获取或设置是否允许进行缩放操作，默认为true |
| TextColor | 颜色 | 获取或设置控件文本的颜色 |
| EnableCapture | 布尔 | 获取或设置是否允许进行屏幕截图，默认为False不允许截图 |
| EncryptConfig | 字符 | 获取或设置图片打开时的加密配置字符串，加密需要使用UdImgTools.exe命令行工具，参看UdImgTools.exe相关说明 |
| IsReady | 布尔 | 只读属性，获取图片是否已加载完成，状态已就绪 |
控件方法
| 方法名称 | 参数说明 | 方法说明 |
|---|---|---|
| void ZoomIn() | 无 | 放大图片 |
| void ZoomOut() | 无 | 缩小图片 |
| void RotateLeft() | 无 | 左旋转90°，即顺时针旋转 |
| void RotateRight() | 无 | 右旋转90°，即逆时针旋转 |
| void LoadFromWeb(string url,string method) | url：加载地址，支持相对路径，空字符表示当前页 method（可选）：加载方法为"post"还是"get"，默认为"get" | 向WEB页面请求加载图片文件 提交参数为uudoc_getfile和uudoc_fileid |
| void LoadFromData(Byte[] pData) | pData：字节数组指针 | 从字节数组中加载图片 |
| void LoadFromFile(string fileName) | fileName：文件名 | 根据文件名加载指定图片 |
| int GetErrorCode() | 无 | 获取异常的错误码。详见错误码说明 |
| int GetImageWidth() | 无 | 获取图片的宽度 |
| int GetImageHeight() | 无 | 获取图片的高度 |
| int GetImageBPP() | 无 | 获取图片的位深度 |
| int GetImageSize() | 无 | 获取图片文件的字节大小 |
| int GetVersion() | 无 | 获取控件的当前版本号 |
| void EncryptExecute() | 无 | 执行加密字符定义的命令，具体参见UdImgTools.exe相关说明 |
| void ToggleFullScreen() | 无 | 对全屏幕显示状态进行切换，进入全屏幕或退出全屏幕显示 |
| void Close() | 无 | 关闭已打开的图片 |
控件事件
| 事件名称 | 参数说明 | 事件说明 |
|---|---|---|
| OnClick(int x,int y) | x:点击点的横坐标；y：点击点的纵坐标 | 单击控件时触发该事件 |
| OnDblClick(int x,int y) | x:双击点的横坐标；y：双击点的纵坐标 | 双击控件时触发该事件 |
| OnReady(int width,int height,int bbp,int size) | width：图片宽度；height：图片高度；bbp：位深度；size：图片大小 | 图片加载完成触发该事件 |
| OnDownload(int totalSize,int downSize) | totalSize：总共要下载的文件大小；downSize：已经下载的字节大小 | 图片下载过程中触发该事件 |
| OnError(int errorCode) | errorCode：错误码。详见错误码说明 | 出现异常时触发该事件 |
| OnZoom(int zoom) | zoom:缩放比例，通常在10至1000之间。-1:最适大小；100：原始比例 | 缩放图片时触发该事件 |
| OnRotate(int rotation) | rotation：旋转位置。 0：未旋转；1：顺时针90°；2：顺时针180°；3：顺时针270° | 旋转图片时触发该事件 |
| OnFullScreen() | 无 | 进入全屏幕显示时触发该事件 |
| OnExitFullScreen() | 无 | 退出全屏幕显示时触发该事件 |
错误码说明
| 错误码值 | 异常说明 |
|---|---|
| 0 | 一切正常 |
| 1 | 在虚拟机或远程桌面中查看图片 |
| 2 | 使用不支持的网络访问协议 |
| 3 | 加载图片安全组件失败 |
| 4 | 文件格式错误 |
| 5 | 加载文件失败 |
| 6 | 请求服务器失败 |
其它
- 关于优道：珠海市优道信息科技有限公司是一家致力于文档管理、数字版权保护和移动办公产品研发和推广的科技公司。
- 优道网站：www.uudoc.com
- 优道服务热线：0756-2132796，技术支持邮件：support@uudoc.com，技术支持QQ：13063574