自己的 Laravel5.2 框架项目中,希望集成 Layer 的图片上传功能 但是在 ajax(POST) 提交请求时,一直显示 500 报错,出现了VerifyCsrfToken报错问题的相关内容,享出来供大家参考学习
报错情况
原因
忽视了 CSRF 的限制,Laravel 推荐在全局注册 VerifyCsrfToken 的 Middleware ,对所有 Post,Put,Delete 请求自动校验是否带合法的 _csrf token。
解决方法
方法 1.在form表单中添加如下的隐藏域代码
<input type="hidden" name="_token" class="tag_token" value="{{ csrf_token() }}" />
方法 2.在form表单中添加 csrf_field
(与上述解决方法功能一致)
{!! csrf_field() !!}
方法 3.注释 Kernel.php 代码
打开 app\Http\Kernel.php,在文件中注释掉下面的代码
\App\Http\Middleware\VerifyCsrfToken::class
方法 4. 修改handle()方法
打开 \app\Http\Middleware\VerifyCsrfToken.php,添加或修改 handle()方法如下:
public function handle($request, \Closure $next)
{
// 使用CSRF
//return parent::handle($request, $next);
// 禁用CSRF
return $next($request);
}
以上就是对VerifyCsrfToken报错问题的解决,
layui上传文件的使用:
在config/filesystems.php配置上传路径:uploads
这里简单解释下一些配置:
local:为本地空间; 默认是local ;
storage_path()指的是:文件保存在storage文件下的app;
public_path()指的是:文件保存在public文件下的uploads;
s3:是亚马逊的配置,可以忽略;
路由:
Route::any('student/uploads',['uses'=>'StudentController@uploads']);
html代码:
引入layui
<link rel="stylesheet" href="{{asset('static/layui/css/layui.css')}}">
<script type="text/javascript" src="{{ asset('static/layui/layui.js')}}"></script>
<button type="button" class="layui-btn" id="test1"><i class="layui-icon"></i>上传图</button>
<img id="imgname">
<input type="hidden" name="img" id="img">
<!-- 一般在表单提交时,都会存放一个隐藏的输入框 -->
<input type="hidden" name="_token" class="tag_token" value="{{ csrf_token() }}">
js代码:
<script>
layui.use('upload', function(){
var upload = layui.upload;
$ = layui.jquery;
var tag_token = $(".tag_token").val(); //ajax 请求前,先获取 csrf_token() 值
//执行实例
var uploadInst = upload.render({
elem: '#test1' //绑定元素
,url: '{{ url("student/uploads")}}' //上传接口
,data:{'_token':tag_token} //ajax 请求时,将该值作为数据的一部分传输过去
,exts: 'jpg|png|gif'
,done: function(res){
if(res.code == 200){
layer.msg('上传成功!');
$('#imgname').attr('src','/uploads/'+res.data);
$('#img').attr('value',res.data);
}
}
,error: function(){
//请求异常回调
}
});
});
</script>
后端处理:
public function uploads(Request $request){
if($request->isMethod('POST')){
$file = $request->file('file'); //接受
//文件是否上传成功
if($file->isValid()){
//源文件名
$originaName = $file->getClientOriginalName();
//扩展名
$ext = $file->getClientOriginalExtension();
//MimeType
$type = $file->getClientMimeType();
//临时绝对路径
$realPath = $file->getRealPath();
//文件名
$filename = date('Y-m-d').'-'.uniqid().'.'.$ext;
//方法:返回boolean值
$bool = Storage::disk('uploads')->put($filename,file_get_contents($realPath));
if($bool == true){
return ['code'=>200,'data'=>$filename];
}else{
return ['code'=>0,'msg'=>'上传失败!'];
}
}
}
}