Last Updated: 2/6/2024, 5:44:57 AM

# Flask チュートリアル
(環境構築編)

WARNING

書きかけです。

Flask のアプリをデプロイします。

Flask のデプロイを通して、 インフラ周りを触って行くようなイメージです。 主に以下のようなことをします。

  1. Heroku にデプロイ
  2. ドメインの購入(DNS)
  3. HTTPS 化(SSL/TLS)
  4. Cloudflare, CDN の設定
  5. www なしのドメインの割り当て(DNS)
  6. Twitter, GitHub アカウントでログイン(OAuth)

# 1. 目的

Flask で作ったアプリを Heorku にデプロイするチュートリアルを稀に見かけたりします。

HTTPS に対応していなかったりします。 近年の SEO では HTTPS 対応は必須です(SSL/TLS)。

なぜなら Google が HTTPS 対応していないとブラウザに危険!と 表示されてしまいます笑

Chrome で表示させた時にこのサイトは危険みたいなことを 全画面で表示された時は、 そこまでやらんでも... と思って笑ってしまいました笑

また他にも Twitter, GitHub アカウントでログインさせたいし(OAuth)、 せっかく買ったドメイン名は www を付けないで使いたいです(DNS)。

それに CDN でアクセスの高速化もしたいです。 そんなことをここではやっていきます。

# 2. 対象

よくある市販の Flask チュートリアルを終えたぐらいの方を対象にしています。

# DNS まわり

また DNS に関連する書籍を1つ通読してほしいです。 www 無しのドメインを割り当てる時にも死にますし、 Cloudflare(CDN) 周りで何やってるのか本当にちんぷんかんぷんになります。

自分はこれを読んで勉強しました。 基本の話、運用面の話がとても分かり易かったです。

ただ、これだけだと CNAME Flattening は厳しい感じがします。 可能なら以下の2冊のうちいずれかを触っておいた方が良いような気がします。

上の2冊とも読んでいないのですが発売日が新しい 「DNS がよくわかる教科書」の方がよさげな雰囲気を感じます。 後者1冊でもいいのかもしれません。

# CDN, HTTPS, OAuth は大丈夫なのか?

たぶん、ネットの記事だけで大丈夫です。 でも DNS は別です。 手順を書いてはいるのですが、全体像が見えないと、ちょっと厳しいかなと感じます。

# 3. 敗因

色々と欲張って、近年稀に見るどハマりをしたので、 メモします。 ワイの屍を超えて行ってください笑

なんで沼に嵌ったのかというと、 欲張って1度にいろんなことをしようとしたからです。

いろんな概念がごっちゃになって死にました。 順番に1つずつクリアして行くべきでした。

CDN と OAuth と HTTPS が絡み合ってエラーになってることに、 あとになってから気づいた時は、よくこの混沌から抜け出せたなと思いました笑

# 4. 背景

# (1) HTTPS 化

よく SEO の話題を聞くので、とりあえず本を一冊通読しました。

サイトを構築するときに最初にやっておいた方がよさそうなものをピックアップしておきたかったからです。 おそらくその中でやっておいた方が良いのは、 HTTPS 化かなと思いました。 他にもあるのかもしれませんが、いまの自分には HTTPS 化が限界でした。

なぜかというと途中で HTTPS 化すると被リンクを切ってしまうことになるからです。 基本的に URL は永続化が基本らしいです。

結局、どのくらいインパクトがあるのかは、わかりません。 以下の記事はとても参考になりました。 ありがとうございます。

他にも考えるべきことはたくさんあったと思うのですが、 技術的に簡単でインパクトがありそうなのは HTTPS 化でした。

もちろん 301 リダイレクトで、飛ばす方法もあるのですが、 どのくらい被リンクの影響を受け継いでくれるのかわからなかったからです。

実際、記事を「はてなブログ」から専用サイトに移管する際に JavaScript リダイレクトを使いました。 めちゃくちゃ遅い、反映がです。

Google は、めちゃくちゃすごい。 でも必ずしも完璧ではないといから、 頼ったらいけないというのが URL の永続化に対する温度感かなと感じました。

# (2) CDN

Heroku を HTTPS 化するのに CDN(Cloudflare) を使うと無料になるからです。

# (3) OAuth

これはただやって見たかったからです笑

# 5. 全体の流れ

# 1. Flask チュートリアル(環境構築編)

全体の流れを見て行きます。

# 2. クラウドってなんだ?

クラウド、クラウドって聞くけど、 よくわからなかったので、簡単にまとめました。

# 3. PaaS ってなんだ?

クラウドの分類の中に PaaS があります。 よくわからなかったので、簡単にまとめました。

# 4. Heroku にデプロイする。

Flask で作った Hello, world! アプリを Heroku にデプロイします。

# 5. SSL 秘密鍵と証明書を発行する。

HTTPS 化に必要な SSL 秘密鍵と証明書を発行します。

Heroku にあげるときには、使いません。 なぜなら、Cloudflare が発行してくれたものを使うからです。

しかしローカルのサーバで動かすときに使うので、発行していきます。

# 6. Flask を HTTPS 化する。

Flask で HTTPS 化する方法を見ていきます。

# 6. Heroku を HTTPS 化する。

Heroku で HTTPS 化する方法を見ていきます。 これは有料で今回は使いません。 しかし、一応やり方はあるので、簡単に触っていきます。

# 7. Heroku にドメイン名を付ける。

Heroku にドメイン名を付与します。 ここでは一旦理解のため www ありのドメイン名を付与します。

# 9. Cloudflare ってなんだ?

CDN である Cloudflare の概要とサイトの登録を行います。

# 10. Cloudflare で HTTPS 化する。

Cloudflare を間に入れることで HTTPS 化することができます。 Heroku で HTTPS 化しようとすると有償になります。 この方法なら無料です。

# 11. www なしの ドメインを設定する。

例えば「お名前.com」などで example.com というドメイン名を買ったとします。 普通に考えてサイトのドメイン名には example.com を使いたいと思うじゃないですか。

そうはいかないんです。 通常は、例えば www などの別の文字を添えて www.example.com などにしないといけません。

しかし Cloudflare の DNS を使えばその制限がなくなります。

# 12. OAuth を使う。

Twitter や GitHub アカウントでログインできるようにしていきます。 Flask の公式チュートリアルのコードを改変していきます。

# 6. おわりに

ここまで以下のように見てきました。

以上になります。どうぞよろしくお願いいたします。

Flask チュートリアル(環境構築編)