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

В настоящее время я разрабатываю сценарий, который позволит мне получить имя пользователя для попытки подключения на веб-сайтах. Но главное ограничение заключается в том, что я не смог бы редактировать HTML-код страницы, просто добавив свой скрипт (-ы) через менеджер тегов.

Я должен объяснить, какой инструмент я использую. Я работаю с инструментом веб-отслеживания SnowPlow Analytics. Он работает на той же основе, что и Google Analytics, с массивом _snaq, который (будет) содержит данные для обработки. Суть проблемы заключается в том, что даже если данные хорошо добавляются в массив, основной сценарий (sp.js) не успевает выполнить свою работу и отправить запрос в CloudFront Collector до запроса POST.

Вот пример страницы, которую я использую, и сценарий для сбора данных:

Страница:

<html>
    <head>
        <title>Sign In Example</title>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
         <!-- SnowPlow modified -->
            <script type="text/javascript">
                var _snaq=_snaq||[];
                _snaq.push(['setCollectorCf','xxxxxxxxxxxxxx']);
                _snaq.push(['trackPageView']);
                _snaq.push(['enableLinkTracking']);
                /*
                * Here is the anonymous function to include properly the snowplow.js
                * minified: d1fc8wv8zag5ca.cloudfront.net/0.11.1/sp.js
                * github : github.com/snowplow/snowplow/tree/master/1-trackers/javascript-tracker
                */
            </script>
         <!--/ SnowPlow modified -->
         <script src="js/jquery.min.js"></script>
         <script async="" type="text/javascript" src="js/getLogin.min.js"></script>
    </head>
     <body>
        <form class="formClass">
            <h2>Please sign in</h2>
            <input type="text" class="textInput" placeholder="Email address" />
            <input type="password" class="passwordInput" placeholder="Password" />
            <label class="checkbox">
                <input type="checkbox" value="remember-me" /> Remember me
            </label>
            <button class="submitButton" type="submit">Sign in</button>
        </form>
    </body>
</html>`

Авторсценария:

var checked, cb = $('input[value="remember-me"]')[0], butt = $('button[type="submit"]')[0];
if(cb.checked)
    checked = 1.0;
else
    checked = 0.0;

function snaqPush()
{
    _snaq.push(['trackStructEvent', 'connection', 'connectionAttempt', 'email',  $('input[placeholder = "Email address"]').val(), checked]);
}

cb.addEventListener("click", function(e)
{
    if(cb.checked)
        checked = 1.0;
    else
        checked = 0.0;
}, false);

butt.addEventListener("click", function()
    {
        snaqPush(); //or directly the _snaq push([...]) here
        _snaq.push(function()
        {
            setTimeout(function(){}, 1000);
        }); //I have try the setTimeout in and out of a _snaq.push, and it stills not work
    });

Примечание: запрос POST работает с точкой останова сразу после _snaq.push(), содержащей данные!

Заранее спасибо за помощь!

2 ответа

Решение

Вы должны привязать прослушиватель событий к действию отправки формы, а не к нажатию кнопки. Таким образом, вы можете позвонить аналитику до возвращения true таким образом позволяя отправить завершить.

Большое спасибо, это работает очень хорошо, но мне просто нужно было внести несколько изменений по сравнению с тем, что вы предложили:

/*your proposal (if I'm right)*/
setTimeout(function(){}, 250);
return true;

/*the adaptation I have done for it to work*/
setTimeout(function(){myForm.submit();}, 250);
Другие вопросы по тегам