Подтвердить что ты не робот

Отключить масштабирование зума Chrome для использования в киоске

Мы используем Chrome в режиме киоска, и случайно пользователи заставляют приложение увеличивать масштаб с помощью недавнего добавления поддержки масштабирования. Затем они думают, что они сломали его и просто ушли, оставив приложение (а затем и 55-дюймовый сенсорный экран) в сломанном состоянии.

Теперь единственное, что нужно для работы, - остановить распространение событий для событий касания более чем на 2 пункта. Проблемы с этим - мы не можем делать мультитач-приложения в этом случае, и если вы действуете быстро, браузер реагирует перед javascript. Что в наших тестах все еще происходит от несчастного случая со стороны пользователей.

Я сделал метатеги, они не работают. Честно говоря, я хотел бы отключить хромированное масштабирование вообще, но я не могу найти способ сделать это.

Как остановить масштабирование браузера?

4b9b3361

ОТВЕТЫ

Ответ 1

У нас была аналогичная проблема, она проявляется в масштабировании браузера, но javascript не получает никакого события касания (или иногда просто одной точки перед запуском масштабирования).

Мы нашли эти возможные (но возможно не долгосрочные) решения:

1. Отключите функции щепотки/салфетки при использовании режима киоска

Если эти параметры командной строки остаются в Chrome, вы можете сделать следующее:

chrome.exe --kiosk --incognito --disable-pinch --overscroll-history-navigation=0
  • - отключить пинч - отключает функцию "пинч-к-зум"
  • - overscroll-history-navigation = 0 - отключает функцию перехода по экрану

2. Отключить масштабирование с использованием флагов Chrome chrome://flags/# enable-pinch

Перейдите к URL chrome://flags/# enable-pinch в вашем браузере и отключите эту функцию.

Функция масштабирования зума в настоящее время экспериментальна, но включена по умолчанию, что, вероятно, означает, что она будет принудительно включена в будущих версиях. Если вы находитесь в режиме киоска (и управляете аппаратным/программным обеспечением), вы можете, вероятно, переключить этот параметр при установке, а затем предотвратить обновление Chrome.

Существует уже дорожный билет для удаления этой настройки на Chromium Issue 304869.

Тот факт, что браузер реагирует до того, как javascript может предотвратить его, определенно является ошибкой и был зарегистрирован в Chromium bug tracker. Надеюсь, он будет исправлен до того, как функция будет постоянно включена или скрещена с пальцами, они оставят ее как настройку.

3. Отключите все штрихи, белый список элементов и событий, соответствующих вашему приложению

Во всех тестах, которые мы провели, добавление функции preventDefault() в документ останавливает масштабирование (и все другие события салфетки/касания) в Chrome:

document.addEventListener('touchstart', function(event){
    event.preventDefault();
}, {passive: false});

Если вы добавите свои функции касания выше в DOM, он активируется до того, как он пузырится на вызов document preventDefault(). В Chrome также важно включить параметр eventListenerOptions, поскольку по состоянию на Chrome 51 a прослушиватель событий на уровне документа по умолчанию установлен на {passive: true}.

Это отключает обычные функции браузера, такие как прокрутка для прокрутки, но вам, вероятно, придется реализовать их самостоятельно. Если это полноэкранное, не прокручиваемое приложение киоска, возможно, эти функции не будут важны.

Ответ 2

Просто так, чтобы кто-нибудь наткнулся на эту страницу, знает, что флаг в Chrome отключает "щепотку для увеличения":

Google Chrome/Chromium/Canary версии выше 50:

chrome://flags/#touch-events

версия Google Chrome/Chromium/Canary менее 50 или старых версий:

chrome://flags/#enable-pinch.

Ответ 3

Я имею дело с той же проблемой. Я думаю, что я могу справиться с этим достаточно хорошо с помощью следующего подхода

  • определить ширину пикселя css элемента html: document.documentElement.clientWidth
  • Сравните это измерение с известной шириной пикселя экрана киоска.
  • если элемент html шире, в пикселях css, чем на экране, в физических пикселях, что означает масштабирование
  • Если элемент html масштабируется, примените масштаб к элементу body для компенсации. Формула: body.style.zoom = htmlElementClientWidth/screenPhysicalPixelWidth

Этот метод имеет полезный побочный эффект автоматического масштабирования пользовательского интерфейса до любого размера текущего окна, что полезно для разработки, если я разрабатываю на экране меньше целевого экрана.

Больше пикселей на экране против пикселов css и обсуждение того, как элемент html расширяется, чтобы заполнить доступное пространство на quirksmode.org.

Ответ 4

Другое решение, которое в настоящее время работает в Chrome (54), - это добавить прослушиватель событий для события 'touchstart' и вызвать preventDefault() в зависимости от длины targetTouches или touches в событии.

Это решение предотвращает щепотку (любой жест с двумя пальцами, если на то пошло), но при этом обеспечивает гибкость в том, как вы хотите реагировать на событие. Это приятное решение, потому что оно не требует полного отключения событий касания (если требуется, если вы хотите отключить пинч с помощью флагов хрома, поскольку chrome://flags/#enable-pinch больше не существует).

window.addEventListener('touchstart', function(e) {
  if (e.targetTouches.length === 2) {
    e.preventDefault();
  }
}, false);
Some text that you can't pinch zoom on Chrome (tested in 54)

Ответ 5

Начиная с версии 51.0.2704.84 м, chrome://flags/# touch-events отключает все сенсорные события не только функцию пинча. FYI. Надеюсь, Google вернет эту функциональность в будущей версии.