Nginx解决错误413 Request Entity Too Large
2018-02-08 15:33
627 查看
最近一个项目当中,要求上传图片,并且限制图片大小,虽然在laravel当中已经添加了相关的表单验证来阻止文件过大的上传,然而当提交表单时,还没轮到laravel处理,nginx就先报错了。当你仔细看报错页面时,你会发现有nginx版本信息,经过分析,这报错是因为nginx的默认上传文件大小配置client_max_body_size只有2MB, 基于nginx验证比laravel验证要早,想要友好报错而不是直接显示413 Request Entity Too Large,那么就有三个思路去解决。
思路一:修改nginx配置
这是最简单的一个做法,着报错原因是nginx不允许上传配置过大的文件,那么件把nginx的上传大小配置调高就好。1、打开nginx主配置文件nginx.conf,一般在/usr/local/nginx/conf/nginx.conf这个位置,找到http{}段并修改以下内容:
client_max_body_size 2m; 当中的2m修改成你需要的允许文件大小。 2、修改后,测试nginx配置是否正确- /usr/local/nginx/sbin/nginx -t
- /etc/init.d/nginx restart
- post_max_size = 2M
- upload_max_filesize = 2M
当中的2m修改成你需要的允许文件大小。把当中的2m修改成你第一步设置的大小。
思路二:修改添加友好报错页面
思路一虽然简单,但是不一定能过项目测试那一关,项目测试就要求不要看到413 Request Entity Too Large这样显示错误,所以我们只好添加友好报错页面咯。 1、编辑一个简单的htm作为静态友好页面 (注意html文件乱码请用<meta http-equiv="Content-Type" content="text/html; charset=utf-8">) 2、更改nginx.conf在http定义区域加入:- fastcgi_intercept_errors on;
- error_page 413 /413.htm;
4、测试nginx配置是否正确
- /usr/local/nginx/sbin/nginx -t
- /etc/init.d/nginx restart
思路三:表单提交之前先用JS判断并且阻止表单提交
思路二虽然比思路一有进步了一些,但是提醒还是跳转页面了,这样的用户体验并不会好到哪里去,所以最终想到了思路三。上文已经说过,这413报错是来自后端nginx的,nginx的判断虽然比PHP还要早,但是我们可以直接从前端处理呀!想到这里,实现并不难了。可以添加文件上传事件判断,如果文件超过限制的大小,那么就弹出警告框并让提交按钮失效,如果文件没有超过限制大小,就提示大小合适,并且把之前的按钮失效状态取消掉。 简单的HTML代码:- <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>
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,已超过大小限制,请修改!");
- document.getElementById("submit").disabled=true;
- document.getElementById("submit").innerHTML='非法图片内容';
- }else{
- alert('该文件可以提交!');
- document.getElementById("submit").disabled=false;
- document.getElementById("submit").innerHTML='提交';
- }
- });
http://blog.csdn.net/tim_phper/article/details/51992986
相关文章推荐
- 【Nginx】错误 413 Request Entity Too Large 的解决方法
- Nginx 出现413 Request Entity Too Large 错误解决方法(上传大小限制)
- Nginx出现“413 Request Entity Too Large”错误解决方法
- Nginx代理的应用返回出现“413 Request Entity Too Large”错误(解决方法)
- 解决上传文件时 nginx 413 Request Entity Too Large 错误
- Nginx出现“413 Request Entity Too Large”错误解决方法
- 【Nginx】错误 413 Request Entity Too Large 的解决方法
- Nginx出现“413 Request Entity Too Large”错误解决方法
- Nginx出现“413 Request Entity Too Large”错误解决方法
- Nginx “413 Request Entity Too Large”错误解决方法
- Nginx出现“ 413 (499 502 404) Request Entity Too Large”错误解决方法
- Nginx出现“413 Request Entity Too Large”错误解决方法
- Nginx出现“413 Request Entity Too Large”错误解决方法
- WCF错误:413 Request Entity Too Large 的一个解决方法
- SVN-提交时出现(413 Request Entity Too Large)错误解决方法
- svn提交时出现(413 Request Entity Too Large)错误解决方法
- nginx 出现413 Request Entity Too Large问题的解决方法
- “413 Request Entity Too Large” 错误解决
- Nginx HTTP:413 Request Entity Too Large解决方法
- Nginx: 413 Request Entity Too Large解决方法