[Django]さくらVPSで独自ドメイン + https(let’s encrypt) + wwwありなしリダイレクト設定

2021-09-18

さくらVPSでDjangoアプリケーションをデプロイしました。

目的とする作業は全て完了しましたが、振り返ると悪戦苦闘したので備忘録を兼ねてメモ。

何をやりたかったのか？

タイトルで書き散らかしていますが、やりたかったのは以下。

DjangoアプリケーションをさくらVPSにデプロイ→独自ドメインで運用
httpsで運用　ついでにhttpへのアクセスもhttpsへリダイレクト
ついでにwwwありへのアクセスもwwwなしへリダイレクト(http://wwwへのアクセスも含む)

こんな感じです。ちなみにhttpsのSSL証明はlet’s encryptで無料で取得しています。

これらの作業を以下で紹介していきます。

さくらVPSにデプロイして独自ドメインで運用する(お名前.com版)

まず1番最初にやるべきことはアプリケーションをデプロイして、独自ドメインを反映させること。

手続きとしては、

お名前.comで独自ドメインを購入する
お名前.comの管理画面でネームサーバー等の変更
さくらサーバー側で設定の変更

さくらVPSに独自ドメイン設定を反映させる部分はこちらの記事が参考になります。

お名前.comとさくらのVPSでネームサーバーを設定する

ちなみに、上記記事を参考にすればすぐに手続きは完了します。

しかし、ネームサーバー変更の反映に時間がかかるので、手続き完了後ドメインでアクセスしても反映されてないこともあるのでご注意ください。

また、無料お試し期間中は独自ドメインは追加できないので本登録に変更しましょう。本登録変更の手続き後、反映されるまで20分ほど時間を見ておくと良いです。

もう１つ注意点として、nginxのファイルでserver_nameの箇所がIPアドレスになっているのならば独自ドメインに変更しておきましょう。

sudo nano /etc/nginx/conf.d/gunicorn.conf

server_name 123.00.000.000;→domain.com

前後しますが、ファイルを編集したあとは、

sud systemctl reload nginx

を忘れずに。

SSL設定をする

さくらVPSでDjangoアプリケーション用のサーバーを構築する時に最初から let’s encryptを設定することができます。

Let’s Encrypt さくらのVPSマニュアル

すでに独自ドメインを使える状態にしているのであればこれだけでSSL化したDjangoアプリケーションをデプロイできます。

wwwありの設定をお名前.com側とDjangoアプリケーション側で設定する

無事にSSL化した独自ドメインの設定はできましたが、やりたいことはhttp(s)でwwwにアクセスされた時のリダイレクトです。

次にwwwの設定をお名前.com側でします。

wwwありのドメインへのアクセスを wwwなしのドメインに 301リダイレクト転送する方法

こちらだけではhttps://wwwのリダイレクトが設定できないのでhttps://wwwにアクセスされた場合のリダイレクト処理も行います。

そうするためにはまず、wwwのドメインでもSSL認証をしないといけません。

同じくlet’s encryptを使ってwwwありドメインのSSL証明を取得します。

Let’s EncryptのSSL証明書で、安全なウェブサイトを公開

これでwwwありのドメインでも取得できたはずです。

最後にnginxの設定ファイルにリダイレクト処理などを記述します。

# http wwwなしからのリダイレクト
server {
    listen 80;
    listen [::]:80;
    server_name example.com;
    return 301 https://$host$request_uri;
}

# http https wwwありからのリダイレクト
server {
    listen 80;
    listen 443 ssl;
    server_name www.example.com;
    ssl_certificate /etc/letsencrypt/live/www.example.com/fullchain.pem;
    ssl_certificate_key /etc/letsencrypt/live/www.example.com/privkey.pem;
    return 301 https://example.com$request_uri;
}

# リダイレクトを流される側の設定
server {
    listen 443 ssl default_server;
    server_name example.com;
    ssl on;
    ssl_certificate /etc/letsencrypt/live/example.com/fullchain.pem;
    ssl_certificate_key /etc/letsencrypt/live/example.com/privkey.pem;
    location /static {
        alias /var/www/static;
    }
    location / {
        proxy_pass http://127.0.0.1:8000;
        proxy_set_header Host $http_host;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
    }
}

失敗例

今まで経験した失敗例と対策をメモ。

nginxの構文が通らない

nginx -t で構文チェックが出来ますが、www.example.com/fullcahin.pem部分がエラーになる。

これは、www.example.comでSSL証明書を取得していないことが原因。

let’s encryptを最初に設定した時は、example.comのSSL証明書のみに留まるので別で www用のSSL証明書も取得すること。

独自ドメインでアクセスしてもwelcom to nginxのページしか表示されない

このエラーにはまってしまいました。

IPアドレスだと表示されるけど、独自ドメインに設定すると表示されない。

原因は、単純にnginxの記載ミスです。

上記、nginxの設定ファイルはwwwありなしに対応しています。

まだ、wwwありのSSL証明書を取得していない時に、wwwなしだけの記載をしていたのですが、記載ミスがありました。

wwwなしで、example.comだけのhttpsにアクセスする時は、上記設定ファイルの一部のみ抜粋します。

# リダイレクトを流される側の設定 
server { 
    listen 443 ssl default_server;
    server_name example.com; ssl on;
    ssl_certificate /etc/letsencrypt/live/example.com/fullchain.pem;
    ssl_certificate_key /etc/letsencrypt/live/example.com/privkey.pem;
    location /static { 
        alias /var/www/static;
    }
    location / { 
        proxy_pass http://127.0.0.1:8000;
        proxy_set_header Host $http_host;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
    }
}