[Vuejs]-Input Image File in VueJs + SlimPHP

0đź‘Ť

âś…

Your ajax request contains the image data within a json encoded attribute “user_photo” in form of a Data URI scheme.

This is not a “classic” file upload, so this code won’t work like expected.

$uploadFiles = $request->getUploadedFiles();

Instead you may try to read the data URI from the json data.

$userPhoto = $request->getParam('user_photo');

Then try to decode the data URI string and save it as file.

$userPhoto = str_replace("\n", "", $userPhoto);
$userPhotoData = substr($userPhoto, strpos($userPhoto, ',') + 1);

// Decode the base64 string
$userPhotoData = base64_decode($userPhotoData);

// Save the file
file_put_contents('filename.jpg', $userPhotoData);

Notice: Never use echo in Slim. Use the response object instead.

$result = [
   'notice' => [
        'text' => 'User Added'
    ]
];

return $response->withJson($result);
👤odan

Leave a comment