在 HTML 页面上禁用拖放？

Question

假设您的网站上有受版权保护的图片。您绝对不希望任何人使用这些，但您也不希望在您网站上的每张图片上都有水印。

为了防止用户保存我的内容，我使用 JS 禁用了右键单击：

document.addEventListener('contextmenu', event => event.preventDefault());

我也禁用了拖放功能：

<html ondragstart="return false;">

但后来我认为用户可以在他们的浏览器中关闭 JavaScript 并仍然使用这两个功能。所以我使用 CSS（在这个网站上找到）尝试了以下操作：

html,body {
    -webkit-user-select: none;
    -moz-user-select:-moz-none;
    -ms-user-select:none;
    user-select:none;
}

不幸的是，这根本不起作用...现在我正在寻找关闭以下功能的最佳方法：

有人对我有什么建议吗？

Answer 1

你不能阻止用户复制你的图片，只能让它变得不那么方便。因此，这取决于您要为此预防付出多少努力。

您将能够通过您正在使用的方法阻止不太熟练的用户，但任何图像都包含 href（浏览器上的文件路径）。用户可以 WGET 文件、直接浏览图像、打开开发工具、使用模拟解决方法（如 Windows 屏幕截图工具）等。

Disable drag & drop on HTML page?