如何在 Chrome 的信息亭模式下禁用右键单击/长按的上下文菜单？

Question

我们正在为博物馆开发软件。有几个在 Windows 8.1 上运行的带有触摸屏的交互式信息亭连接到本地网络。没有键盘，没有鼠标。带有 Apache 的服务器包含多个本地网站。每个自助服务终端都以自助服务终端模式运行 Google Chrome 的副本。因此，我们有一些本地 Web 应用程序可以为博物馆参观者提供信息。

现在，问题来了。如果访问者长时间触摸屏幕，它的工作原理类似于右键单击。出现上下文菜单。我们根本不想要它。我在正文标签中添加了“oncontextmenu = return false”，它有所帮助。但。我们有几个在 iframe 中运行的外部网站（博物馆有互联网连接）。并且上下文菜单确实出现在 iframe 上。 AFAIK，没有办法使用 javascript 禁用它。

我们的系统工程师得到了一个完全禁用 Windows 右键单击​​的软件。任何地方，包括 Chrome。但。它适用于鼠标。至于触摸......嗯，它会在除了 Chrome 之外的任何地方禁用触摸事件。也许 Chrome 有自己的触摸事件处理程序，我不知道。

所以，毕竟。在 Chrome 的 kiosk 模式下，我们需要在右键单击/长按时摆脱 iframe 上的上下文菜单。请给我一些建议。

Answer 1

我假设您正在信息亭上显示一个普通的 http://...（或者可能是 https://... 或 file://...）网页。如果您实际上是在展示一个应用程序（即chrome-extension://...），那么这个策略将不起作用。

将window.addEventListener("contextmenu", function(e) { e.preventDefault(); }) 注入每个浏览上下文的 Chrome 扩展程序可能会阻止 iframe 上的上下文菜单。

ma​​nifest.json：

{
    "manifest_version": 2,
    "name": "Context Menu Blocker",
    "version": "1.0",
    "content_scripts": [
      {
        "matches": ["<all_urls>"],
        "js": ["contextblocker.js"],
        "all_frames": true,
        "match_about_blank": true
      }
    ]
}

contextblocker.js：

window.addEventListener("contextmenu", function(e) { e.preventDefault(); })

只需创建一个文件夹并将两个文件放入其中。然后，转到chrome://extensions/，选中Developer Mode 框。最后点击Load unpacked extension...，选择刚才创建的文件夹。

这应该防止上下文菜单出现在允许运行扩展内容脚本的任何地方，包括在 iframe 内加载的任何页面。它失败的地方很少有值得注意的地方：

• 不允许在chrome:// 或chrome-extension:// 页面或Google 的网上应用店上运行扩展程序。如果您的信息亭正在显示一个应用程序，则整个策略将不起作用，因为此扩展程序将无法访问另一个应用程序或扩展程序内部的 iframe（即使 iframe 的源是它通常具有权限的来源访问）。
• 如果您直接导航到about:blank，内容脚本将不会运行并且会出现上下文菜单。 （但是，如果 about:blank 加载到 iframe 中，则该块将正常工作。）
• 如果 iframe 的 sandbox 属性不包含 allow-scripts 权限，则扩展程序无法阻止来自该 iframe 的上下文菜单。

只要这些限制都不适用（并且只要页面本身的脚本没有清除window 上的所有事件侦听器），那么它应该可以工作。

我已经使用上面的代码创建了a simple extension in the Chrome Web Store。 （开发者模式扩展现在会在启动时产生警告，而 Web Store 扩展则不会。）

Answer 2

如果您使用的是 jQuery，下面的代码将禁用上下文菜单（也称为“右键单击”）。

$(document).on("contextmenu",function(){
       return false;
    }); 
});