muuucho's avatar
Level 11

Upload file from mobile device

I try to upload images with the size of 16Mb taken from a mobile device but I keep getting the error file couldn't be uploaded. Why?

php.ini:

upload_max_filesize = 50M
post_max_size = 50M
max_input_time = 300
max_execution_time = 300

View (I am using a library to detect if the user is on a mobile or not)

<form action="{{ route('files.store') }}" method="post" enctype="multipart/form-data">
            @csrf
            <div class="mt-6 text-center">
                @mobile
                    <input type="file" name="file" accept="image/*" capture>
                @elsemobile
                    <input type="file" name="file">
                @endmobile
                @error('file.*') <span class="text-red-600">{{ $message }} </span>@enderror
                @error('file') <span class="text-red-600">{{ $message }} </span>@enderror
            </div>
            <button type="submit">Upload</button>
        </form>

Controller:

public function store(Request $request)
    {
        Log::info('hi from store method');
        $request->validate([
            'file' => 'required|mimes:pdf,jpeg,gif,png|max:65536', 
        Log::info('validation OK');
		...
}

I get the first Log message, but not the second.

0 likes
11 replies
LaryAI's avatar
Level 58

The issue you're experiencing is likely related to the file size limits set in your PHP configuration or the server configuration, despite your php.ini settings appearing to allow for larger uploads. Here are a few steps to troubleshoot and resolve the issue:

  1. Check PHP Configuration:

    • Ensure that the php.ini file you edited is the one being used by your server. You can verify this by creating a PHP file with phpinfo(); and checking the Loaded Configuration File path.
    • Double-check that upload_max_filesize and post_max_size are indeed set to 50M in the active php.ini.
  2. Check Web Server Configuration:

    • If you're using Apache, check the .htaccess file or the Apache configuration files for any php_value settings that might override php.ini.
    • If you're using Nginx, ensure that the client_max_body_size directive is set to a value larger than your file size (e.g., client_max_body_size 50M;).
  3. Check Laravel Configuration:

    • Ensure that your Laravel application is not imposing additional file size limits. Check config/filesystems.php and any middleware that might affect file uploads.
  4. Error Handling:

    • Since you're not seeing the second log message, the validation might be failing. Ensure that the file type and size are within the allowed limits specified in your validation rules.
    • Add error logging to capture any exceptions or validation errors:
    public function store(Request $request)
    {
        Log::info('hi from store method');
        try {
            $request->validate([
                'file' => 'required|mimes:pdf,jpeg,gif,png|max:65536', 
            ]);
            Log::info('validation OK');
            // Proceed with file storage logic
        } catch (\Exception $e) {
            Log::error('Validation or upload error: ' . $e->getMessage());
            return back()->withErrors(['file' => 'File upload failed.']);
        }
    }
    
  5. Check for Client-Side Issues:

    • Ensure that the mobile device is not causing issues with the file upload. Test with different devices or browsers to rule out client-side problems.

By following these steps, you should be able to identify and resolve the issue with uploading files from a mobile device. If the problem persists, consider checking server logs for more detailed error messages.

1 like
muuucho's avatar
Level 11

1 OK

2 Don't know, I am on a hosted server with Control Panel

3 OK

4 Getting the logged error File upload failed

5 Tried on Samsung A53 and Iphone12 Pro. Same error.

Can anyone see if something else might be wrong?

Snapey's avatar

you should not need to detect if user is mobile

set the image types you accept on the input element, or the mobile might try and upload HEIC images

1 like
muuucho's avatar
Level 11

@Snapey Sorry, I understand that you suggest to skip detection of mobile, but I don't get what you mean by of the mobile might try and upload HEIC images

muuucho's avatar
Level 11

@Snapey My idea is to accept pdf, jpeg ,gif, and png. The file from a mobile camera I guess is jpg.

muuucho's avatar
Level 11

@Snapey Also, In your link I find the following text:

accept="image/*" — Accept any file with an image/* MIME type. (Many mobile devices also let the user take a picture with the camera when this is used.)

So this doesn't seem to be the issue

Snapey's avatar

@muuucho but then you also validate that the image must be pdf,jpeg,gif,png so heic is not covered. This is the native image format for apple devices. However, if you say you accept jpg and png then the device will automatically convert the image before sending.

Have you tested image upload from the desktop with known large filesizes?

1 like
muuucho's avatar
Level 11

@Snapey When I try to upload a file of 32 Mb from my desktop, I get the error Oops! An Error Occurred The server returned a "413 Content Too Large". I have set the values in php.ini and also tried to add a .htaccess

php_value upload_max_filesize 64M
php_value post_max_size 64M
php_value max_execution_time 300
php_value max_input_time 300
Snapey's avatar
Snapey
Best Answer
Level 122

@muuucho create a route that runs phpinfo() to check the values are being used.

Also bear in mind that you have to allow some headroom for base64 encoding of files

1 like
muuucho's avatar
Level 11

@Snapey That showed me that the max fil size was only 2M. I found another place to change the file size, obviously the right place this time, I also changed the input to accept jpg according to your suggestion and everything works. Thanks Snapey, once again, you made my day!

Please or to participate in this conversation.