Может ли HTML5 взаимодействовать с периферийными устройствами, такими как сканеры и считыватели кредитных карт?


моя компания пишет программное обеспечение, которое устанавливается на клиентские машины для выполнения кассовых операций. Программное обеспечение интерфейсов с различными внешними устройствами (принтеры чеков, сканеры штрих-кода, устройство считывания кредитных карт и т. д.). Мы делаем это с помощью приложения winforms, созданного в Visual Studio с помощью библиотеки Microsoft OPOS, которая, в свою очередь, взаимодействует с нашим облачным сервером (модель клиент-сервер a la).

есть очевидные недостатки в этой модели, в первую очередь с новинки. Я изучаю другие способы общения с этими периферийными устройствами через интернет, предпочтительно через веб-браузер. Насколько я могу судить, Java является одной из единственных технологий, которые могут делать то, что мы ищем (через апплет), и я предполагаю, что Adobe Flash также может (через платформу Air). Они жизнеспособны, но не предпочтительны, потому что мы хотим запускать наше программное обеспечение на мобильных устройствах с поддержкой интернета.

есть ли у кого-нибудь предложения по другим способам общения с внешним миром периферийные устройства через интернет?

6 55

6 ответов:

Не так просто... пока нет, но вроде

обновление 3 ноября 2014: прошло чуть более двух лет с тех пор, как был сделан оригинальный пост, но ответ остается в основном тем же самым на данный момент. Мы, однако, ближе к вашей первоначальной цели в нескольких областях.

обновление 28 декабря, 2016: еще пару лет прошло, и еще одно обновление. Этот будет больше сосредоточен на двух новых разработках, чем на чем-либо другом. См. новый раздел " WebUSB & Web BlueTooth "в разделе"полный API устройства". Но ответ остается прежним.

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

фон

спецификация HTML5 вошла в состояние" рекомендация". Это означает, что HTML5 в значительной степени настроен на то, как он выглядит. Тем не менее, я буду использовать HTML5 так же, как каждый маркетолог в мире решил, что это лучше всего. То есть, я не буду говорить о HTML. Ну, я буду, поскольку вы будете использовать его с HTML-страницы, но не совсем. Кем я буду на самом деле обсуждается JavaScript (JS) и это лошадь другого цвета. Но для всех намерений и целей мы помещаем все это под тем же заголовком, что и HTML5, который теперь решил означать "блестящий и новый".

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

полный API устройства

статус: входящий, но не готовый

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

но API, которые вы ищете, все еще находятся в процессе и пути прочь. Для вашего конкретного случая и для более общего случая подключения вашего веб-приложения к большинству устройств мы все еще находимся на расстоянии нескольких лет от того, что мы можем использовать. Если вы хотите увидеть, какие удивительные вещи появляются в этой области, вот лишь несколько избранных элементов, которые может помочь вам напрямую:

  • Web Near Field Communication (NFC) API
    Этот, К сожалению, может быть мертв в воде на данный момент. Но похоже, что первоначально некоторые люди в W3C (в основном Intel, похоже) смотрели на добавление API NFC в интернет.
  • Media Capture Streams
    Группа WebRTC работает над программным доступом к медиа-потокам, таким как камера, которая позволит интегрировать такие вещи, как сканирование штрих-кода или другие функции. Это достигло статуса CR и является доступен в браузерах, но менее полезен сам по себе.
  • Web Bluetooth
    Если у вас есть инструменты с поддержкой bluetooth, этот API поможет вам подключиться к ним с компьютеров и устройств, которые могли слушать и подключаться. Основной драйвер для этого на данный момент кажется, что это команда Chrome, включая экспериментальную реализацию, но я бы не рассматривал ее в любом месте, готовом к использованию (см. раздел "WebUSB & Web BlueTooth").
  • WebUSB
    Это позволит получить полный доступ к низкоуровневой информации USB, включая перечисление устройств и взаимодействие с ними. Так же, как веб-BlueTooth, это, кажется, текущий проект Chrome pet, но я также не буду полагаться на него (см. раздел "WebUSB & Web BlueTooth").
  • Обнаружение Сетевых Служб
    Если у вас есть другие устройства или элементы в сети, которые широковещательная передача и использование HTTP, этот API позволит вам обнаруживать и взаимодействовать с этими службами. Нет реализации браузера, но он находится в рабочем проекте для W3C.

