# BLUE Web Viewer の概要と開発の流れ

非表示表示

1. BLUE Web Viewer について
2. Web Viewer 動作環境
3. 開発の流れ

## BLUE Web Viewer について

「BLUE Web Viewer」 (以下「Web Viewer」と表記) は、表示器で動作する機能で、スマートフォンやタブレット (以下「スマートデバイス」と表記) およびコンピューターのウェブブラウザーと画面情報を共有することができます。Web Viewer を使用すると、表示器はサーバーになり、サーバーに接続しているスマートデバイスとコンピューターはクライアントになります。

1. クライアント
2. サーバー

クライアントを使用してウェブブラウザーからサーバーの操作を行うことができます。クライアントがサーバーに接続できるネットワークが設定されている場合、クライアントからのサーバーのリモート操作が可能です。

1 つのサーバーで、複数の同時クライアント接続を許可できます。

アプリケーション例:

- 表示器に搭載した機器の遠隔操作とモニター

- 大型モニターで表示器の画面を閲覧

MEMO:

- Web Viewer に対応しているモデルおよび Web Viewer クライアント数については、以下を参照してください。
  対応機種/機能一覧
- ネットワーク環境やクライアント端末の性能によって、通信が不安定になる場合があります。

到達しにくい場所 (クリーンルームや大規模施設内の離れた場所など) にある機械とのやり取りや、ディスプレイモジュールのない表示器とのやり取りなど、Web Viewer が役立つ可能性のあるアプリケーションは数多くあります。

Web Viewer システムでは、サーバーに接続して表示器の画面を表示するクライアントを複数サポートしていますが、サーバーと対話 (タッチ操作) できるのは 1 つのクライアントのみです。

## Web Viewer 動作環境

項目 | 説明
サーバー | 対応する機種および同時に接続できるクライアント数については、以下を参照してください。 対応機種/機能一覧
クライアント | HTTP
OS | ウェブブラウザー
Windows Windows Server | Google Chrome 64 以降 Microsoft Edge 80 以降
iOS 13 以降 iPadOS 13 以降 | Safari 13 以降 Google Chrome 78 以降
Android 4.4 以降 | Google Chrome 72 以降
HTTPS
OS | ウェブブラウザー
Windows Windows Server | Google Chrome 64 以降 Microsoft Edge 80 以降
iOS 16 以降 | Safari 16 以降 Google Chrome 102 以降
Android 11 以降 | Google Chrome 85 以降
MEMO: Internet Explorer と Firefox には対応していません。
対応プロトコル | HTTP HTTPS
対応言語 (ユーザーインターフェイス) | 英語、フランス語、ドイツ語、スペイン語、イタリア語、ポルトガル語、簡体字中国語、繁体字中国語、韓国語、日本語

### 不正アクセスを防ぐ安全なネットワークを構築する

不正アクセスを防ぐ安全なネットワークを構築するには、以下を参照してください。

サイバーセキュリティー

特に以下を推奨します。

- 暗号化された通信を使用した通信環境を構築してください。(例: VPN)
- 表示器は信頼できる安全なネットワークに設置し、ファイアウォールで保護してください。
- 利用可能な場合は、HTTPS を使用し、ユーザー認証を設定してください。

#### Pro-face Connect

Pro-face Connect を使用して暗号化された通信環境を構築することができます。

Pro-face Connect を Web Viewer と使用する場合、Creating an Agent 設定でポート設定を追加します。

ポート設定の追加ポート設定の追加

1. [SiteManager] ウィンドウで、 [Device Agents] の右横の [Edit] をクリックします。
2. ターゲットエージェントでアイコン をクリックしパラメーターを表示します。
3. [Extra TCP ports] フィールドに画面編集ソフトウェアで設定したポート番号を入力し [Save] をクリックします。

MEMO:

- Pro-face Connect 設定の詳細については、Pro-face Connect マニュアルを参照してください。
- Pro-face Connect による暗号化された通信環境では、スマートデバイスを Web Viewer クライアントとして使用することはできません。

## 開発の流れ

1. サーバーの設定
2. ユーザー認証設定の指定
3. SSL 証明書のエクスポートとインポート

