web-dev-qa-db-ja.com

2017年にユーザーのシリアルポートからWebページを読み取るにはどうすればよいですか?

既存のシステムをゼロから再実装する必要があります。

ある時点で、ユーザーが特定のWebページに移動すると、サーバーはユーザーのシリアルポートからデータを読み取る必要があります。

現在、WebページにはActiveXコントロールがあります。ページがロードされると、ActiveXコントロールは、シリアルポートからデータを読み取るユーザーのPC上のCOM DLL)を呼び出します。

システムは10年前です。これを実装できる「より良い」方法はありますか?

たとえば、過去10年間でテクノロジーは進歩しています。このソリューションはMS IEでのみ動作するようです。MSIEの市場シェアは約26%です(2013年、この質問を最後に更新したとき。2107年2月現在、MS IE =は3〜4%、Edgeは1〜2%です。EdgeはMS製品でもあるため、mightActive Xのサポート-試したことはありませんが、Otohはゼロから新規であるため、そうでない可能性が高いです。

HTML 5は新しい可能性を提供しましたか? Cordova のような製品はどうですか?

他の可能性はありますか?

Raspberry Piを追加して、シリアルポート経由で読み取りを実行し、ブラウザーアプリにRESTfulサービスを介して通信させることができますか?


[更新] @ EuroMicelliは、「ネイティブアプリの代わりにWebブラウザーからアプリを実行する非常に正当な理由があると仮定します」と述べました。元のプロジェクトがいつ計画されたのかわからなかったので、私は知りません(そして、それを設計した会社は現在は機能していません)。

おそらく、エンドユーザーがデータベースと直接やり取りすることを望まなかったのでしょうか?おそらく「ブラウザベース」は当時の新しい流行語だったのでしょうか?個人的には、デスクトップアプリに問題はありません(実装が簡単だと思います)が、ブラウザベースのままにすることを検討する必要があるでしょうか。 (私は自分でデスクトップアプリを処理できます;それはボーナスを提供することにつながるCOMポートからのブラウザーベースの読み取りのみです;-)

19
Mawg

別の(「web-of-things」のような)オプションに名前を付けるだけです:外部ハードウェア。

使用事例に応じて、arduinoマイクロコントローラーやraspberry-pi組み込みPCなどの外部の低価格デバイスを使用できます。

この種のデバイス上に単純なシリアルからWebサービスへのブリッジを構築することはそれほど難しくありません。このようないくつかのプロジェクトを使用できます。 : https://code.google.com/p/serwebproxy/

このようなシナリオでは、すべての低レベルのものは外部ハードウェアによって処理され、インターフェイスのようなWebサービスによって(get/postを介して)提供されます。

さらに利点は、アプリケーションを実行するPCがシリアルポートを必要としないことです(一部のシステムでは非常にまれです)。

ブラウザーアプリケーションから、単純なajax呼び出しを使用して、組み込みデバイス上のWebサービスを照会できます。ブラウザにはプラグインはまったく必要ありません。ソリューションはクロスプラットフォームで機能し、汎用的であり、近い将来ブラウザ技術の開発から独立しています。

7
Chris

確かなことは、ローカルマシンに特別なバイナリをインストール(および適切な特権で実行)しない限り、ローカルマシンハードウェアと通信できないことです。ただし、これは、ActiveXコンポーネントを使用する必要があり、Internet Explorerにとどまる必要があるという意味ではありません。もちろん、市場のすべてのブラウザー用のコンポーネントを開発することもできます。

別のアプローチをお勧めします:

  • Windowsサービスを作成し(マシンがWindowsを実行していると仮定します)、必要な特権で構成します。とにかくマシンに何かをインストールする必要があります。サービスは任意の言語で実装できます。
  • HTTP(S)サーバー機能を追加します。ここでは、WCFからWebAPIまで、多くのテクノロジを使用できます。
  • HTTPを介して独自の通信プロトコルを発明します。 JSON、Ajax、WebSockets、SignalRなどを使用できます。
  • 市場に出回っているほとんどのブラウザーと互換性のあるJavascriptファイルを作成します。つまり、一度だけ作成するだけで、シリアルCOM APIになります。 JavascriptおよびAjax機能( XmlHttpRequest )を備えたすべてのブラウザーを、1つのコードベースのみでサポートできます。

これは次のようになります。 enter image description here

23
Simon Mourier

クライアントマシンの外部ライブラリまたはプラグインの要件を最小限に抑えるには、Java Appletを記述します。

概要(それを実現するために必要なほとんどのドキュメントへのリンクを含む)

  1. クライアントにJavaがインストールされていることを確認してください( ほとんどの場合はすでに 、インストールされていない場合はブラウザがインストールできます)(これはonlyこのアプローチでは、一部のクライアントからのインストールが必要になる場合があります)
  2. PureJavaComm のような外部インストールを必要としないJavaシリアルポートライブラリを選択します
  3. 非常に単純な Javaアプレット を作成し、シリアルポートの読み取りを行うパブリックメソッドを提供します
  4. アプレットに署名する 必要な権限が付与されるように システムアクセス権限
  5. Webページにアプレットを含め、単純に JavaScriptから直接パブリックメソッドを呼び出します

詳細:

StatOwl によると、すべてのマシンの約3分の2に必要なJavaフレームワークが既にインストールされているため、追加のインフラストラクチャを提供するようクライアントに依頼する必要さえありません。そして、もしあなたがそうするなら、少なくともあなたは( 大部分 )人々が知っていて、あまり懐疑的ではない、よく維持されたソフトウェアを求めています。また、ほとんどのブラウザには、Javaフレームワークがない場合に自動的にインストールするようにユーザーに促す機能が必要です。

Javaでシリアルポートにアクセスするために使用できるいくつかの異なるライブラリがあります。 PureJavaComm は、実行に外部コードを必要としない数少ないものの1つと思われます。具体的には、Windowsでは、 WinAPI Javaクラスにより、既にインストールされているWindowsライブラリの呼び出しを使用して、すべての設定を含むCOMポートに直接アクセスできます。 PureJavaCommはJavaのみのライブラリであるため、アプレットとともに1つの.jarファイルにパッケージ化できます。このファイルはブラウザによって自動的にダウンロードされるため、インストールするものは何もありません。

次に、必要なシリアルポートアクセスを行うパブリックメソッドを定義する最小のJavaアプレット(おそらく合計で約50〜100行)を記述し、JavaScriptから簡単に直接呼び出すことができます。 JavaScriptコードからのアプレットメソッドの呼び出し

確認する必要があるのは、 アプレットに署名する であり、シリアルポートコードを doPrivileged(...) 呼び出しでラップして許可することです。 JVM Sandbox内から必要なシステムアクセス。このために、購入したSSL証明書(サービスでhttpsを使用している場合は既に持っている可能性があります)を取得するか、独自の証明書を生成できます。独自に生成する場合、ユーザーはアプレットを信頼するかどうかを尋ねられますが、「常に信頼する」を選択できるため、チェックボックスを1回クリックするだけでOKをクリックできます。しかし、それ以上に、これはユーザーエクスペリエンスへの影響を最小限に抑える完全に透過的なソリューションである必要があります。

代替1:

別のオプションは、単にWebインターフェースを捨て、代わりに JNLP(Java Web)を使用してWebサイトから直接(インストールの有無にかかわらず)ユーザーが簡単に実行できるJavaプログラムを提供することです。開始)

