F
Filament•2mo ago
dangminhthang

Multiple images upload issue on mobile

What I did: I'm using Spatie Media File Upload to upload multiple images. My issue/the error: It works fine on PC, but when I use it on some phones and select about 14-20 images, each image ~2MB, the browser restarts itself. It works on some newer models (such as iPhone 15 Pro), but not on some older models such as iPhone 13, iPhone 11, etc. Code: 
SpatieMediaLibraryFileUpload::make($name)
            ->collection($collection)
            ->moveFiles()
            ->maxSize(10240) // in KB (10MB)
            ->openable()
            ->uploadProgressIndicatorPosition('left')
            ->maxParallelUploads(1)
            ->fetchFileInformation(false)
            ->multiple()
            ->appendFiles()
            ->reorderable()
            ->panelLayout('grid')
            ->imageEditor()
            ->imagePreviewHeight('250')
            ->imageEditorAspectRatios([null, '16:9', '4:3', '1:1'])
            ->imageResizeTargetWidth(1024)  // Reduce image width
            ->imageResizeTargetHeight(1024) // Reduce image height
            ->imageResizeMode('contain') // Keep aspect ratio
            ->imageResizeUpscale(false); // Do not upscale image to target width and height
SpatieMediaLibraryFileUpload::make($name)
            ->collection($collection)
            ->moveFiles()
            ->maxSize(10240) // in KB (10MB)
            ->openable()
            ->uploadProgressIndicatorPosition('left')
            ->maxParallelUploads(1)
            ->fetchFileInformation(false)
            ->multiple()
            ->appendFiles()
            ->reorderable()
            ->panelLayout('grid')
            ->imageEditor()
            ->imagePreviewHeight('250')
            ->imageEditorAspectRatios([null, '16:9', '4:3', '1:1'])
            ->imageResizeTargetWidth(1024)  // Reduce image width
            ->imageResizeTargetHeight(1024) // Reduce image height
            ->imageResizeMode('contain') // Keep aspect ratio
            ->imageResizeUpscale(false); // Do not upscale image to target width and height
1 Reply
dangminhthang
dangminhthangOP•4w ago
I think the key problem is that if I interact with the filepond during the upload process (say I've added 20 images and I've scrolled when 5 are done, or tried to reorder) - There are issues where it glitches waiting for some promise. Does anyone else experience the same?

Did you find this page helpful?