Еще одна реализация фоновых вычислений — разделяемые вычисления (kers). Основное отличие их от простых worker состоит в том, что обращаться к ним могут сразу несколько документов. На практике это обозначает, что с помощью sharedworker может быть организовано взаимодействие или совместная работа между несколькими независимыми окнами браузера.
Рис. 103. Готовое приложение с участием WebWorker
Разберем небольшой пример работы kers. Сначала код самого «работника» sharedworked. js:
Var count = 0; onconnect = function(e) { count += 1:
Var port = e. ports[0]:
Port. te(‘Hello! You are connection #’ + count);
}
Смысл этого кода, думаю, ясен — в глобальной переменной count хранится номер соединения, которое по определению sharedworkers будет не единственным. C каждым новым соединением значение count увеличивается и передается инициатору соединения. (Я, наверное, должен извиниться, что не использую такую вещь, как замыкания, которые в worker вполне допустимы. Просто не хочется излишне усложнять код примеров.)
Тут мы видим нечто новое — комплекцию ports объекта events. Естественно, для каждого соединения будут свой event и свои ports (хотя пока в коллекцию входит только один порт).
Поясним механизм взаимодействия, создав страницы-«работода-тели». Вот основная:
<!DOCTYPE HTML>
<html>
<title>Shared workers</title>
<head>
<script src="../j query-1.4.4.min. js"></script>
<script>
Var worker = new SharedWorker(‘sharedworked. js’); worker. port. addEventListener(‘message’, function(e) { var log = $(‘#log’); log. html(log. html()+e. data):
}, false);
Worker. port. start():
</script>
</head>
<body>
<div id="log">Log:</div>
<a href="#" onclick="window. open(‘ww3.html’, ‘one’,’width=400,height=200′);"
>open 1</a>
<a href="#" onclick="window. open(‘ww3.html’, ‘second’,’width=400,height=200′
);">open 2</a>
<a href="#" onclick="window. open(‘ww3.html’, ‘third ‘,’width=400,height=200’
);">open 3</a>
<!— iframe src="ww3.html" style="border:2px;"></iframe —>
</body>
</html>
Сеанс работы «работника» тут начинается командой port. start(), а ожидание сообщений организуется с помощью worker. port. addEventListener(‘message’).
Три ссылки внизу страницы открывают в трех окнах одну и ту же страницу со следующим кодом:
<!DOCTYPE HTML>
<html>
<head>
<title>Shared workers: child</title>
<script src="../jquery-1.4.4.min. js"></script> <script>
Var worker = new SharedWorker(‘sharedworked. js’); worker. port. onmessage = function(e) { var log = $(‘#log’); log. html(e. data):
</script>
</head>
<body>
<div id="log">Log:</div> </body>
</html>
Теперь раскроем их и посмотрим, что у нас получилось (рис. 104).
Рис. 104. Sharedworker’bi в действии — «работник» на множество окон
Как видите, счетчик соединений исправно работает. Даже если мы откроем новое окно с тем же адресом, сбоя не будет.
Добавить комментарий