代替案2(同様にWindowsのみ):

Microsoft Silverlight も使用できると思いますが、これも かなり広く展開されている のようです。

Silverlight 5とのシリアル通信(COMポート)

Javaアプレットよりも「近代的」と考える人もいるかもしれませんが、おそらくクロスプラットフォームではありません。

JavaScriptからSilverlightコードを呼び出すことも少し複雑に思えますが、可能です:

JavaScriptでSilverlightをスクリプト化可能にする

10
Markus A.

Web USBを使用できますが、ブラウザの互換性は(現在)非常に低いです-Chrome 61はそれについてのようです。

このアプローチの主な利点は、USBデバイスがブラウザマシンに接続されていることです。どうやらこれはChrome for Android 64(テストされていない)でも動作します。

APIは https://wicg.github.io/webusb/ にあります。

チュートリアルについては、 https://developers.google.com/web/updates/2016/03/access-usb-devices-on-the-web を参照してください。

5
AndyS

おそらくない。

ネイティブアプリの代わりにWebブラウザーからアプリを実行する非常に良い理由があると仮定します。正当なビジネス上の決定であることを確認できるいくつかのシナリオを考えることができます。

今日のすべての進歩に伴い、Webブラウザーは、ユニバーサルランタイム環境ではなく、依然として派手なインタラクティブドキュメントビューアーです。 Websocketのような最先端の機能でさえ、洗練されたクライアント/サーバー通信を可能にするために導入されました。これは、ある日ブラウザからすべてを行えるという普遍的な関心のためではありません。

