nginxのエラー「413 Request Entity Too Large」の解決方法

前提開発環境

• AWSのEC2インスタンスを使用してデプロイ済み
• Ruby on Rails6で開発

エラー概要

Rails6で投稿アプリを作成し、本番環境で投稿すると下記画像のエラーが発生しました。

画面を無駄に占有して413 Request Entity Too Largeとエラーが発生しました。
もうちょっと控えめな自己主張をして頂きたいものです((((；ﾟДﾟ)))))))

投稿した画像サイズが大きすぎると怒られています。
画像サイズの設定を変更する為にEC2へログインします。

恒例のコマンドです。
以下を順にローカルのターミナルに入力していく。

①mkdir ~/.ssh

②cd .ssh/

③lsコマンドで、EC2で作成済みの<鍵名>.pemが表示される。

④chmod 600 <鍵名>.pem

⑤ssh -i <鍵名>.pem ec2-user@<EC2で発行したElastic IP>

すると、

  __|  __|_  )
       _|  (     /   Amazon Linux 2 AMI
      ___|\___|___|

と、上記の表示が出てEC2へのログインが完了。

viでnginxのファイル編集

今回はnginxの画像投稿許容サイズを引き上げる必要があります。
デフォルトが1MBまでなので、それ以上の容量を送信すると上記のエラーが起きます。

エラー解消の為に、Amazon Linuxに標準で装備されているテキストエディタviでファイル編集を行います。

EC2にログインしている状態で下記コマンドを実行する。
$ sudo vi /etc/nginx/nginx.conf

これでviが起動して、さらに編集したいファイルが表示されますが、結構長い表記のファイルです。その中でhttp {}の中で追記を行います。

ファイル表示しただけでは編集できないので、「i」を押してinsertモードに切り替えてファイル編集を行いましょう。

# /etc/nginx/nginx.conf
....中略

http {
    ....  
    .... #中略

    sendfile            on;
    tcp_nopush          on;
    tcp_nodelay         on;
    keepalive_timeout   65;
    types_hash_max_size 4096;
    client_max_body_size 20M;　#この項目を追記します。
    ....
    server {
        ....
        ....
    }
　　　....以下省略
}

追記したら「esc」を押してinsertモードを終了し、「:wq」で変更を保存します。

ファイル編集は終わりましたが、あとは更新を反映させる必要があります。
今回のパターンは編集ファイルの反映が目的なので、nginxの再起動でなくリロードを行います。

sudo service nginx reload

これでviファイルへの編集が反映されたので、サイズが大きい画像サイズも送信が可能になります。viにはまだまだ馴染みが薄いので、慣れていきたいところです。

追記　viの操作方法

viエディタで実際の設定ファイルを編集する場合の流れ

1.「通常モード」でファイルを開く
2.「インサートモード」でファイルを編集する
3.　再び「通常モード」へ移行し、「:wq」で保存して終了する

通常モード
viエディタには「通常モード」と「インサートモード」があります。
通常モードは、viエディタにコマンドを打つことでファイルを保存したりviコマンドを終了したりできます。

「通常モード」のコマンド

コマンド    説明
:w  作成・編集したファイルを保存します。
:q  viコマンドを終了します。
:q! 編集した内容を保存しないでviコマンドを強制終了します。
:wq 編集した内容を保存してviコマンドを強制終了します。

i (インサートモード)
「通常モード」では、文字を入力することができません。文字を入力したい場合は、インサートモードにする必要が有ります。「I」キーを押すとインサートモードになり、文字の入力が可能です。

Esc
Escキーを押すと通常モードに戻ります。