JavaScript получить статус от службы

Я разрабатываю веб-приложение, которое получает обновления пользователя от веб-службы (которая находится в другом домене). Я хочу получать обновления каждые 10 секунд. Для вызова службы в первый раз я динамически вставляю скрипт на страницу. Служба JSONP. Затем я хотел бы определить триггер, который вставляет сценарий от 10 до 10 секунд для получения обновлений. Это правильно? Могу ли я сделать это, не влияя на пользовательский опыт на сайте? Я имею в виду производительность сайта... было бы здорово, если бы я мог сделать асинхронный вызов, и когда у меня будут результаты, я обновлю статус. Есть ли лучшее решение для доступа к удаленным сервисам. Есть ли эффективный способ динамического повторного использования одного и того же сценария с использованием триггера? Я довольно новичок в JavaScript. Можете ли вы дать мне краткий пример, как я могу определить триггер, который вызывает удаленный веб-сервис?... или если есть лучшее решение.

Большое спасибо, Раду Д

3 ответа

Решение

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

Вы также можете использовать CORS для разрешения запросов помимо GET, хотя, как вы знаете, это не поддерживается в старых браузерах.

Чтобы избежать проблем с гонкой или проблем с производительностью во время медленной сети, вы могли бы позволить обратному вызову JSONP рекурсивно вызывать функцию, тем самым делая новый вызов только в том случае, если обратный вызов был возвращен, хотя и с дополнительным setTimeout позвоните, чтобы убедиться, что есть хотя бы минимальная задержка.

Далее используется API Википедии, чтобы получить определенную ревизию страницы и ее пользователя.

<script>
var JSONP = function(global){
    // (C) WebReflection Essential - Mit Style ( http://webreflection.blogspot.com/2011/02/all-you-need-for-jsonp.html )
    // 202 bytes minified + gzipped via Google Closure Compiler
    function JSONP(uri, callback) {
        function JSONPResponse() {
            try { delete global[src] } catch(e) { global[src] = null }
            documentElement.removeChild(script);
            callback.apply(this, arguments);
        }
        var
            src = prefix + id++,
            script = document.createElement("script")
        ;
        global[src] = JSONPResponse;
        documentElement.insertBefore(
            script,
            documentElement.lastChild
        ).src = uri + "=" + src;
    }
    var
        id = 0,
        prefix = "__JSONP__",
        document = global.document,
        documentElement = document.documentElement
    ;
    return JSONP;
}(this);

// Be sure to include the callback parameter at the end

function startAPI (start) {
    start = start || new Date();
    var url = 'http://en.wikipedia.org/w/api.php?action=query&prop=revisions&titles=Main%20Page&rvprop=timestamp|user|comment|content&format=json&callback';
    var minimum = 10000;
    function execute (str) {
        alert(str);
    }
    JSONP(url, function (obj) {
        for (var pageNo in obj.query.pages) {
            var page = obj.query.pages[pageNo];
            var str = 'The user ' + page.revisions[0]['user'] + ' left the page with this code ' + page.revisions[0]['*'];
            execute(str);
            var elapsed = (new Date().getTime()) - start;
            setTimeout(startAPI, (elapsed < minimum) ? (minimum - elapsed) : 0);
            break;
        }
    });
}
startAPI(); 
</script>

Я предлагаю, чтобы в вашем обратном вызове AJAX, когда вы получили результат, вы запланировали таймер (window.setTimeout(ex, t)) так что ваш скрипт обновления вызывается снова.

Причина установки времени в обратном вызове AJAX заключается в том, что вы не знаете точно, сколько времени потребуется для завершения вызова AJAX. Таким образом вы гарантируете плавную 10-секундную задержку между последовательными обновлениями.

Что касается производительности, вам придется это проверить. Это зависит от объема данных и типа обработки, которую вы делаете (и остальной части вашей страницы)... но вы можете попробовать и проверить использование процессора...

Я бы использовал JavaScript setInterval метод

function getUpdate () {
    //AJAX goes here
}

var myInterval = setInterval(getUpdate,10000);

Таким образом, вам нужно будет вставить скрипт-тег только один раз.

Другие вопросы по тегам