### サーバーの設定

次にサーバーの設定手順について説明します。

重要: セキュリティーを強化するために [セキュリティー設定] を有効にすることを推奨します。[セキュリティー設定] を有効にすると、クライアントがサーバーに接続するときにユーザー認証が必要になります。

1. プロジェクトエクスプローラーウィンドウの [システム設定] に移動し、[Target01] をクリックします。
2. プロパティウィンドウで、[詳細] タブを クリックし [データアクセス] タブをクリックします。
3. [Web 機能設定] に移動し、[Web Viewer を有効にする] チェックボックスにチェックを入れます。
4. [Web Viewer 設定] に移動し、[セキュリティー設定] チェックボックスにチェックを入れます。
5. 必要に応じて [ポート番号] を変更します。

MEMO:

- [ポート番号] はWeb サーバーと Web Viewer で共有されます。有効なポート番号は 1024 から 65535 の間です。
- 個々の Web Viewer の設定については、以下を参照してください。

  - ログインページと配信ページをカスタマイズしたい

  - 占有オペレーション

  - ユーザーのロックアウト

  - 操作待機状態のクライアントのログアウト

  - 長押し操作のタイムアウト

  - クライアント数の確認

  - クライアントへの SSL 証明書インストール方法

### ユーザー認証設定の指定

Web Viewer の設定で、[セキュリティー設定] を有効にして、クライアントがサーバーにアクセスするときにユーザー認証が必要になるようにします。プロジェクトで設定されたユーザーとユーザーグループが、ユーザー認証に使用されます。

MEMO:

- ユーザーやユーザーグループのインポートなど、ランタイムでセキュリティー情報を変更すると、[Web Viewer 設定] ➞ [セキュリティー設定] が無効な場合を除き、クライアントはサーバーから自動的にログアウトされます。
- 1 人のユーザーのパスワードをランタイムで変更すると、そのユーザーがクライアントから自動的にログアウトされます。
- Web Viewer のクライアントはユーザー認証の設定を変更することはできません。

ユーザー認証を設定するには、次の手順に従います。

1. ユーザーとユーザーグループを設定します。次を参照してください。
   設計手順 (セキュリティー)
2. プロジェクトエクスプローラーウィンドウの [セキュリティー] に移動し、設定したいユーザーグループをクリックします。
3. プロパティウィンドウで、 [Web Viewer アクセス権] プロパティを設定します。

   [Web Viewer アクセス権]
   クライアントとしてログインするときのアクセス権を選択します。 [なし]: ログインできません。 [モニター]: 閲覧のみ可能。 [モニター/オペレーション]: 閲覧および操作可能。

### SSL 証明書のエクスポートとインポート

HTTPS を使用するには、表示器から SSL 証明書をエクスポートし、クライアントデバイスにインストールします。

クライアントへの SSL 証明書インストール方法

MEMO:

- HTTPS が有効な場合、初回起動時に SSL 証明書が存在しないと、表示器が自動的に証明書を生成します。
- SSL 証明書の有効期間は 825 日です。
- 証明書の有効期限が切れた場合、表示器を再起動すると、新しい証明書が自動的に再生成されます。
- SSL 証明書が有効な状態で IP アドレスを変更すると、証明書は無効と見なされます。この場合、証明書は自動的に再生成されません。ハードウェア設定画面から手動で再生成する必要があります。
- SSL 証明書には、URL で使用する IP アドレスを含める必要があります。表示器は、起動時にアクティブなネットワークアダプターの IP アドレスを使用して証明書を生成します。そのため、証明書生成時に使用した IP アドレスと実際の運用時に使用する IP アドレスが異なる場合、HTTPS 通信が失敗する可能性があります。この理由から、DHCP を有効にすると、予期しない IP アドレスが通信に使用される場合があります。
- ループバックアドレス (127.0.0.1) は HTTPS 通信には使用できません。ただし、シミュレーション中には使用できます。
- シミュレーションモードでは HTTPS がサポートされていますが、シミュレーションを開始するたびに新しい SSL 証明書が生成されます。