用laravel5.1和dropzonejs上传图片,参照了这个示例:http://www.dropzonejs.com/bootstrap.html,示例中点击开始上传,会发送http请求。我复制了这个示例的代码,点击开始上传的时候,没有任何反应,按F12查看,没有发送http请求。
截图如下:
1、这是上面示例的截图,请求虽然不会发送成功,但它会发送
2、这是我的,不会发送请求
代码如下:
视图:
upload photos
![]()
js代码:
路由:
Route::resource('fileupload', 'FileController');
控制器:
public function imageUpload(Requests\StorePhotoPostRequest $request)
{
$this->wrongTokenAjax();
$file = \Input::file('file');
$destinationPath = 'uploads/';
$extension = $file->getClientOriginalExtension();
$fileName = \Auth::user()->id . '_' . time() . '.' . $extension;
$upload_success = \Input::file('file')->move($destinationPath, $fileName);
if ($upload_success) {
return \Response::json('success', 200);
} else {
return \Response::json('error', 400);
}
}
public function wrongTokenAjax()
{
if (\Session::token() !== \Request::get('_token')) {
$response = [
'status' => false,
'errors' => 'Wrong Token',
];
return \Response::json($response);
}
}
StorePhotoPostRequest
public function rules()
{
return [
'file' => 'required|image(jpeg,jpg,png,bmp,gif)',
];
}
Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号
首先,你使用http://www.dropzonejs.com/bootstrap.html 这个的例子的时候只是将其一部分页面元素使用到了,但是在js中却还存在使用这些元素的代码,原本的页面在上传文件的边上有一个用来上传全部文件的按钮“start upload”和取消的“cancel upload”,你的页面只有一个“add photos”:
但是在js中还存在这样的调用代码:
所以你讲如上的这几行js注释掉,然后来解决下一个问题。
其次,在原本那三个按钮的右边其实还存在一个总的“进度条”,在你的页面没有:
但是你还是用了如下的js:
要么你加上其余的两个“按钮”和“总进度条”,要么删除有关这三个元素的js,然后就可以了。剩下就是服务器端接收处理的事情。