三個(gè)思路解決laravel上傳文件報(bào)錯(cuò)：413 Request Entity Too Large問(wèn)題

最近一個(gè)項(xiàng)目當(dāng)中，要求上傳圖片，并且限制圖片大小，雖然在laravel當(dāng)中已經(jīng)添加了相關(guān)的表單驗(yàn)證來(lái)阻止文件過(guò)大的上傳，然而當(dāng)提交表單時(shí)，還沒(méi)輪到laravel處理，nginx就先報(bào)錯(cuò)了。當(dāng)你仔細(xì)看報(bào)錯(cuò)頁(yè)面時(shí)，你會(huì)發(fā)現(xiàn)有nginx版本信息，經(jīng)過(guò)分析，這報(bào)錯(cuò)是因?yàn)閚ginx的默認(rèn)上傳文件大小配置client_max_body_size只有2MB， 基于nginx驗(yàn)證比laravel驗(yàn)證要早，想要友好報(bào)錯(cuò)而不是直接顯示413 Request Entity Too Large，那么就有三個(gè)思路去解決。

   思路一：修改nginx配置

   這是最簡(jiǎn)單的一個(gè)做法，著報(bào)錯(cuò)原因是nginx不允許上傳配置過(guò)大的文件，那么件把nginx的上傳大小配置調(diào)高就好。

    1、打開(kāi)nginx主配置文件nginx.conf，一般在/usr/local/nginx/conf/nginx.conf這個(gè)位置，找到http{}段并修改以下內(nèi)容：

client_max_body_size 2m; 

  當(dāng)中的2m修改成你需要的允許文件大小。

   2、修改后，測(cè)試nginx配置是否正確

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

 3、測(cè)試配置正確后，重啟nginx使配置生效

/etc/init.d/nginx restart

注意:要是以php運(yùn)行的話，這個(gè)大小client_max_body_size要和php.ini中的如下值的最大值差不多或者稍大，這樣就不會(huì)因?yàn)樘峤粩?shù)據(jù)大小不一致出現(xiàn)錯(cuò)誤。

post_max_size = 2M 
upload_max_filesize = 2M 

當(dāng)中的2m修改成你需要的允許文件大小。把當(dāng)中的2m修改成你第一步設(shè)置的大小。 

   思路二：修改添加友好報(bào)錯(cuò)頁(yè)面

 思路一雖然簡(jiǎn)單，但是不一定能過(guò)項(xiàng)目測(cè)試那一關(guān)，項(xiàng)目測(cè)試就要求不要看到413 Request Entity Too Large這樣顯示錯(cuò)誤，所以我們只好添加友好報(bào)錯(cuò)頁(yè)面咯。

  1、編輯一個(gè)簡(jiǎn)單的htm作為靜態(tài)友好頁(yè)面

(注意html文件亂碼請(qǐng)用meta http-equiv="Content-Type" content="text/html; charset=utf-8">)

2、更改nginx.conf在http定義區(qū)域加入：

fastcgi_intercept_errors on;

  3、nginx的網(wǎng)站conf配置中的server 定義區(qū)域加入：

error_page 413 /413.htm; 

（注意此處413與/413.htm之間不要用等號(hào)，否則返回狀態(tài)碼為200而不是413，同時(shí)盡量不要 http://www.xxx.com/404.html出錯(cuò)則會(huì)跳過(guò)該頁(yè)面）

4、測(cè)試nginx配置是否正確

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

5、如果上一步成功重啟nginx

/etc/init.d/nginx restart 

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

  思路二雖然比思路一有進(jìn)步了一些，但是提醒還是跳轉(zhuǎn)頁(yè)面了，這樣的用戶體驗(yàn)并不會(huì)好到哪里去，所以最終想到了思路三。上文已經(jīng)說(shuō)過(guò)，這413報(bào)錯(cuò)是來(lái)自后端nginx的，nginx的判斷雖然比PHP還要早，但是我們可以直接從前端處理呀！想到這里，實(shí)現(xiàn)并不難了。可以添加文件上傳事件判斷，如果文件超過(guò)限制的大小，那么就彈出警告框并讓提交按鈕失效，如果文件沒(méi)有超過(guò)限制大小，就提示大小合適，并且把之前的按鈕失效狀態(tài)取消掉。

   簡(jiǎn)單的HTML代碼：

form action="" method="post" enctype="multipart/form-data">     
 div class="form-group"> 
  label for="picture">文章展示圖片(800KB內(nèi)):/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> 
   發(fā)布 
  /button> 
 /p> 
/form> 

  JS代碼： 

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

總結(jié)：其實(shí)三個(gè)思路是按照時(shí)間順序來(lái)寫(xiě)的，在實(shí)際項(xiàng)目中最終的功能實(shí)現(xiàn)也是更新?lián)Q代才有了最后的結(jié)果。不過(guò)當(dāng)有這樣類似的經(jīng)驗(yàn)，下次遇到這樣的彎路就省掉，同時(shí)會(huì)讓自己的處理問(wèn)題的方式更加成熟。

以上所述是小編給大家介紹的三個(gè)思路解決laravel上傳文件報(bào)錯(cuò)：413 Request Entity Too Large問(wèn)題，希望對(duì)大家有所幫助，如果大家有任何疑問(wèn)請(qǐng)給我留言，小編會(huì)及時(shí)回復(fù)大家的。在此也非常感謝大家對(duì)腳本之家網(wǎng)站的支持！