upload canvas image to Laravel-CodePudding

I have a canvas image generated by some JS on my page that I'm trying to upload to my server using Laravel, my controller code:

        public function imageUploadAPI(Request $request)
{

    $imageName = time().'.'.$request->image->getClientOriginalName();  

    $request->image->move('/home/XXXXX/storage/app/public/images/'.$request->project_id.'/'.$request->report_id.'/', $imageName);

    return response()->json(['success'=>['You have successfully upload image.'],'image'=>[$request->project_id.'/'.$request->report_id.'/'.$imageName]]);

}

Im trying to send in as a blob but it did NOT work, any ideas? my code:

function uploadImage() {

var canvas = document.getElementById('snapshot');
canvas.toBlob((blob) => {
const newImg = document.createElement('img');
const url = URL.createObjectURL(blob);

newImg.onload = () => {
URL.revokeObjectURL(url);
};

var formdata  = new FormData($("#addForm")[0]);
formdata.append('image', url);
$.ajax({
    url : "/api/image-upload",
    type: "POST",
    data : formdata,
    processData: false,
    contentType: false,
    success:function(data){
        console.log(data.image);
    },
    error:console.log('Error'),
});
});

}

CodePudding user response：

One thing i know is laravel need file instance to upload image using laravel storage helpers so check if your upload is file instance or not. Here is a solution if your uploaded file is base64 and you want to change it to file instance How to convert base64 image to UploadedFile Laravel