优道屏幕在线截图控件使用帮助

功能概述

优道屏幕在线截图控件是一款基于WEB的在线屏幕截图产品,支持嵌入到IE、Edge、FireFox、Chrome、Opera等各类浏览器当中在线使用。用户对电脑屏幕进行截图后可以将截取到的图片保存到指定的服务器上。截图时控件能对窗口进行智能识别,可以实现对整个屏幕、程序窗口和固定区域的截图。在图形截取后自带有工具条实现对图片的在线标注功能,可以在截取的图形上绘制矩形、椭圆、箭头及输入文字,并可在线或离线保存截取的图片。

控件使用简单、兼容性强,适合在OA系统、信息管理和发布系统、网站后台、邮箱、在线协作工具等应用中使用,支持嵌入到各类WEB网页编辑器当中。这个控件我们免费提供,只有部分特殊功能收费,您可以免费使用在您现有的产品当中。如果您有特别的需求或者需要进行OEM定制,也可以与我们进行联系。

运行环境

服务器端:支持Windows和Linux操作系统,支持任何的服务器编程语言,例如asp,asp.net,php,java,python,ruby等

控件客户端支持的操作系统:Win7/Win8/Win10/2008/2012/Vista/2016

支持32位及64位操作系统和各种浏览器

支持ssl加密传输,同时支持http和https两种请求方式

给页面添加截图功能

您可以参考我们提供的演示文件在网页中嵌入屏幕在线截图功能:

我们支持面向对象方式的组件式调用方式,所有细节的处理已经封装到UdCapture.js中,只需要引用UdCapture.js即可立即使用截图功能

初始化的调用方式为:var udCapture = new UdCapture("截图按钮ID",{Json格式设置的属性或事件定义});


    window.onload = function () {
        //其中"btnCapture"为截图按钮的ID
        var udCapture = new UdCapture({
            CaptureButton:"btnCapture",
            OnClick: function () {
                udCapture.AutoMinimize = document.getElementById("autoMin").checked;
                if (document.getElementById("captureScreen").checked)
                    udCapture.CaptureScreen();
                else if(udCapture.AutoMinimize)
                    udCapture.Capture();
                else
                    udCapture.StartCapture();
            },
            OnStartSetup: function () {
                f_log("正在进行安装,安装完成后请<a href=''>刷新当前页面</a>!");
            },
            OnBeforeCapture: function () {
                f_log("开始截图");
            },
            OnCaptureCanceled: function () {
                f_log("已取消截图");
            },
            OnCaptureCompleted: function () {
                //调用控件的上传方法完成上传
                f_log("正在上传截图...");
                udCapture.Upload("SaveImage.ashx");
            },
            OnUploadFailed: function () {
                f_log("图片上传失败");
            },
            OnUploadCompleted: function (responseText) {
                f_log("图片上传完成.");
                var json = eval("(" + responseText + ")"); //因为返回文本所以要转换json格式,随机数防止缓存
                document.getElementById("snapImg").innerHTML = "<img src=\"" + json.filepath + "?" + Math.random() + "\">"
            }

        });
    }
    

后端服务器上保存上传图片的C#代码:


    HttpPostedFile file = context.Request.Files["UploadFile"];
    if (file != null)
    {
        string ext = System.IO.Path.GetExtension(file.FileName).ToLower();
        if (ext == ".jpg" || ext == ".png" || ext == ".bmp" || ext == ".gif")
        {
            string filePath = "Upload/" + System.IO.Path.GetFileName(file.FileName);
            file.SaveAs(context.Server.MapPath(filePath));
            context.Response.Write("{\"filepath\":\"" + filePath + "\"}");
        }
    }

控件属性

一般通用属性:

属性名称类型属性说明
CaptureButton字符或对象截图按钮的id或截图按钮对象
License字符获取或设置控件的注册码信息
FileName字符获取或设置截图后保存文件的名称及上传文件的名称,默认值为:SnapScreen.png
FileField字符获取或设置文件上传的域,默认值为:UploadFile,相当于<input type="file" name="UploadFile">
此属性只在使用文件直接上传方式时使用
AutoMinimize布尔获取或设置是否截图时自动把当前窗口最小化。(注册版可用)
TipInfo字符获取或设置动态选择截图区域时提示的文字内容。(注册版可用)
UILanguage字符获取或设置控件所使用的界面语言,en为英文、cn为中文简体、tw为中文繁体,留空为根据操作系统自动判断所使用的语言
IsReady布尔获取控件是否已经准备好可以使用

 

控件方法

方法名称参数说明方法说明
void StartCapture()启动截图窗口进行屏幕截图
void Capture()不弹出截图提示窗口,立即进行截图(注册版可用)
void CaptureWindow()对当前活动窗口进行截图并直接上传(注册版可用)
void CaptureScreen()对当前屏幕进行截图并直接上传(注册版可用)
void CaptureRect(int left,int top,int width,int height)left:矩形区域左上角水平位置;
top:矩形区域左上角垂直位置;
width:要截取的矩形宽度;
height:要截取的矩形高度
对屏幕指定矩形区域进行截图并直接上传(注册版可用)
void Upload(string postUrl,string postParams)调用文件直接上传方法将截图上传到指定的URL
postUrl:要提交请求的页面地址,支持相对地址
postParams:同时提交的其他POST参数,以“&”进行分隔,例如:name=cn&age=32
void GetBase64(callback)callback:获取到数据后的回调函数获取截图的Base64编码数据,GetBase64(function(data){...});
string GetImageUrl()获取截图的本地URL地址
string GetVersion()获取截图客户端的版本号
void Destory()释放组件资源

 

控件事件

事件名称参数说明事件说明
OnClick()如果指定了截图按钮,点击时触发,可以在此事件中根据需要调用不同的截图方法
OnStartSetup(setupFile)setupFile:默认安装包文件路径开始安装控件时触发该事件,返回true可以在事件中实现自定义的下载界面而不使用默认的下载处理
OnBeforeCapture()开始准备截图时触发该事件
OnCaptureCompleted()屏幕截图完成时触发该事件
OnCaptureCanceled()截图操作被取消时触发该事件
OnBeforeUpload()截图上传前触发该事件(文件直接上传方式时支持)
OnUploadCompleted(data)data:服务器端返回的响应内容将图片上传到服务器后触发该事件,可以根据服务器端返回内容ContentType确定返回数据是文本还是json对象(文件直接上传方式时支持)
OnUploadFailed()上传失败时触发该事件(文件直接上传方式时支持)

 

其它

  • 关于优道:珠海市优道信息科技有限公司是一家专业的浏览器插件技术开发公司,致力于解决浏览器不能到达的最后一公里的问题,为客户提供广泛的文档、图片和数据安全保护方面的产品和解决方案。
  • 优道网站:www.uudoc.com
  • 优道服务热线:0756-2132796,技术支持邮件:support@uudoc.com,技术支持QQ:13063574