网站页面水印效果的实现（下）：页面水印防篡改

上一节 （网站页面水印效果的实现（上）：页面水印的添加）和大家介绍了页面水印如何生成以及如何使用，这一节来介绍如何防止水印被篡改，其实重点就是水印被删除。毕竟辛辛苦苦搞出来的水印，是为了保护自己的知识产权，结果被人轻轻松松就给搞掉了，岂不是悲哀。

要防止被篡改，就需要先知道有哪些方法可以进行篡改。直接在页面操作不太可能，但是其实如果不加防范，可以非常轻松的就把水印干掉。可以从客户端浏览器的开发者工具中，通过浏览Elements信息，找到水印对应的div将其删除，就可以轻松的将水印删除。

知道了水印如何被攻击和篡改，也就大致有了应对的解决方案。只要在程序设计时，监听水印信息的变化，从而判断是否需要重新生成水印即可。那又如何才能知道水印信息是否发生变化哪？

上一节中，曾提到有四点需要注意的关键因素：

一、要使用js动态加载div元素，不能通过直接在页面添加div标签的方式创建

        现在大家明白是为什么了吧，如果直接在html创建div元素，一旦被删除，如何重新生成，反而相当麻烦，倒不如从一开始就把他搞成动态的，这就简单多了，一旦发现前端将水印签名遮罩层div给删除了，直接重新运行一遍被watchEffect包裹的代码逻辑即可恢复水印。