MotoJapan's Tech-Memo

技術めも

【flask】Webサーバーをhttps対応する方法 【お家IT#4】

本件の実装の一部
motojapan.hateblo.jp

前回の続き
motojapan.hateblo.jp

目次

JavascriptからWebカメラを起動しようとしたら下記コードで怒られた。
非Secure通信下でのgetUserMediaはdeprecatedとのこと。

[Deprecation] getUserMedia() no longer works on insecure origins. To use this feature, you should consider switching your application to a secure origin, such as HTTPS. See https://goo.gl/rStTGz for more details.

SSL対応の手順

本来はSSLサーバー証明書を購入する必要があるがオレオレ証明書を作成することも可能。(通常利用は避ける)

秘密鍵を作成

まずサーバー側の鍵を作成

$ openssl genrsa -aes128 2048 > server_secret.key

Generating RSA private key, 2048 bit long modulus
.............+++
...............................................................................+++
e is xxxxx (0xxxxxx)
Enter pass phrase: (パスワード入力)
Verifying - Enter pass phrase:(パスワード再入力)

秘密鍵から公開鍵を作成

クライアント側の公開鍵を作成

$ openssl req -new -key server_secret.key > server_pub.csr
Enter pass phrase for server_secret.key: (パスワード入力)
・・・
↓必要事項入力
Country Name (2 letter code) [AU]:(国名)
State or Province Name (full name) [Some-State]:(都道府県名)
Locality Name (eg, city) []:(市区町村名)
Organization Name (eg, company) [Internet Widgits Pty Ltd]:(企業名)
Organizational Unit Name (eg, section) []:
Common Name (e.g. server FQDN or YOUR name) []:
Email Address []:

デジタル証明書を作成

デジタル証明書とは

  • 秘密鍵から作った)公開鍵を正真であることを証明するデータ
  • 本来はCAを通して発行される

配布用証明書を作成

$ openssl x509 -in server_pub.csr -days 365000 -req -signkey server_secret.key > cert.crt

flask上でHTTPSサーバー起動

#app.py
from flask import Flask, render_template, request
import ssl

app = Flask(__name__)
context = ssl.SSLContext(ssl.PROTOCOL_TLSv1_2)
context.load_cert_chain('cert.crt', 'server_secret.key')

@app.route("/")
def index():
    return render_template('index.html')

if __name__ == "__main__":
    app.run(host='0.0.0.0', port=800, ssl_context=context, threaded=True, debug=True)

実行

$ sudo python app.py
Enter PEM pass phrase: (パスワード入力)
 * Running on https://0.0.0.0:800/ (Press CTRL+C to quit)
 * Restarting with stat
Enter PEM pass phrase: (再パスワード入力)
 * Debugger is active!
 * Debugger PIN: 123-456-789


無事起動(めでたしめでたし)

おまけ

ちなみに回避方法もあるにはあるが、
Chrome on Androidの場合、回避すらできないケースもあるので
折角ならhttps対応すべき。