первоначально Mozilla продвигала ряд из них вперед из-за Boot2Gecko (или Firefox OS). Однако, поскольку этот проект официально отменен, мы не видим большого прогресса от них в этих областях сейчас.

члены команды Chrome, однако, похоже, решили погрузиться и начать не только работая над этим,но помещая их в браузеры. Что и приводит нас к этому...

WebUSB & Web BlueTooth

как сосиски, лучше не знать, как веб-стандартов составила
- Авраам Линкольн (вероятно)

в этой области было немного шума, так как похоже, что команда Chrome пробралась в них в качестве экспериментальных функций и разработала свою собственную спецификацию для нее. И это здорово! Просто может не так на что ты надеялся.

каждый поставщик браузера и W3C contributor group имеет свой собственный стиль и вносит свой вклад в спецификации по-своему. В результате получается обычно довольно приличная спецификация, которую браузеры согласовали. Но переход от ничего к чему-то есть... грязный. Очень грязно. И довольно много раз. Это не всегда приводит к хорошей спецификации (да, я говорю о вас, Флориан компромисс...) но даже когда это происходит, это принять промежуток времени.

однако, похоже, что Google разработал эту версию спецификации самостоятельно. И, по моему опыту, подход Google к спецификациям всегда немного... что ж... отложив мое личное мнение в сторону, мы скажем "Гун-Хо". Они, как правило, просто ныряют прямо в глубокий конец. И кажется, что они сделали здесь.

Я очень сомневаюсь, что эти спецификации или реализации будут выглядеть так, когда они станут стандартами. И есть в этом нет ничего плохого. Это часть процесса. Но я бы не стал полагаться на эту реализацию или разрабатывать какой-либо код или продукты против нее. Это беспрецедентная функция в интернете, и все поставщики браузеров захотят сказать большое слово в этом.

тем не менее, это на самом деле хорошо. Одна из вещей, которые Google часто делает (к лучшему или худшему) с такими ситуациями, как это заставляет разговор, и он может подтолкнуть вещи вперед. И наличие функции, поставляемой в браузере, даже экспериментальная функция, может включить тепло на спрос на него. Так что в ближайшее время мы можем увидеть еще больший прогресс в этой области.

PhoneGap Apache Cordova. Вы знаете, для вашего телефона

статус: не полнофункциональный и только телефон

Apache Cordova, ранее Adobe PhoneGap, это способ написать свою программу в HTML, CSS и JS, что позволяет получить доступ к функциональности более низкого уровня на таких вещах, как телефоны и компиляция между устройствами. Это был бы способ реализовать вашу программу, но это было бы телефонное приложение, а не обязательно настольное. Вариант для рассмотрения, и что-то, что я решил упомянуть.

Cordova уже реализует некоторые из вышеперечисленных функций, но не имеет некоторых из более мощных, таких как NFC или BlueTooth.

решение Native-App (для Windows 8)

статус: возможно, но специфично для ОС и рабочего стола приложение

Windows 8 предлагает возможность создавать приложения в HTML и JS. Это позволит вам легко получить доступ к функциям более низкого уровня в ОС через их API. Судя по всему, он довольно обширен, и вы можете сделать многое. Однако вы упомянули поддержку кросс-ОС, и это, очевидно, ограничивает вас одной ОС.

это так Flash-y!

статус: умирает / мертв, не возможно как веб-приложение

