文档预览功能使用技巧(4)---图片水印

本文涉及的产品
对象存储 OSS,20GB 3个月
阿里云盘企业版 CDE,企业版用户数5人 500GB空间
日志服务 SLS,月写入数据量 50GB 1个月
简介: 智能媒体管理提供了文档预览功能,通过快速搭建文章的介绍,详细描述了使用“文档转换 + JS 前端渲染引擎”实现文档预览的过程,本文将介绍预览功能中的 图片水印(wmType=2 和 wmValue=url 参数)技巧。

一、导语

智能媒体管理 提供了文档预览功能,通过 快速搭建 文章的介绍,详细描述了使用 “文档转换 + JS 前端渲染引擎” 实现文档预览的过程,本文将介绍预览功能中的 图片水印(wmType=2 和 wmValue=url 参数) 技巧。

二、技术背景

通过 快速搭建 提供如下的预览 URL:

https://preview.imm.aliyun.com/index.html
?url=https://yourid-dev-imm.oss-cn-shanghai.aliyuncs.com/test-data/office/paxos.pptx/output    //无需在output后加'/'
&region=oss-cn-shanghai    //转换数据所在桶的region
&bucket=yourid-dev-imm    //转换数据所在桶

此时,可以在浏览器中预览,如下图所示(注意,预览内容没有水印):

Original

三、使能图片水印

实际上,智能媒体管理 可以通过增加 wmType=2 & wmValue=url 参数,在预览时显示图片水印,此时预览 URL 为:

https://preview.imm.aliyun.com/index.html
?url=https://yourid-dev-imm.oss-cn-shanghai.aliyuncs.com/test-data/office/paxos.pptx/output    //无需在output后加'/'
&region=oss-cn-shanghai    //转换数据所在桶的region
&bucket=yourid-dev-imm    //转换数据所在桶
&wmType=1    //水印类型为文字型
&wmValue=https://your-domain.com/wm.jpeg    //水印显示的图片URL地址

此时,效果如下图所示(注意,在原有文字背景显示了图片水印):

WaterMark

四、使用场景

通过控制 图片水印 参数(wmType=2&wmValue=url),您可以控制预览时,在浏览器中显示图片水印内容,从而更好的实现文档的安全管控、以及更炫的美化效果。

五、参考文档

  1. 智能存储产品文档转换/预览功能总结(4)---快速搭建
目录
相关文章
|
JavaScript
Fastadmin列表的多图预览(一行代码)
Fastadmin列表的多图预览(一行代码)
312 0
|
5月前
|
JavaScript 容器
富文本的图片添加点击放大功能
思路:富文本加载后,dom出全部img元素,然后各自单独添加点击事件
229 3
|
11月前
|
Android开发
安卓图片预览实现
安卓图片预览实现
49 0
如何利用ps工具,裁量咱的素材小图标和如何获取到大小合适的素材图标呢(各自图标素材集中于一张png图片上)
如何利用ps工具,裁量咱的素材小图标和如何获取到大小合适的素材图标呢(各自图标素材集中于一张png图片上)
172 0
如何利用ps工具,裁量咱的素材小图标和如何获取到大小合适的素材图标呢(各自图标素材集中于一张png图片上)
|
定位技术 API
百度地图API : 自定义标注图标
百度地图API : 自定义标注图标
|
C# 数据安全/隐私保护 缓存
使用WPF将图片转变为灰度并加上水印并保存为文件
原文:使用WPF将图片转变为灰度并加上水印并保存为文件 运行效果: (上图中左下角为原图的缩小显示,By:Johnson为TextBlock)保存的结果图片:上图的“Test Words.”为水印文字。
1033 0
|
Web App开发 存储 数据安全/隐私保护
文档预览功能使用技巧(3)---文字水印
智能媒体管理提供了文档预览功能,通过快速搭建文章的介绍,详细描述了使用“文档转换 + JS 前端渲染引擎” 实现文档预览的过程,本文将介绍预览功能中的文字水印技巧。
3318 0
|
Web App开发 索引
文档预览功能使用技巧(1)---文字拷贝
智能媒体管理提供了文档预览功能,通过 快速搭建 文章的介绍,详细描述了使用“文档转换 + JS 前端渲染引擎”实现文档预览的过程,本文将介绍预览功能中的 文字拷贝 技巧。
2058 0
|
前端开发 JavaScript HTML5
使用readAsDataURL方法预览图片
使用FileReader接口的readAsDataURL方法实现图片的预览。  在FileReader出现之前,前端的图片预览是这样实现的:把本地图片上传到服务器,服务器把图片地址返回,并把它替换到图片元素的src属性。
1908 0