web-dev-qa-db-fra.com

Comment désactiver le menu contextuel sur clic droit / toucher long dans un mode kiosque de Chrome?

Nous travaillons sur le logiciel d'un musée. Il existe plusieurs kiosques interactifs avec écran tactile fonctionnant sous Windows 8.1 qui sont connectés au réseau local. Pas de clavier, pas de souris. Le serveur avec Apache dessus contient plusieurs sites Web locaux. Chaque kiosque exécute une copie de Google Chrome en mode kiosque. Nous avons donc une sorte d'applications Web locales qui fournissent des informations aux visiteurs d'un musée.

Maintenant, le problème. Si un visiteur touche longtemps à l'écran, cela fonctionne comme un analogue du clic droit. Le menu contextuel apparaît. Nous n'en voulons pas du tout. J'ai ajouté "oncontextmenu = return false" dans la balise body et cela a aidé. Mais. Nous avons quelques sites Web externes fonctionnant dans des iframes (le musée a une connexion à Internet). Et le menu contextuel ne apparaît sur les iframes. AFAIK, il n'y a aucun moyen de le désactiver en utilisant javascript.

Notre ingénieur système a obtenu un logiciel qui désactive complètement le clic droit dans Windows. N'importe où, y compris Chrome. Mais. Cela fonctionne pour une souris. Et en ce qui concerne les touches ... eh bien, il désactive les événements tactiles n'importe où en plus Chrome. Peut-être Chrome a son propre gestionnaire d'événements tactiles, je ne sais pas.

Donc, après tout. Nous devons nous débarrasser du menu contextuel des iframes sur clic droit/toucher long dans un mode kiosque de Chrome. Veuillez me donner quelques conseils.

javascriptgoogle-chromeiframekiosk-mode
15
korsun

Je suppose que vous affichez une page Web simple http://... (Ou peut-être https://... Ou file://...) Sur votre kiosque. Si vous affichez réellement une application (c'est-à-dire chrome-extension://...), Cette stratégie ne fonctionnera pas.

Une extension Chrome qui injecte window.addEventListener("contextmenu", function(e) { e.preventDefault(); }) dans chaque contexte de navigation ferait probablement l'affaire pour bloquer les menus contextuels sur les iframes.

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

Créez simplement un dossier et placez les deux fichiers à l'intérieur. Ensuite, allez dans chrome://extensions/, Cochez la case Developer Mode. Enfin, cliquez sur Load unpacked extension... Et sélectionnez le dossier que vous venez de créer.

Cela devrait empêcher le menu contextuel d'apparaître partout où les scripts de contenu d'extension sont autorisés à s'exécuter, y compris toute page chargée à l'intérieur d'un iframe. Il y a peu de points notables où il échoue:

  • Les extensions ne sont pas autorisées à s'exécuter sur les pages chrome:// Ou chrome-extension://, Ni sur le Web Store de Google. Si votre kiosque affiche une application, toute cette stratégie ne fonctionnera pas, car cette extension ne pourra pas accéder aux iframes à l'intérieur d'une autre application ou extension (même si la source de l'iframe est une origine qu'elle aurait normalement l'autorisation accéder).
  • Si vous accédez directement à about:blank, Le script de contenu ne s'exécutera pas et le menu contextuel peut apparaître. (Si about:blank Est chargé dans un iframe, cependant, le bloc fonctionnera correctement.)
  • Si un iframe possède un attribut sandbox qui n'inclut pas l'autorisation allow-scripts, L'extension ne peut pas bloquer les menus contextuels de cet iframe.

Tant qu'aucune de ces restrictions ne s'applique (et tant qu'un script sur la page elle-même n'efface pas tous les écouteurs d'événements sur window), alors cela devrait fonctionner.

J'ai utilisé le code ci-dessus pour créer ne simple extension dans le Chrome Web Store . (Les extensions en mode développeur produisent désormais un avertissement au démarrage, tandis que le Web Store les extensions ne le font pas.)

19
apsillers