избежать блокировки всплывающих окон в окне входа? - PullRequest
Новая
       40

избежать блокировки всплывающих окон в окне входа?

0 голосов
/ 28 февраля 2020

У нас есть поток, в котором компонент входа в систему на странице может открыть дочернее окно для входа в систему.

По необходимости, поток - щелкнуть - оценить имя пользователя (включая как минимум один вызов XHR) - в зависимости от результата, window.open

Все, что я читаю здесь и в других местах, говорит о том, что, чтобы избежать блокировщика всплывающих окон браузера, мне нужно t ie window.open непосредственно к событию click.

Я не уверен, как это сделать. Код выглядит примерно так: 

<v-btn
  primary
  @click="checkAndLaunch"
>Next</v-btn>

methods: {
  async checkAndLaunch() {
    const result = await axios.get(url, this.userName);
    if (result.data && result.data.external) {
      window.addEventListener('message', messageHandler);
      const newWindow = window.open(result.data.url, 'external');
      if (window.focus) {
        newWindow.focus();
      }
    } else {
      this.userCanLoginLocally = true; // shows next stage of login component
    }
  }

Я бы предпочел не открывать дочернее окно каждый раз в начале обработчика щелчков (в качестве смягчения), если я могу помочь; Большинству пользователей всплывающее окно не понадобится (но тем, кто действительно будет нуждаться в этом, каждый раз, но я не могу сказать без предварительной оценки их введенного имени пользователя). Но я не уверен, как напрямую соединить обработчик @click с *. 1023 * с window.open без проверок между ними.

Я также не уверен, как наше использование Vue усложняет это. Мы не используем никаких прямых jQuery, поэтому я стараюсь использовать как можно больше Vue -centri c решений. Поскольку это удаленное окно является окном входа в систему, я не могу использовать iFrame в окне основного компонента.

Существует ли предписанный способ получения намерения пользователя щелкнуть мышью даже при некоторой логике c между?

РЕДАКТИРОВАТЬ Итак, если я window.open('', 'external'), а затем установить window.location (все после вызова await), тогда Chrome разрешает всплывающее окно, но Firefox и Edge блокирует его. (

...