security - 防止 SVG 被轻易逆向工程

Question

我刚开始在一家新公司工作，并被要求做我认为不可能的事情，但我需要对此进行确认。我公司的网站允许用户使用 SVG 以极高分辨率查看图像。我们为这些图像构建了一个自定义查看器，允许您缩放和滚动图像，并且效果很好。因此，图像格式“需要”保持 SVG。但是，我们需要为此图像添加水印。我们现在这样做的方法是将 SVG 和 PNG 水印传递给客户端，将水印插入到 SVG 中，然后将其显示给用户。任何有客户端经验的人都知道，这很明显很容易被黑客入侵(这里的开发团队大多是年长的开发人员，没有太多的网络经验)。即使原始 SVG 未被截获，他们仍然可以从源中删除水印。我已经说服我的老板在服务器端注入(inject)水印，所以这留下了最终客户端可编辑 SVG 的问题。

我想知道的是，如果这两件事之一是可能的:

1) 是否有另一种类似于 SVG 的图像格式可以用来保持这种高度可扩展的图像而不会降低分辨率，并且不会被终端客户端直接编辑？人们似乎在网络上讨论的唯一选项是 JPG、GIF、PNG 和 SVG。我已经查看了 Adob​​e Illustrator“.ai”文件和 EPS(Encapsulated PostScript)作为其他矢量选项，但是如果我可以在 PHP 中修改这些图像，我找不到任何地方，如果我想在其中覆盖水印，这是关键服务器端代码。

2) 有没有办法混淆原始 SVG 内容，以便用户无法操作它？我见过有 <image ...> 的 SVG之前用 PNG 表示长而复杂的字符串的标签。类似 xlink:href="data:image/png;base64..." .我想知道是否有一种方法可以将 SVG 显示为这个字符串，以便无法直接操作数据。我确信有一种算法可以逆转这些，但只要我们坚持使用 SVG，我就需要尽可能地确保它的安全，如果有人想窃取数据，我需要尽可能多地跳过这些箍。

无论哪种方式都是可以接受的，只要删除此水印比仅按 F12 键并删除开发工具内的元素更复杂。

Answer 1

是否有另一种类似于 SVG 的图像格式可以用来保持这种高度可扩展的图像而不会降低分辨率，并且不会被终端客户端直接编辑？

SVG 是一种矢量格式，为了保持极高的可扩展性，您需要坚持使用矢量，无论是任何格式。但是，在这种情况下，始终可以删除属于您的水印的矢量。当然，也有以二进制形式存储的矢量格式，这会使最终用户解析和编辑变得有些困难，但这些格式在 PHP 中也无法编辑，并且兼容性较差。所以你可能不想这样做。

有没有办法混淆原始 SVG 内容，以便用户无法操作它？

首先，在如上所述的意义上，它永远不会是“安全的”，总是可以从矢量图像中去除水印。 (顺便说一句，与 JPG 等位图格式的唯一区别是位图中水印以下的内容实际上丢失了，而在 SVG 中它仍然存在。)

但是，根据您希望这有多“好”，您可以做一些事情。我认为这里的“好”是指去除水印所需的努力，您可以相对轻松地提高标准。您不必(并且您可能无法合理地)混淆整个 SVG。

想到的一件事是SVG基本上只是XML，它由像<rect>这样的标签组成。 , <line> , <circle>等等。这些标签的顺序并不重要(大多数情况下，当然有异常(exception))。因此，您可以在现有标签中随机缠绕绘制水印的标签。我的意思是真的随机，所以不同的下载会产生不同的结果。如果你做得好(例如，你找到线标签来“隐藏”你的水印线标签，等等)，将很难自动删除水印，因为它是你的实际图像的相关数据。当然，水印在视觉上仍然可以在角落里，这已经是一个弱点，任何画到角落里的东西都有可能被自动去除。我想用任何像样的编辑器手动删除都很容易。所以这取决于目的是什么。

但是我仍然认为这种事情在许多情况下可能会使其变得足够困难(而在其他情况下则完全不够)。