http-serverコマンドでHTTPS、CORSサーバをたてる

「フロントエンドをHTTPS化してHTTP公開しているREST APIに接続したい、でも自分のPCにApacheやNginxを入れてHTTPS化するのは面倒くさい」

開発中ってこういうニーズと悩みが結構多いです。HTTPS環境化でないと動かないHTML5 APIが増えてきたことで、さらに需要が増してきた感があります。

HTTPサーバ機能を提供してくれるソフトウェアは数あれど、Nodeモジュールのhttp-serverはこういったアドホックなニーズに簡単にマッチしてくれます。

SSL化する為のファイルを一度作ってさえしまえば、HTTPS開発環境を簡単に作れるようになります。

http-serverコマンドとは

必要最低限、かつ十分なHTTPサーバを起動する為のオーソドックスなNodeモジュール。

npm

 

13 Users

419 Pockets

http-server

https://www.npmjs.com/package/http-server

A simple zero-configuration command-line http server

https-serverコマンドで起動したHTTPSサーバの後ろに別サーバのREST APIがいる想定で起動します。

サーバ証明書を作る

どんなに簡単にHTTPSサーバ起動出来るソフトウェアでもCA証明書、サーバ証明書、サーバ秘密鍵は作っておく必要があります。

opensslを使って以下の3ファイルを作っておきます。最初は大変ですが、同じPCをサーバにするなら何度でも使いまわせるので一度作り置きしておくと便利に使えます。

One IT Thing

 

11 Pockets

HTTPS開発環境用、自己署名証明書の作成

https://one-it-thing.com/63

（2020/09/18追記）mkcertを使ってより簡単に完璧なSSL証明書を作ることができました。 ささっと開発用のHTTPSサーバを作りたい時はmkcert使った方が良いですね。 以下投稿内容だとAndroid7以上のChromeで接続出来ません。すっかりHTTPS必須の時代になり、それに併せてPWA関連、Payment Request API等、HTTPS環境下でないと機能しないAPIが出てきました。開発を簡便にする為にlocalhostへのアクセスであれば動作する措置が取られていたりしますが、それでもスマホ実機からサーバにアクセスする際はURLがlocalhostでは無くなる為エラー...

1. CA証明書：cacert.crt（OSにインストールしておく）
2. サーバ秘密鍵：nopass_server.key
3. サーバ証明書：server.crt

オプションに証明書、鍵ファイルを指定してhttp-serverコマンドを実行

http-server -p 80 -c0 -P http://localhost:8080/ \
  --cors --ssl --key c:\openssl2\nopass_server.key \
  --cert c:\openssl2\server.crt

コマンド起動後、80ポートで起動したHTTPSサーバから8080ポートのRESTサーバにSOP（Same Origin Policy）違反することなく通信出来るようになります。