最近一個專案當中，要求上傳圖片，並且限制圖片大小，雖然在laravel當中已經添加了相關的表單驗證來阻止檔案過大的上傳，然而當提交表單時，還沒輪到laravel處理，nginx就先報錯了。當你仔細看報錯頁面時，你會發現有nginx版本資訊，經過分析，這報錯是因為nginx的預設上傳檔案大小配置client_max_body_size只有2MB， 基於nginx驗證比laravel驗證要早，想要友好報錯而不是直接顯示413 Request Entity Too Large，那麼就有三個思路去解決。

思路一：修改nginx配置

    1、開啟nginx主配置檔案nginx.conf，一般在/usr/local/nginx/conf/nginx.conf這個位置，找到http{}段並修改以下內容：

client_max_body_size 2m;

/usr/local/nginx/sbin/nginx -t

/etc/init.d/nginx restart

post_max_size = 2M
upload_max_filesize = 2M

當中的2m修改成你需要的允許檔案大小。把當中的2m修改成你第一步設定的大小。

   思路二：修改新增友好報錯頁面

 fastcgi_intercept_errors on; 

error_page 413 /413.htm;  

/usr/local/nginx/sbin/nginx -t

  /etc/init.d/nginx restart

 思路三：表單提交之前先用JS判斷並且阻止表單提交

                <form action="" method="post" enctype="multipart/form-data">                  
                    <div class="form-group">
                        <label for="picture">文章展示圖片(800KB內):</label>
                        <input id="picture" name="picture" type="file"/>
                    </div>
                        <button type="submit" id="submit" class="am-btn am-btn-success"><span class="am-icon-send"></span>
                            釋出
                        </button>
                    </p>
                </form>

  $('#picture').bind('change', function () {
            if (this.files[0].size / 1024 / 1024 > 0.8){
                value = this.files[0].size/1024;
                alert('該檔案大小是 ' + value .toFixed(0)  + "KB,已超過大小限制，請修改！");
                document.getElementById("submit").disabled=true;
                document.getElementById("submit").innerHTML='非法圖片內容';
            }else{
                alert('該檔案可以提交！');
                document.getElementById("submit").disabled=false;
                document.getElementById("submit").innerHTML='提交';
            }
        });