web-dev-qa-db-ja.com

Chromeのキオスクモードで右クリック/ロングタッチのコンテキストメニューを無効にする方法

私たちは美術館のソフトウェアに取り組んでいます。ローカルネットワークに接続されているWindows 8.1で実行されているタッチスクリーン付きのインタラクティブキオスクがいくつかあります。キーボードもマウスもありません。 Apacheを搭載したサーバーには、いくつかのローカルWebサイトが含まれています。各キオスクはキオスクモードでGoogle Chrome=のコピーを実行します。したがって、美術館の訪問者に情報を提供するローカルWebアプリケーションの種類があります。

さて、問題。訪問者が画面を長押しすると、右クリックと同様に機能します。コンテキストメニューが表示されます。私たちはそれをまったく望んでいません。 「oncontextmenu = return false」をbodyタグに追加しました。だが。私たちはiframeで実行されているいくつかの外部Webサイトを持っています（博物館はインターネットに接続しています）。また、コンテキストメニューdoesがiframeに表示されます。 AFAIK、javascriptを使用して無効にする方法はありません。

私たちのシステムエンジニアは、Windowsで右クリックを完全に無効にするソフトウェアを入手しました。 Chromeを含むあらゆる場所。だが。マウスで動作します。そして、タッチについては...まあ、それはどこでもタッチイベントを無効にしますそれ以外に Chrome。たぶんChromeは独自のタッチイベントハンドラーを持っていますが、わかりません。

結局のところ。 Chromeのキオスクモードで右クリック/ロングタッチでiframeのコンテキストメニューを取り除く必要があります。アドバイスをください。

javascriptgoogle-chromeiframekiosk-mode
15
korsun

キオスクにプレーンな_http://..._（またはおそらく_https://..._または_file://..._）Webページを表示していると思います。実際にアプリを表示している場合（つまり、_chrome-extension://..._）、この戦略は機能しません。

すべてのブラウジングコンテキストにwindow.addEventListener("contextmenu", function(e) { e.preventDefault(); })を挿入するChrome拡張機能は、おそらくiframeのコンテキストメニューをブロックするトリックを実行します。

manifest.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(); })
_

フォルダを作成し、その中に2つのファイルを配置するだけです。次に、_chrome://extensions/_に移動し、_Developer Mode_ボックスをオンにします。最後に、_Load unpacked extension..._をクリックして、作成したフォルダーを選択します。

これにより、iframe内に読み込まれたページを含め、拡張コンテンツスクリプトの実行が許可されている場所にコンテキストメニューが表示されなくなります。失敗する注目すべき点がいくつかあります。

  • 拡張機能は、_chrome://_または_chrome-extension://_ページ、またはGoogleのWebストアでは実行できません。キオスクがアプリを表示している場合、この拡張機能は別のアプリまたは拡張機能の内部のiframeにアクセスできないため、この全体の戦略は機能しません（iframeのソースが通常はアクセス許可を持つOriginであっても）アクセスするために）。
  • _about:blank_に直接移動すると、コンテンツスクリプトは実行されず、コンテキストメニューが表示されます。 （ただし、_about:blank_がiframeに読み込まれている場合、ブロックは正しく機能します。）
  • Iframeにsandbox属性があり、_allow-scripts_権限が含まれていない場合、拡張機能はそのiframeからのコンテキストメニューをブロックできません。

これらの制限のいずれも適用されない限り（およびページ自体のスクリプトがwindowのすべてのイベントリスナーをクリアしない限り）、動作するはずです。

上記のコードを使用して Chrome Web Store）の簡単な拡張機能 を作成しました（開発者モードの拡張機能は、起動時に警告を生成しますが、Web Store拡張機能はサポートしていません。）

19
apsillers