こんにちは！佐久ハラミです。
今日は、EDCBのMaterial WebUIを外から使えるように設定していきたいと思います。
EDCB Material WebUIを外から使おう
クライアント証明書認証をしよう
さて、前提として、http://localhost:5510/ や http://ローカルIP:5510/ で EDCB の HTTP サーバにアクセスできる状態です。この状態で、外部からアクセスしたい場合は、ルーターのポート転送機能を使って、EDCB を起動している PC の 5510 ポートに転送すれば、http://グローバルIP:ポート番号/ でアクセス可能です（EpgTimerのアクセス制御の設定を変更する必要がありますが）。
ただし、このままだと誰でもアクセスできてしまうため、セキュリティ上非常に問題です。そこで、認証機能を追加する必要があります。EDCB では、クライアント証明書認証を簡単に設定できる機能が備わっているので、それを使ってセキュリティを強化します。
クライアント証明書認証とは？
クライアント証明書認証は、サーバ側に鍵を掛け、クライアント側に鍵ファイルを渡して、それを用いて認証する仕組みです。証明書は、第三者機関から発行してもらうのが理想的ですが、個人で使うだけなら自分で作成しても問題ありません。それでは、証明書を作成していきましょう。
設定ファイルの作成
まず、設定ファイルを作成します。EDCBのインストールフォルダ（例：C:\tools\EDCB-241220\EDCB_64bit）に移動し、新規ファイルを作成します。ファイル名は「serveropenssl.cnf」とし、以下の内容を記入します。コメント部分（#）は、自分の環境に合わせて適宜修正してください。
[req]
default_bits = 2048
default_keyfile = server.key
distinguished_name = req_distinguished_name
x509_extensions = v3_ca
prompt = no
[req_distinguished_name]
C = # 国(JP)
ST = # 都道府県(Kumamotoとか)
L = # 市町村(Kumamoto Cityとか)
O = # 組織とかなんか適当に
OU = # なんか調べるといらなくなったらしい
CN = # IPアドレスやドメイン
[v3_ca]
subjectKeyIdentifier = hash
authorityKeyIdentifier = keyid:always,issuer
basicConstraints = critical,CA:TRUE
keyUsage = critical,keyCertSign,cRLSign,digitalSignature,keyEncipherment
subjectAltName = @alt_names
[alt_names]
DNS.1 = localhost
IP.1 = 127.0.0.1
IP.2 = XXX.XXX.XXX.XXX # ローカルIP
IP.3 = XXX.XXX.XXX.XXX # グローバルIP
次に、「clientopenssl.cnf 」という設定ファイルを作成します。内容は以下の通りです。こちらもコメント部分（#）を自分の環境に合わせて適宜修正してください。
[req]
default_bits = 2048
default_keyfile = client.key
distinguished_name = req_distinguished_name
req_extensions = v3_req
prompt = no
[req_distinguished_name]
C = # 国(JP)
ST = # 都道府県(Kumamotoとか)
L = # 市町村(Kumamoto Cityとか)
O = # 組織とかなんか適当に
OU = # なんか調べるといらなくなったらしい
CN = # IPアドレスやドメイン
[v3_req]
basicConstraints = CA:FALSE
keyUsage = digitalSignature,keyEncipherment
subjectAltName = @alt_names
[alt_names]
DNS.1 = localhost
IP.1 = 127.0.0.1
IP.2 = XXX.XXX.XXX.XXX # ローカルIP
IP.3 = XXX.XXX.XXX.XXX # グローバルIP
サーバ側の鍵や証明書の作成
まず、サーバ側で証明書を作成します。コマンドプロンプトを開き、EDCBのインストールフォルダに移動した後、以下のコマンドを入力します。この例では365日間の証明書を作成しますが、必要に応じて日数を変更できます。
openssl req -x509 -newkey rsa:2048 -keyout server.key -out server.crt -days 365 -nodes -config serveropenssl.cnf -extensions v3_ca
これで、server.key（サーバーの秘密鍵）と server.crt（サーバーの公開鍵および証明書）が作成されます。
次に、以下のコマンドを入力して、公開鍵と秘密鍵を1つのファイルにまとめます。
type server.crt server.key > ssl_cert.pem
これで、ssl_cert.pem（公開鍵と秘密鍵が1つにまとめられたファイル）が作成されます。
最後に、以下のコマンドを入力して、CA証明書的な役割を持つ ssl_peer.pem を作成します。
copy server.crt ssl_peer.pem
これで、ssl_peer.pem（CA証明書的なファイル）が作成されました。
クライアント側の鍵や証明書の作成
次に、クライアント側の鍵と証明書を作成します。同じくEDCBのインストールフォルダに移動し、以下のコマンドを入力します。
openssl req -new -newkey rsa:2048 -keyout client.key -out client.csr -nodes -config clientopenssl.cnf
これで、client.key（クライアントの秘密鍵）と client.csr（クライアントの証明書署名要求）が作成されます。
次に、以下のコマンドを入力して、クライアント証明書を作成します。こちらも例では365日間の証明書になりますが、日数は変更可能です。
openssl x509 -req -in client.csr -CA server.crt -CAkey server.key -CAcreateserial -out client.crt -days 365 -extfile clientopenssl.cnf -extensions v3_req
これで、client.crt（クライアントの公開鍵と証明書）が作成されます。
次に、以下のコマンドを入力して、client.crt と client.key を結合します。
type client.crt client.key > client.pem
これで、client.pem（client.crt と client.key を1つにまとめたファイル）が作成されます。
最後に、以下のコマンドを入力して、client.pem を .p12 形式に変換します。
openssl pkcs12 -export -in client.pem -out client.p12 -name "EDCB Client Cert"
実行すると、以下のように表示されます。
Enter Export Password:
ここで、client.p12 に設定するパスワードを決めて入力します。このパスワードは、後でクライアント側で証明書をインポートする際に必要となります。
次に、確認のために同じパスワードを入力します。
Verifying - Enter Export Password:
これで、client.p12（client.pem を .p12 形式に変換したファイル）が作成されます。
サーバ側の設定ポートの変更
EDCBのHTTPサーバ機能には、CivetWebが組み込まれてカスタマイズされています。そのため、SSLの設定は、ポートを変更し、必要なファイルを配置するだけで簡単に利用できます。
ポートの変更は、EpgTimerの設定から行います。具体的には、「基本設定」→「ネットワーク」タブ内の「HTTPサーバ」セクションにあるポート番号の末尾に「s」を追加してください。また、外部からアクセスする場合は、適切なアクセス制御を設定する必要があります（例では全開放にしています）。
設定が完了したら、タスクトレイからEpgTimerSrvを終了し、再度起動します。
これで、これまで通りの http://localhost:5510/ ではアクセスできなくなっているはずです。さらに、https://localhost:5510/ でもアクセスできないと思いますが、それはクライアント側に証明書（鍵）が設定されていないためです。
クライアントの設定
次にクライアントに鍵をインポートする必要があります。インポートするファイルは、client.p12 と server.crt です。これらは、作成したファイルをそのままダブルクリックすることで簡単にインポートできます。他のPCやスマートフォンにインポートしたい場合は、Google Driveなどの方法でファイルを渡してください。
まず、client.p12 をダブルクリックすると、証明書のインポートウィザードが開きます。保存場所は「現在のユーザー」に設定します。ダブルクリックしたファイルが選ばれていることを確認し、先ほど決めたパスワードを入力します。「証明書の種類に基づいて自動的に証明書ストアを選択する」を選び、そのまま「完了」をクリックします。
次に、server.crt をダブルクリックすると証明書が開きます。下にある「証明書のインストール」をクリックし、「現在のユーザー」を選びます。次の画面で、「証明書をすべて次のストアに配置する」を選択し、「信頼されたルート証明機関」を選びます。そして「完了」をクリックします。ダイアログが表示されたら、「はい」を選んで「OK」を押します。
これで、ブラウザを再起動し、もう一度 https://localhost:5510/ にアクセスすると、証明書の選択画面が表示されるはずです。
作成した証明書を選択すれば、無事にページが表示されるはずです。
最後に
いや、これめっちゃ苦戦しました。
最初に作った証明書では信頼されない通信になって、まぁ良いかなと思っていたんですが、やっぱり気になって悪戦苦闘して、ようやく今回の形になりました。
もしわからないところがあれば、気軽に質問してください。ここにはコメント欄がないので、Twitterやニコ生で聞いていただけると助かります。
それでは、また次回！
