我正在尝试使用Storage门面将用户图片上传到数据库。我用这个php artisan storage:link创建了一个符号链接，但文件路径既没有上传到数据库，也没有收到任何错误
这是我的代码
控制器
public function edituser_pic(Request $request){
if(Auth::check()){
$u_id = $request->id;
if($request->hasFile('mypic')){
$path = Storage::disk('public')->putFile('profile_image',$request->mypic);
$profilepic = $path;
}else{
$profilepic='';
}
DB::table('users')->where('id',$u_id)->update(['profilepic'=>$profilepic]);
return response()->json([
'success'=>true,
'path'=>$profilepic,
]);
}
}
在刀片中(尝试访问图像时(
<img class="img-fluid img-profile rounded-circle mx-auto mb-2" src="{{url('storage/'.Auth::user()->profilepic)}}" alt="AB" />
上传表单代码
<h2>Edit Profile Picture</h2>
<form id='profilepic' autocomplete="off" enctype="multipart/form-data">
@csrf
<input type="hidden" name="_token" id="csrf" value="{{Session::token()}}">
<input type="hidden" name="id" id='id' value="{{Auth::user()->id}}">
<label>Select an image to upload : <br><br>(only jpg, jpeg,png files are allowed)</label><br><br>
<input type="file" name="mypic" id="mypic" class="text-white">
<div class="error text-danger"></div>
<button type="submit" class="buttons bttn" id='editprofilepic'>Upload Image</button>
<button type="button" class="cancelb">Cancel</button>
</form>
<script>
//see below
</script>
脚本
$.validator.addMethod('filesize', function (value, element, param) {
return this.optional(element) || (element.files[0].size <= param * 1000000)
}, 'File size must be less than {0} MB');
jQuery.validator.addMethod("extension", function(value, element, param) {
param = typeof param === "string" ? param.replace(/,/g, '|') : "png|jpe?g|gif";
return this.optional(element) || value.match(new RegExp(".(" + param + ")$", "i"))
}, "Please enter a value with a valid extension.");
var v = $('#profilepic').validate({
rules:{
mypic:{
required:true,
extension: "jpg|jpeg|png",
filesize:true,
},
},
messages:{
mypic:{
required:"Please select an image file. If you dont't want a profile pic, please use the cancel button",
extension:"Image files with the following extensions are allowed - .jpg, .jpeg, .png",
filesize: "Maximum size of the image - 5 MB",
},
},
errorPlacement: function (error, element) {
element.each(function () {
$(this).next("div .error").html(error);
});
},
});
$('#editprofilepic').click(function(e){
e.preventDefault();
if($('#profilepic').valid()){
$.ajax({
url: 'edituser_pic',
method:'post',
cache: false,
processData:true, //Required
contentType: 'application/x-www-form-urlencoded',
data:{
'_token' :$('#csrf').val(),
'id' : $('#id').val(),
'mypic' : $('#mypic').val(),
},
success:function e(response){
console.log(response.path);
if(response.success== true){
Command: toastr["success"]("You will now be redirected..","Profile Picture updated.")
toastr.options = {
"closeButton": false,
"debug": false,
"newestOnTop": false,
"progressBar": true,
"positionClass": "toast-top-full-width",
"preventDuplicates": false,
"onclick": null,
"showDuration": "300",
"hideDuration": "1000",
"timeOut": "5000",
"extendedTimeOut": "1000",
"showEasing": "swing",
"hideEasing": "linear",
"showMethod": "fadeIn",
"hideMethod": "fadeOut",
}
setTimeout(function(){ location.replace('http://localhost/LaraTest/public/profile');},5500);
}else{
Command: toastr["warning"]("Some error","Please try later")
toastr.options = {
"closeButton": false,
"debug": false,
"newestOnTop": false,
"progressBar": true,
"positionClass": "toast-top-full-width",
"preventDuplicates": false,
"onclick": null,
"showDuration": "300",
"hideDuration": "1000",
"timeOut": "5000",
"extendedTimeOut": "1000",
"showEasing": "swing",
"hideEasing": "linear",
"showMethod": "fadeIn",
"hideMethod": "fadeOut",
}
noofsubmits = 0;
}
},
error:function es(response){
swal({
title:"Some error",
text:"Please try later",
icon:"warning",
button:true
});
}
}); //ajax ends
}
});
从您对@Syazany的最后一条评论来看，文件似乎没有通过ajax请求正确发送到控制器。你可以做这两件事中的任何一件。
选项1->
使用Submit按钮发布表单，并使用AjaxNOT。这应该将文件名、临时路径发送到控制器。如果使用此方法，请不要忘记在form标记中使用method="post"和action="somewhere.php"。
选项2->
使用以下FormData使用ajax-发送表单数据
var formData = new FormData(document.getElementById("profilepic"));
$.ajax({
url: 'edituser_pic',
method:'post',
cache: false,
processData:false, //Required
contentType: false, //Required
data:formData,
success: function(){
//do something for success
},
error: function(){
//do something for error
},
});
p.S-
processData:false, //Required
contentType: false, //Required
如果使用FormData