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);
Таким образом, вам нужно будет вставить скрипт-тег только один раз.