Wednesday, November 27, 2013

Web Pair - обмен данными между HTML5 браузерами

Обновлен мобильный сервис pairing for mobile phones. Это модельный сервис, который позволяет связать два мобильных телефона, так что информацию с одного экрана можно отображать на другом. Более точно - связываются два браузера. Не обязательно мобильных. Можно передавать данные с десктопа на телефон, с телефона на умный телевизор, подключенный к сети по Wi-Fi и т.д. Не требуется предварительной загрузки приложений, все работает в браузере.

Как это работает? Перейдите в двух браузерах (на двух телефонах) на следующую страницу: http://pair.linkstore.ru

Можно воспользоваться следующим QR-кодом:

QR code

Вы увидите следующее:

Такая же картина будет и во втором браузере (на втором телефоне). Отличаться изображения будут только кодом:

Этот случайный код и нужен для установления связи между экранами. Используется схема, подобная pairing в Bluetooth. На телефоне (экране), который будет отображать информацию (присоединяется к другому, работает в режиме slave) нужно набрать код, указанный для другого экрана:

Этот телефон готов к приему данных:

После ввода соответствующего кода, второй телефон (код которого введен) автоматически перейдет в режим ввода данных (master mode):

Наберите произвольный текст и нажмите кнопку Push на мастер экране. Набранные данные будут отображены на втором устройстве (slave):

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

- если в мастер-режиме набрать текст - он будет отображен на присоединенном экране (или экранах - их ведь может быть несколько)

- если в мастер-режиме набрать произвольный URL (например, http://abavanet.ru) - он будет отображен на присоединенном экране как ссылка

- если в мастер-режиме набрать email, то на присоединенном экране это будет отображено как ссылка, по которой можно отправить email

- если в мастер-режиме набрать номер телефона, то он будет отображен на присоединенном экране как ссылка, по которой можно звонить (полный формат. Например: +7-903-1234567)

- если в мастер-режиме набрать следующую команду:   t:имя_в_твиттер (например, t:abava), то она будет отображена на присоединенном экране (экранах) как ссылка на соответствующего пользователя в Twitter (в данном примере - abava)

- если в мастер-режиме набрать следующую команду:   f:имя_в_фейсбук, то она будет отображена на присоединенном экране (экранах) как ссылка на профиль соответствующего пользователя в Facebook

- если в мастер-режиме набрать следующую команду:   v:имя_в_вконтакте, то она будет отображена на присоединенном экране (экранах) как ссылка на профиль соответствующего пользователя Vkontakte

Таким образом - это еще один способ поделиться ссылкой на свой профайл в социальной сети.

В новой версии в мастер-режиме можно выбрать файл с изображением и переслать эту картинку в другой браузер. В данном случае используется HTML5 API для работы с файлами. Это удобно, поскольку выбор файла на мобильном телефоне дает возможность не только выбирать готовые изображения, но и непосредственно обращаться к камере. То есть, на одном мобильном телефоне делаем снимок и передаем его в другой браузер. А за этим "другим браузером" может быть другой телефон, планшет, Smart TV и т.д.

Но - все хорошо и сразу быть не может, как известно. Поддержка HTML5 в мобильных браузерах весьма своеобразна. Например, на двух проверенных Андроид устройствах (2.3 и 4.0) нужная функция в HTML5 не поддерживается. Хотя по всем описаниям должна быть в любой версии Андроид SDK после 3.0. С другой стороны, во всех современных десктоп браузерах (FF, Chrome) все работает. Так что передача изображений с десктопа (master) на телефон (Smart TV и т.д. - slave) вполне себе работает.

За ссылки на примеры работающих (не работающих) с передачей файлов браузеров (устройств) будем благодарны.
 

P.S. Прототипы. Их два - это компоненты в составе Coldtags suite. Они были сделаны еще в до-ajax эру (да - было и такое время :), но тем не менее вполне себе работают. Это Cobrowse и Slide.

No comments: