Окно новой вкладки блокируется при попытке открыть его через некоторое время - PullRequest
Новая
       1

Окно новой вкладки блокируется при попытке открыть его через некоторое время

0 голосов
/ 03 декабря 2018

У меня проблемы с открытием окна новой вкладки через некоторое время.Я сделал 2 разных эксперимента.В первом эксперименте я использовал функцию setTimeout(...), а во втором эксперименте я использовал пользовательскую функцию sleep(...).

Эксперимент 1:

В этом эксперименте обабраузеры: Chrome и Firefox ведут себя одинаково.При установке числа, большего или равного 2000 миллис, окно новой вкладки блокируется.Если используется 1000 миллис или меньше, то окно вкладки открывается правильно.Пожалуйста, примите эти цифры как приблизительные (мои реальные эксперименты). 

...

  $('.button_test').click(() => {

    setTimeout(() => {

      let newForm = $('<form>').attr({
        method: 'GET',
        action: 'https://www.google.com/search',
      });
      $('<input>').attr({
        type: 'hidden',
        name: 'q',
        value: 'Steve Jobs',
      }).appendTo(newForm);
      let new_win_content = `<html><head><title>Auxiliar Tab</title></head><body></body></html>`;
      let new_win = window.open();
      new_win.document.write(new_win_content);
      new_win.document.close();
      let $body = $(new_win.document.querySelector('body'));
      $body.append(newForm);
      newForm.submit();
      document.location.href = popunderURL;

    }, 1000); // IF >= 2000 -> TAB WINDOW GETS BLOCKED ( CHROME, FIREFOX, etc.)

  });

...

Вот вам живой пример:

https://jsbin.com/gimofah/1/edit?html,output

Эксперимент 2:

В этом эксперименте, где я использую пользовательскую функцию: sleep(...), новое окно вкладок блокируется только на Chrome, когда время ожидания больше или равно 1000 миллис (на мойэксперименты). 

...

  $('.button_test').click(() => {

    sleep(900); // IF >= 1000 -> POPUP WINDOW GETS BLOCKED ON CHROME (FIREFOX IS OK)

    let newForm = $('<form>').attr({
      method: 'GET',
      action: 'https://www.google.com/search',
    });
    $('<input>').attr({
      type: 'hidden',
      name: 'q',
      value: 'Steve Jobs',
    }).appendTo(newForm);
    let new_win_content = `<html><head><title>Auxiliar Tab</title></head><body></body></html>`;
    let new_win = window.open();
    new_win.document.write(new_win_content);
    new_win.document.close();
    let $body = $(new_win.document.querySelector('body'));
    $body.append(newForm);
    newForm.submit();
    document.location.href = popunderURL;

  });

...

function sleep(miliseconds) {
   var currentTime = new Date().getTime();
   while (currentTime + miliseconds >= new Date().getTime()) { }
}

https://jsbin.com/ladedup/1/edit?html,output

Мой вопрос: Есть ли у вас какие-либо идеи о причине этого ?, может быть, один изследующий ...

  1. истекшее время между моментом взаимодействия пользователя с браузером и запросом открытия окна вкладки, или
  2. потоком скрипта, или
  3. любая другая причина?

1 Ответ

0 голосов
/ 04 декабря 2018

Вот мои два цента, которые, я надеюсь, могут помочь другим.

Так как браузер не может открыть окно новой вкладки через определенное время, вероятно, наша лучшая ставка здесьнемного реорганизовать код.В зависимости от вашей ситуации следующий код может быть подходом, который вы ищете.В моем случае это помогло.Это очень простой подход, который, вероятно, вы не поймете быстро, потому что вы можете сосредоточиться на get: A + B + C => D и не думать о: A + C + B => D. 

<html>
<head>
<meta charset="UTF-8" />
<title>Rendering form on new tab and submitting it</title>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script>
$(function(){

  let popunderURL = 'https://content.cambly.com/2017/02/11/ielts-topic-advertisement/';

  $('.button_test').click(() => {

    let new_win = window.open();
    let new_win_content = `<html><head><title>Auxiliar Tab</title></head><body>Loading...</body></html>`;
    new_win.document.write(new_win_content);
    new_win.document.close();

    setTimeout(() => {

      let newForm = $('<form>').attr({
        method: 'GET',
        action: 'https://www.google.com/search',
      });
      $('<input>').attr({
        type: 'hidden',
        name: 'q',
        value: 'Steve Jobs',
      }).appendTo(newForm);
      let $body = $(new_win.document.querySelector('body'));
      $body.append(newForm);
      newForm.submit();
      document.location.href = popunderURL;

    }, 5000);

  });

});
</script>
</head>
<body>
    <h3>Rendering form on new tab and submitting it</h3>
    <button class="button_test">Click Here!</button>
</body>
</html>

ВотПример из жизни: https://jsbin.com/muxopol/1/edit?html,output

Особая благодарность моему другу Джеймсу за предложение о подходе.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...