这篇文章聊到的「前端水印防篡改」方法，本来是想作为一份专利提交给公司的，但我下笔之前去国内的专利检索网站上搜了下，发现一模一样的方案已经被申请，但考虑到这个方案又简单又管用，所以在这里分享给大家。

一、需求背景 1.1 数据安全 出去安全考虑，浏览管理后台的时候必须加上网页水印，来防止用户截图或者录屏暴露敏感信息后无法追踪用户来源。 1.2 技术方案 前端添加水印 安全系数较低，容易被懂前端技术

下面的只是简单的加一个很浅的水印，实现起来很容易。 它的作用是在当前页面上增加了一个透明度只有0.005的很多的水印。水印内容“测试水印，saucxs，测试水印，songEagle，工号等”。 当然是需要使用者不知道这个页面有水印，保证一些信息的安全性以及泄露之后可以追踪到是谁…

最近有个项目需要在页面上加上水印。这里尝试了一个实现方案。 left top repeat属性表示背景图像将从left,top开始向垂直和水平方向重复。 支持多个参数，传多个参数时，将分行展示。 当然，该方法也可以直接写在页面js里面。 防止DOM还没加载完的情况出现。

前段时间做某系统审核后台，出现了审核人员截图把内容外泄露的情况，虽然截图内容不是特别敏感，但是安全问题还是不能忽视。于是便在系统页面上面加上了水印，对于审核人员截图等敏感操作有一定的提示作用。 Canvas兼容性 这里我们用canvas来生成base64图片，通过CanIUse…

一、问题背景 为了防止信息泄露或知识产权被侵犯，在web的世界里，对于页面和图片等增加水印处理是十分有必要的，水印的添加根据环境可以分为两大类，前端浏览器环境添加和后端服务环境添加，简单对比一下这两种

图一斜纹类：创建一个和页面一样大的画布，根据页面大小以及倾斜角度大致铺满水印文字，最后转化为一张图片设为背景图二倾斜类：将文字倾斜后转化为图片，然后设置背景图片repeat填充整个页面这里我只简略分析