Выходим за границы дозволенного. NPAPI, NaCl и другие страшные

слова

Тимур Рахматиллаевtwitter.com/eskat0n

4-я конференция .NET разработчиков28 апреля 2012

Типичное веб-приложение

Типичное комплексное веб-приложение

Взаимодействие клиентского кода и компьютера

Ресурсы:• CPU• RAM• показания датчиков• ФС

JavaScript

НЕтипичное комплексное веб-приложение

Что может сделать «чистый» JavaScript

Ничего полезного

HTML5 меняет ситуацию!

HTML5 меняет ситуацию!?

• File API• Geolocation API• Battery API• SQL for Web

HTML5 не меняет ситуацию!

Все браузеры разные

Средства расширения функциональности браузеров

• UserJS• Расширения• Плагины

UserJs

UserJs

Функциональность не отличается от обычного JavaScript’а, подключенного к HTML-странице

Расширения

API и предоставляемые возможности различаются в зависимости от браузера. Не подходят для взаимодействия с периферией.

Плагины

Платформозависимый код, выполняемый в потоке браузера.Технологии реализации:• Netscape Plugin Application Programming

Interface (NPAPI)• NativeClient (NaCl)• Pepper Plugin API (PPAPI)• ActiveX

Плагины

Платформозависимый код, выполняемый в потоке браузера.Технологии реализации:• Netscape Plugin Application Programming

Interface (NPAPI)• NativeClient (NaCl)• Pepper Plugin API (PPAPI)• ActiveX

Все браузеры разные, будь они прокляты

Поддержка NPAPI

• Google Chrome• Safari• Firefox• Opera• Internet Explorer…

Поддержка NPAPI

• Google Chrome• Safari• Firefox• Opera• Internet Explorer… до версии 5.5

NPAPI-плагин

Физически представляет из себя подключаемую динамически библиотеку с нативным кодом (dll, so).

Internet Explorer жует клей ActiveX

Исходный код

Обвертка

NPAPI library

ActiveX library

Общий механизм работы с NPAPI-плагинами

• Встраивание плагина на страницу с помощью HTML

• Определение местоположения файла плагина и его загрузка

• При необходимости вызов кода плагина для рендеринга контента на HTML-странице

• Взаимодействие с плагином через JavaScript

Встраивание плагина на страницу

<object id=“myplugin" type="application/x-myplugin" width="300" height="300"> <param name="onload" value=“onPlugLoad" /></object>

Идентификация плагина

Plugin 1

Plugin 2

application/x-plugin1

application/x-plugin2

application/x-plugin11

Загрузка NPAPI-плагина

Ключ реестра, указывающийна расположение dll-файла

Рендеринг контента с помощью плагина

<object> … </object>

Функция рендеринга

Взаимодействие с плагином через JavaScript

• Плагин представлен JavaScript-объектом, находящимся в DOM-дереве документа

• При обращении к свойствам JavaScript-объекта плагина или при вызове его методов происходит упаковка передаваемых/возвращаемых значений

• Каждому свойству или методу соответствует нативный код

FireBreath framework

• Предоставляет единое высокоуровневое API для создания NPAPI-плагинов для всех браузеров

• Для Internet Explorer происходит регистрация плагина как ActiveX-компонента

• Предоставляет возможность автоматизированной установкиплагина

FireBreath framework

Плюсы:• Возможность написания единого кода плагина

для работы во всех браузерах• Инструментарий по упрощению сборки• Прозрачный и простой API• Легко читаемый исходный код

Минусы:• Дополнительные инфраструктурные зависимости• Недостаточно подробная документация

Начало работы с FireBreath

• Python• VC++• Cmake• Visual Studio (не-Express версии)

Демонстрация работы FireBreath

А где же .NET?

У нас тут своя атмосфера!

• Возможна реализация с помощью FireBreath небольшой тонкой обвертки, которая осуществляет трансляцию вызовов из JavaScript-кода к коду на платформе .NET

• Используется связка из NPAPI-плагина и Managed COM-компонента

IndyCode scanner plugin

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

IndyCode scanner plugin

Спасибо за внимание

Тимур Рахматиллаевmail@eskat0n.ru

twitter.com/eskat0n