ネイティブにそれが可能な特別な環境があるかもしれません(Chrome OS?)が、それは一般的な解決策ではありません。ブラウザタグまたはスクリプトを使用してシリアルポートを開きます。つまり、ActiveXのようなかなり低レベルのプラグインテクノロジが必要になります。Ok with = IEは、特に既に記述されていて動作する場合のみサポートします。

ブラウザーからシリアルポートアクセスを探しているほとんどの人は、おそらく、ラボ機器、バーコードスキャナー、科学機器など、指定(ビルド/販売?)および制御する独自のハードウェアからデータを取得しています。必要なブラウザを指定することも完全に受け入れられます。特殊なアプリケーションは一般的にそれを行います。

さらに幅広いブラウザサポートを確認したい場合は、この質問に対して提案されているソリューションをご覧ください。 Adobe Flashを使用したシリアルポートとの通信 。私はこの製品の経験はありませんが、それが機能する場合、ほとんどのブラウザーが単一のコードベースでやりたいことを行えるようになるはずです。

最終的には、サードパーティのプラグインが必要になります。

5
Euro Micelli

Node JSをサーバーとして使用するシリアルポートパッケージはオプションです。これはWindowsで動作し、LinuxおよびOSXでも動作します。 https://github.com/ node-serialport/node-serialport

これは、USB経由でブラウザにマイクロビット通信を読み取るために使用したソリューションです。私はWindows用のドライバーを再構築する必要がありました(10):

  • npm install --global --production windows-build-tools
  • npm install serialport --build-from-source

参考のために、以下のコードを貼り付けました。

const serialport = require('serialport')

// list serial ports:
const find_microbit = (error, success) => {
  serialport.list((err, ports) => {
    if (err) {
      error(err)
    } else {
      let comName = null
      ports.forEach((port) => {
        if ((port.vendorId == '0D28') && (port.productId == '0204')) {
          comName = port.comName
        }
      })
      if (comName != null) {
        success(comName)
      } else {
        error('Could not find micro:bit.')
      }
    }
  })
}

exports.get_serial = (error, success) => {
  find_microbit(error, (comName) => {
    let serial = new serialport(comName, {baudRate: 115200, parser: serialport.parsers.readline('\n')}, (err) => {
      if (err) {
        error(err)
      } else {
        success(serial)
      }
    })
  })
}
/* e.g.
get_serial((err)=>{console.log("Error:" + err)},
    (serial)=>{
        serial.on('data', (data) => {
            let ubit = JSON.parse(data)
            if (ubit.button == 'a') {
                console.log('Button A Pressed')
            }
            if (ubit.button == 'b') {
                console.log('Button B Pressed')
            }
            if (ubit.ir) {
                console.log('Visitor detected')
            }
        })
    })
    */

私にとってこのアプローチは機能しますが、機能させるのに時間がかかる場合があります。私の考えでは、それは明らかな、または単純な解決策ではありません。それには、かなりの量の技術的なノウハウが必要です-そして、私は、本来よりもはるかに複雑で「トリッキー」だと感じています。

特に、ライブラリを再構築することは、Node JSを使用するときに期待することではありません。考えられる効果の1つは、異なるプラットフォームのシリアルポートバイナリを再構築する必要があることです。

2
AndyS