Flash не есть прямой доступ к системе через интернет. Вы можете создать приложение AIR, но это будет своего рода поражение цели его веб-основе. Кроме того, поддержку Flash на мобильных устройствах и в интернете, казалось бы, идет на спад.

NodeJS

статус: может быть немного больно и возможно только как настольное приложение

приложения NodeJS и JS были своего рода горячей темой последние пару лет. Я не обсуждал это в моем оригинале сообщение, потому что я чувствовал, что это еще не совсем там. Тем не менее, все продвинулось, и он гораздо ближе к тому, чтобы быть готовым к такого рода вещам, и имеет поддержку и силу растущей базы пользователей. Тем не менее, для вашего конкретного случая я бы не рекомендовал его использовать. Он должен быть локальным на машине пользователей, и из-за того, как NodeJS (и подобные двигатели) в данный момент, это потребует много дополнительной конфигурации и настройки, которые немного усложнят ситуацию.

Так что вы могли бы создайте приложение с использованием HTML, CSS и JS с NodeJS или аналогичными движками и получите доступ к тому, что вам нужно, но оно должно быть локальным, и это займет больше работы, чем я уверен, что вы хотите делать каждый раз, когда вы хотите установить его для клиента.

... На чем я остановился?

Так что же нам остается? Ну, просто: если вы хотите один язык/набор кода в качестве базы кода, HTML/CSS/JS не являются отличным вариантом... еще. Но они могут быть когда-нибудь. На данный момент, ваши варианты ограничены тем, что вы считаете лучшим для вашего клиента. Java-это стабильный вариант, который вы указали, но, очевидно, имеет свои недостатки. По мере развития интернета, я думаю, мы увидим много действительно интересных вещей, выходящих из новой функциональности, но у нас есть способы пойти еще.

читать:

Это возможно, но это должно быть сделано косвенно. Теоретически вы можете написать сокет-сервер на языке низкого уровня, который получает ввод-вывод и отправляет ввод-вывод через сокет (ретрансляция, я думаю). HTML5 использует WebSockets или какой-то эквивалент для связи с этим сокет-сервером.

сейчас это может быть достигнуто с WebUSB API.

Это доступно в Chrome начиная с версии 54.

Это проект редактора W3C, поэтому мы можем ожидать (надеяться), что он будет принят другими поставщиками браузеров...

Я много думал об этом в последнее время... есть POS-приложение в основном написано в VB6, учитывая, что делать дальше. HTML5-это вариант, и я думал, что буду использовать VSPE, чтобы получить серийный материал в JS.

http://www.eterlogic.com/Products.VSPE.html

люблю этот продукт! Работает очень хорошо для получения серийного движения, где вам это нужно, поэтому я думаю, что это будет хорошо работать, по крайней мере, как доказательство концепции, чтобы вы собираетесь. Вы будете хотеть использовать сочетание типов " коннектор "вместе с" tcpclient "и"tcpserver".

просто для записи, метод, который хорошо работает в 2016 году (начиная с chrome 26), но должен быть отозвано в течение следующих 2 лет это развернуть html5 в качестве приложения chrome и использовать хром.usb (или хром.серийный или хром.блютус.)

в настоящее время я использую chrome.usb и планирование перехода на веб-приложение с помощью WebUSB API (см. ответ Supersharp), который, я надеюсь, будет принят к тому времени, когда Google прекратит приложения chrome .

простой способ чтения штрих-кода может исходить от входа (сообщение ввода клавиатуры), как в видео, https://www.youtube.com/watch?v=21VTEv3vL7o

вот реализация NPAPI для полнофункциональной функции сканирования штрих-кода. https://code.google.com/p/npapi-barcode-scanner-sample/wiki/usage

вы также можете сделать кредитную карту с помощью NPAPI.

для применения POS, вам нужно браузер быстрой реакции, javascript, AJAX, websocket(может быть) https://www.youtube.com/watch?v=cg61WvIqVJc

с наилучшими пожеланиями, Джек Вонг

jack.wong@zetakey.com