Загрузите скрипт reCaptcha один раз в виде Backbone - PullRequest
Новая
       6

Загрузите скрипт reCaptcha один раз в виде Backbone

0 голосов
/ 16 ноября 2018

Я хочу динамически загружать reCaptcha от Google в моем Backbone View только тогда, когда в этом представлении, и добавить скрипт только один раз.

Мне удалось найти этот действительно полезный ответ здесь: https://stackoverflow.com/a/34533362/3847393, который добавляетсценарий к представлению, когда я отображаю представление.Однако каждый раз, когда я ухожу от этого представления и возвращаюсь к нему, он снова добавляет скрипт в заголовок.Поскольку reCaptcha находится на многих страницах моего сайта, это может быстро добавить много повторяющихся сценариев в заголовок кода.

Я попытался проверить и посмотреть, был ли сценарий уже добавлен в DOMсначала перед добавлением скрипта, который работает.Тем не менее, при переходе от страницы и обратно, reCaptcha не отображается. 

loadCaptcha: function loadCaptcha(siteKey) {
    var self = this;

    window.renderCaptcha = function() {
        self.captchaWidgetId = grecaptcha.render('contactus-form-recaptcha', {
            sitekey: siteKey
        });
    };

    var scripts = $('#recaptcha-api-script');

    if (!scripts.length) {
        $('head:first').append('<script id="recaptcha-api-script" type="text/javascript" src="https://www.google.com/recaptcha/api.js?onload=renderCaptcha&render=explicit"><\/script>');
    }
}

Я также попытался обновить проверку длины скриптов в конце и добавить еще, чтобы попытаться повторно отрендерить reCaptcha: 

if (!scripts.length) {
    $('head:first').append('<script id="recaptcha-api-script" type="text/javascript" src="https://www.google.com/recaptcha/api.js?onload=renderCaptcha&render=explicit"><\/script>');
} else {
    window.renderCaptcha();
}

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

Очень признателен за любую помощь или направление.

...