From 59da7666b5773a9b7063185d7585ed664d351062 Mon Sep 17 00:00:00 2001 From: Dan Brown Date: Mon, 25 Sep 2023 13:48:23 +0100 Subject: [PATCH 01/11] Uploads: Added user-facing message for Laravel post limit handling Uploads over the post max size Would previously error without a clean user facing message. This catches that error to provide a user friendly message, compatible with our common error handling. Tested on image manager handling. Added test to cover. --- app/Exceptions/Handler.php | 7 ++++++- lang/en/errors.php | 1 + tests/ErrorTest.php | 13 +++++++++++++ 3 files changed, 20 insertions(+), 1 deletion(-) diff --git a/app/Exceptions/Handler.php b/app/Exceptions/Handler.php index 36bdf845d..385720643 100644 --- a/app/Exceptions/Handler.php +++ b/app/Exceptions/Handler.php @@ -6,6 +6,7 @@ use Exception; use Illuminate\Auth\AuthenticationException; use Illuminate\Database\Eloquent\ModelNotFoundException; use Illuminate\Foundation\Exceptions\Handler as ExceptionHandler; +use Illuminate\Http\Exceptions\PostTooLargeException; use Illuminate\Http\JsonResponse; use Illuminate\Http\Request; use Illuminate\Validation\ValidationException; @@ -59,6 +60,10 @@ class Handler extends ExceptionHandler */ public function render($request, Throwable $e) { + if ($e instanceof PostTooLargeException) { + $e = new NotifyException(trans('errors.server_post_limit'), '/', 413); + } + if ($this->isApiRequest($request)) { return $this->renderApiException($e); } @@ -71,7 +76,7 @@ class Handler extends ExceptionHandler */ protected function isApiRequest(Request $request): bool { - return strpos($request->path(), 'api/') === 0; + return str_starts_with($request->path(), 'api/'); } /** diff --git a/lang/en/errors.php b/lang/en/errors.php index 4cde4cea3..1f7404697 100644 --- a/lang/en/errors.php +++ b/lang/en/errors.php @@ -44,6 +44,7 @@ return [ 'cannot_get_image_from_url' => 'Cannot get image from :url', 'cannot_create_thumbs' => 'The server cannot create thumbnails. Please check you have the GD PHP extension installed.', 'server_upload_limit' => 'The server does not allow uploads of this size. Please try a smaller file size.', + 'server_post_limit' => 'The server cannot receive the provided amount of data. Try again with less data or a smaller file.', 'uploaded' => 'The server does not allow uploads of this size. Please try a smaller file size.', // Drawing & Images diff --git a/tests/ErrorTest.php b/tests/ErrorTest.php index 6ba01dd88..0d2ef808c 100644 --- a/tests/ErrorTest.php +++ b/tests/ErrorTest.php @@ -2,6 +2,7 @@ namespace Tests; +use Illuminate\Foundation\Http\Middleware\ValidatePostSize; use Illuminate\Support\Facades\Log; class ErrorTest extends TestCase @@ -45,4 +46,16 @@ class ErrorTest extends TestCase $resp->assertStatus(404); $resp->assertSeeText('Image Not Found'); } + + public function test_posts_above_php_limit_shows_friendly_error() + { + // Fake super large JSON request + $resp = $this->asEditor()->call('GET', '/books', [], [], [], [ + 'CONTENT_LENGTH' => '10000000000', + 'HTTP_ACCEPT' => 'application/json', + ]); + + $resp->assertStatus(413); + $resp->assertJson(['error' => 'The server cannot receive the provided amount of data. Try again with less data or a smaller file.']); + } } From cc0827ff28988021e170e8abf0674ee5bb71b3da Mon Sep 17 00:00:00 2001 From: Dan Brown Date: Fri, 29 Sep 2023 11:45:31 +0100 Subject: [PATCH 02/11] Images: Updated to create thumbnails at specific events --- .../Controllers/GalleryImageController.php | 2 ++ app/Uploads/Controllers/ImageController.php | 8 +++---- .../Controllers/ImageGalleryApiController.php | 2 +- app/Uploads/Image.php | 4 ++-- app/Uploads/ImageRepo.php | 21 ++++++++++--------- app/Uploads/ImageService.php | 13 +++++++----- 6 files changed, 27 insertions(+), 23 deletions(-) diff --git a/app/Uploads/Controllers/GalleryImageController.php b/app/Uploads/Controllers/GalleryImageController.php index 33d3dd74c..02e58faf5 100644 --- a/app/Uploads/Controllers/GalleryImageController.php +++ b/app/Uploads/Controllers/GalleryImageController.php @@ -6,6 +6,8 @@ use BookStack\Exceptions\ImageUploadException; use BookStack\Http\Controller; use BookStack\Uploads\ImageRepo; use Illuminate\Http\Request; +use Illuminate\Support\Facades\App; +use Illuminate\Support\Facades\Log; use Illuminate\Validation\ValidationException; class GalleryImageController extends Controller diff --git a/app/Uploads/Controllers/ImageController.php b/app/Uploads/Controllers/ImageController.php index 2c611c515..0f88b376e 100644 --- a/app/Uploads/Controllers/ImageController.php +++ b/app/Uploads/Controllers/ImageController.php @@ -44,7 +44,7 @@ class ImageController extends Controller */ public function update(Request $request, string $id) { - $this->validate($request, [ + $data = $this->validate($request, [ 'name' => ['required', 'min:2', 'string'], ]); @@ -52,9 +52,7 @@ class ImageController extends Controller $this->checkImagePermission($image); $this->checkOwnablePermission('image-update', $image); - $image = $this->imageRepo->updateImageDetails($image, $request->all()); - - $this->imageRepo->loadThumbs($image); + $image = $this->imageRepo->updateImageDetails($image, $data); return view('pages.parts.image-manager-form', [ 'image' => $image, @@ -99,7 +97,7 @@ class ImageController extends Controller $dependantPages = $this->imageRepo->getPagesUsingImage($image); } - $this->imageRepo->loadThumbs($image); + $this->imageRepo->loadThumbs($image, false); return view('pages.parts.image-manager-form', [ 'image' => $image, diff --git a/app/Uploads/Controllers/ImageGalleryApiController.php b/app/Uploads/Controllers/ImageGalleryApiController.php index 0d35d2905..efdff5be4 100644 --- a/app/Uploads/Controllers/ImageGalleryApiController.php +++ b/app/Uploads/Controllers/ImageGalleryApiController.php @@ -130,7 +130,7 @@ class ImageGalleryApiController extends ApiController */ protected function formatForSingleResponse(Image $image): array { - $this->imageRepo->loadThumbs($image); + $this->imageRepo->loadThumbs($image, false); $data = $image->toArray(); $data['created_by'] = $image->createdBy; $data['updated_by'] = $image->updatedBy; diff --git a/app/Uploads/Image.php b/app/Uploads/Image.php index 9f571693a..5291dac05 100644 --- a/app/Uploads/Image.php +++ b/app/Uploads/Image.php @@ -45,11 +45,11 @@ class Image extends Model } /** - * Get a thumbnail for this image. + * Get an (already existing) thumbnail for this image. * * @throws \Exception */ - public function getThumb(?int $width, ?int $height, bool $keepRatio = false): string + public function getThumb(?int $width, ?int $height, bool $keepRatio = false): ?string { return app()->make(ImageService::class)->getThumbnail($this, $width, $height, $keepRatio); } diff --git a/app/Uploads/ImageRepo.php b/app/Uploads/ImageRepo.php index 5507933f3..8a770da78 100644 --- a/app/Uploads/ImageRepo.php +++ b/app/Uploads/ImageRepo.php @@ -29,14 +29,14 @@ class ImageRepo * Execute a paginated query, returning in a standard format. * Also runs the query through the restriction system. */ - private function returnPaginated($query, $page = 1, $pageSize = 24): array + private function returnPaginated(Builder $query, int $page = 1, int $pageSize = 24): array { $images = $query->orderBy('created_at', 'desc')->skip($pageSize * ($page - 1))->take($pageSize + 1)->get(); $hasMore = count($images) > $pageSize; $returnImages = $images->take($pageSize); $returnImages->each(function (Image $image) { - $this->loadThumbs($image); + $this->loadThumbs($image, false); }); return [ @@ -119,7 +119,7 @@ class ImageRepo $image = $this->imageService->saveNewFromUpload($uploadFile, $type, $uploadedTo, $resizeWidth, $resizeHeight, $keepRatio); if ($type !== 'system') { - $this->loadThumbs($image); + $this->loadThumbs($image, true); } return $image; @@ -133,7 +133,7 @@ class ImageRepo public function saveNewFromData(string $imageName, string $imageData, string $type, int $uploadedTo = 0): Image { $image = $this->imageService->saveNew($imageName, $imageData, $type, $uploadedTo); - $this->loadThumbs($image); + $this->loadThumbs($image, true); return $image; } @@ -160,7 +160,7 @@ class ImageRepo $image->fill($updateDetails); $image->updated_by = user()->id; $image->save(); - $this->loadThumbs($image); + $this->loadThumbs($image, false); return $image; } @@ -179,6 +179,7 @@ class ImageRepo $image->updated_by = user()->id; $image->touch(); $image->save(); + $this->imageService->replaceExistingFromUpload($image->path, $image->type, $file); $this->loadThumbs($image, true); } @@ -215,11 +216,11 @@ class ImageRepo /** * Load thumbnails onto an image object. */ - public function loadThumbs(Image $image, bool $forceCreate = false): void + public function loadThumbs(Image $image, bool $shouldCreate): void { $image->setAttribute('thumbs', [ - 'gallery' => $this->getThumbnail($image, 150, 150, false, $forceCreate), - 'display' => $this->getThumbnail($image, 1680, null, true, $forceCreate), + 'gallery' => $this->getThumbnail($image, 150, 150, false, $shouldCreate), + 'display' => $this->getThumbnail($image, 1680, null, true, $shouldCreate), ]); } @@ -228,10 +229,10 @@ class ImageRepo * If $keepRatio is true only the width will be used. * Checks the cache then storage to avoid creating / accessing the filesystem on every check. */ - protected function getThumbnail(Image $image, ?int $width, ?int $height, bool $keepRatio, bool $forceCreate): ?string + protected function getThumbnail(Image $image, ?int $width, ?int $height, bool $keepRatio, bool $shouldCreate): ?string { try { - return $this->imageService->getThumbnail($image, $width, $height, $keepRatio, $forceCreate); + return $this->imageService->getThumbnail($image, $width, $height, $keepRatio, $shouldCreate); } catch (Exception $exception) { return null; } diff --git a/app/Uploads/ImageService.php b/app/Uploads/ImageService.php index 66596a57f..5db8defd3 100644 --- a/app/Uploads/ImageService.php +++ b/app/Uploads/ImageService.php @@ -259,7 +259,7 @@ class ImageService $initialHeader = substr($imageData, 0, strpos($imageData, 'IDAT')); - return strpos($initialHeader, 'acTL') !== false; + return str_contains($initialHeader, 'acTL'); } /** @@ -268,9 +268,8 @@ class ImageService * Checks the cache then storage to avoid creating / accessing the filesystem on every check. * * @throws Exception - * @throws InvalidArgumentException */ - public function getThumbnail(Image $image, ?int $width, ?int $height, bool $keepRatio = false, bool $forceCreate = false): string + public function getThumbnail(Image $image, ?int $width, ?int $height, bool $keepRatio = false, bool $shouldCreate = false): ?string { // Do not resize GIF images where we're not cropping if ($keepRatio && $this->isGif($image)) { @@ -285,13 +284,13 @@ class ImageService // Return path if in cache $cachedThumbPath = $this->cache->get($thumbCacheKey); - if ($cachedThumbPath && !$forceCreate) { + if ($cachedThumbPath && !$shouldCreate) { return $this->getPublicUrl($cachedThumbPath); } // If thumbnail has already been generated, serve that and cache path $storage = $this->getStorageDisk($image->type); - if (!$forceCreate && $storage->exists($this->adjustPathForStorageDisk($thumbFilePath, $image->type))) { + if (!$shouldCreate && $storage->exists($this->adjustPathForStorageDisk($thumbFilePath, $image->type))) { $this->cache->put($thumbCacheKey, $thumbFilePath, 60 * 60 * 72); return $this->getPublicUrl($thumbFilePath); @@ -306,6 +305,10 @@ class ImageService return $this->getPublicUrl($image->path); } + if (!$shouldCreate) { + return null; + } + // If not in cache and thumbnail does not exist, generate thumb and cache path $thumbData = $this->resizeImage($imageData, $width, $height, $keepRatio); $this->saveImageDataInPublicSpace($storage, $this->adjustPathForStorageDisk($thumbFilePath, $image->type), $thumbData); From 5af3041b9be351870cbe0c1eab82d7fa61fe0035 Mon Sep 17 00:00:00 2001 From: Dan Brown Date: Fri, 29 Sep 2023 13:54:08 +0100 Subject: [PATCH 03/11] Thumbnails: Added OOM handling and regen endpoint - Added some level of app out-of-memory handling so we can show a proper error message upon OOM events. - Added endpoint and image-manager button/action for regenerating thumbnails for an image so they can be re-created upon failure. --- app/Exceptions/Handler.php | 35 +++++++++++ app/Uploads/Controllers/ImageController.php | 19 ++++++ app/Util/OutOfMemoryHandler.php | 58 +++++++++++++++++++ lang/en/components.php | 2 + lang/en/errors.php | 1 + resources/js/components/image-manager.js | 19 ++++++ .../pages/parts/image-manager-form.blade.php | 3 + routes/web.php | 1 + 8 files changed, 138 insertions(+) create mode 100644 app/Util/OutOfMemoryHandler.php diff --git a/app/Exceptions/Handler.php b/app/Exceptions/Handler.php index 385720643..6a4420056 100644 --- a/app/Exceptions/Handler.php +++ b/app/Exceptions/Handler.php @@ -10,6 +10,7 @@ use Illuminate\Http\Exceptions\PostTooLargeException; use Illuminate\Http\JsonResponse; use Illuminate\Http\Request; use Illuminate\Validation\ValidationException; +use Symfony\Component\ErrorHandler\Error\FatalError; use Symfony\Component\HttpKernel\Exception\HttpExceptionInterface; use Throwable; @@ -36,6 +37,15 @@ class Handler extends ExceptionHandler 'password_confirmation', ]; + /** + * A function to run upon out of memory. + * If it returns a response, that will be provided back to the request + * upon an out of memory event. + * + * @var ?callable + */ + protected $onOutOfMemory = null; + /** * Report or log an exception. * @@ -60,6 +70,13 @@ class Handler extends ExceptionHandler */ public function render($request, Throwable $e) { + if ($e instanceof FatalError && str_contains($e->getMessage(), 'bytes exhausted (tried to allocate') && $this->onOutOfMemory) { + $response = call_user_func($this->onOutOfMemory); + if ($response) { + return $response; + } + } + if ($e instanceof PostTooLargeException) { $e = new NotifyException(trans('errors.server_post_limit'), '/', 413); } @@ -71,6 +88,24 @@ class Handler extends ExceptionHandler return parent::render($request, $e); } + /** + * Provide a function to be called when an out of memory event occurs. + * If the callable returns a response, this response will be returned + * to the request upon error. + */ + public function prepareForOutOfMemory(callable $onOutOfMemory) + { + $this->onOutOfMemory = $onOutOfMemory; + } + + /** + * Forget the current out of memory handler, if existing. + */ + public function forgetOutOfMemoryHandler() + { + $this->onOutOfMemory = null; + } + /** * Check if the given request is an API request. */ diff --git a/app/Uploads/Controllers/ImageController.php b/app/Uploads/Controllers/ImageController.php index 0f88b376e..edf1533fa 100644 --- a/app/Uploads/Controllers/ImageController.php +++ b/app/Uploads/Controllers/ImageController.php @@ -8,6 +8,7 @@ use BookStack\Http\Controller; use BookStack\Uploads\Image; use BookStack\Uploads\ImageRepo; use BookStack\Uploads\ImageService; +use BookStack\Util\OutOfMemoryHandler; use Exception; use Illuminate\Http\Request; use Illuminate\Validation\ValidationException; @@ -121,6 +122,24 @@ class ImageController extends Controller return response(''); } + /** + * Rebuild the thumbnails for the given image. + */ + public function rebuildThumbnails(string $id) + { + $image = $this->imageRepo->getById($id); + $this->checkImagePermission($image); + $this->checkOwnablePermission('image-update', $image); + + new OutOfMemoryHandler(function () { + return $this->jsonError(trans('errors.image_thumbnail_memory_limit')); + }); + + $this->imageRepo->loadThumbs($image, true); + + return response(trans('components.image_rebuild_thumbs_success')); + } + /** * Check related page permission and ensure type is drawio or gallery. */ diff --git a/app/Util/OutOfMemoryHandler.php b/app/Util/OutOfMemoryHandler.php new file mode 100644 index 000000000..88e9581f4 --- /dev/null +++ b/app/Util/OutOfMemoryHandler.php @@ -0,0 +1,58 @@ +onOutOfMemory = $onOutOfMemory; + + $this->memoryReserve = str_repeat('x', $memoryReserveMB * 1_000_000); + $this->getHandler()->prepareForOutOfMemory(function () { + return $this->handle(); + }); + } + + protected function handle(): mixed + { + $result = null; + $this->memoryReserve = ''; + + if ($this->onOutOfMemory) { + $result = call_user_func($this->onOutOfMemory); + $this->forget(); + } + + return $result; + } + + /** + * Forget the handler so no action is taken place on out of memory. + */ + public function forget(): void + { + $this->memoryReserve = ''; + $this->onOutOfMemory = null; + $this->getHandler()->forgetOutOfMemoryHandler(); + } + + protected function getHandler(): Handler + { + return app()->make(ExceptionHandler::class); + } +} diff --git a/lang/en/components.php b/lang/en/components.php index 8a105096b..c33b1d0b7 100644 --- a/lang/en/components.php +++ b/lang/en/components.php @@ -34,6 +34,8 @@ return [ 'image_delete_success' => 'Image successfully deleted', 'image_replace' => 'Replace Image', 'image_replace_success' => 'Image file successfully updated', + 'image_rebuild_thumbs' => 'Regenerate Size Variations', + 'image_rebuild_thumbs_success' => 'Image size variations successfully rebuilt!', // Code Editor 'code_editor' => 'Edit Code', diff --git a/lang/en/errors.php b/lang/en/errors.php index 1f7404697..4164d558b 100644 --- a/lang/en/errors.php +++ b/lang/en/errors.php @@ -51,6 +51,7 @@ return [ 'image_upload_error' => 'An error occurred uploading the image', 'image_upload_type_error' => 'The image type being uploaded is invalid', 'image_upload_replace_type' => 'Image file replacements must be of the same type', + 'image_thumbnail_memory_limit' => 'Failed to create image size variations due to system resource limits', 'drawing_data_not_found' => 'Drawing data could not be loaded. The drawing file might no longer exist or you may not have permission to access it.', // Attachments diff --git a/resources/js/components/image-manager.js b/resources/js/components/image-manager.js index 78abcf30d..bc0493a88 100644 --- a/resources/js/components/image-manager.js +++ b/resources/js/components/image-manager.js @@ -90,6 +90,15 @@ export class ImageManager extends Component { } }); + // Rebuild thumbs click + onChildEvent(this.formContainer, '#image-manager-rebuild-thumbs', 'click', async (_, button) => { + button.disabled = true; + if (this.lastSelected) { + await this.rebuildThumbnails(this.lastSelected.id); + } + button.disabled = false; + }); + // Edit form submit this.formContainer.addEventListener('ajax-form-success', () => { this.refreshGallery(); @@ -268,4 +277,14 @@ export class ImageManager extends Component { return this.loadMore.querySelector('button') && !this.loadMore.hasAttribute('hidden'); } + async rebuildThumbnails(imageId) { + try { + const response = await window.$http.put(`/images/${imageId}/rebuild-thumbnails`); + window.$events.success(response.data); + this.refreshGallery(); + } catch (err) { + window.$events.showResponseError(err); + } + } + } diff --git a/resources/views/pages/parts/image-manager-form.blade.php b/resources/views/pages/parts/image-manager-form.blade.php index 75750ef2f..3a73bee7c 100644 --- a/resources/views/pages/parts/image-manager-form.blade.php +++ b/resources/views/pages/parts/image-manager-form.blade.php @@ -44,6 +44,9 @@ id="image-manager-replace" refs="dropzone@select-button" class="text-item">{{ trans('components.image_replace') }} + @endif diff --git a/routes/web.php b/routes/web.php index c7fc92fc7..9f5e84c62 100644 --- a/routes/web.php +++ b/routes/web.php @@ -142,6 +142,7 @@ Route::middleware('auth')->group(function () { Route::post('/images/drawio', [UploadControllers\DrawioImageController::class, 'create']); Route::get('/images/edit/{id}', [UploadControllers\ImageController::class, 'edit']); Route::put('/images/{id}/file', [UploadControllers\ImageController::class, 'updateFile']); + Route::put('/images/{id}/rebuild-thumbnails', [UploadControllers\ImageController::class, 'rebuildThumbnails']); Route::put('/images/{id}', [UploadControllers\ImageController::class, 'update']); Route::delete('/images/{id}', [UploadControllers\ImageController::class, 'destroy']); From 5c318a45b8afd11f6454f4a558a9616786c1a467 Mon Sep 17 00:00:00 2001 From: Dan Brown Date: Sat, 30 Sep 2023 12:09:29 +0100 Subject: [PATCH 04/11] Images: Reverted some thumbnails to be on-demand generated Added since we can't always be sure of future image usage, and in many cases we don't generate ahead-of-time. Also: - Simplified image handling on certain models. - Updated various string handling operations to use newer functions. --- app/Entities/Models/Book.php | 15 +++-------- app/Entities/Models/Bookshelf.php | 20 +++++--------- app/Uploads/Image.php | 5 ++-- app/Uploads/ImageService.php | 45 ++++++++++++++++--------------- app/Users/Models/User.php | 2 +- 5 files changed, 38 insertions(+), 49 deletions(-) diff --git a/app/Entities/Models/Book.php b/app/Entities/Models/Book.php index fc4556857..f54a0bf2d 100644 --- a/app/Entities/Models/Book.php +++ b/app/Entities/Models/Book.php @@ -40,26 +40,19 @@ class Book extends Entity implements HasCoverImage /** * Returns book cover image, if book cover not exists return default cover image. - * - * @param int $width - Width of the image - * @param int $height - Height of the image - * - * @return string */ - public function getBookCover($width = 440, $height = 250) + public function getBookCover(int $width = 440, int $height = 250): string { $default = 'data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw=='; - if (!$this->image_id) { + if (!$this->image_id || !$this->cover) { return $default; } try { - $cover = $this->cover ? url($this->cover->getThumb($width, $height, false)) : $default; + return $this->cover->getThumb($width, $height, false) ?? $default; } catch (Exception $err) { - $cover = $default; + return $default; } - - return $cover; } /** diff --git a/app/Entities/Models/Bookshelf.php b/app/Entities/Models/Bookshelf.php index ad52d9d37..4b44025a4 100644 --- a/app/Entities/Models/Bookshelf.php +++ b/app/Entities/Models/Bookshelf.php @@ -3,6 +3,7 @@ namespace BookStack\Entities\Models; use BookStack\Uploads\Image; +use Exception; use Illuminate\Database\Eloquent\Factories\HasFactory; use Illuminate\Database\Eloquent\Relations\BelongsTo; use Illuminate\Database\Eloquent\Relations\BelongsToMany; @@ -49,28 +50,21 @@ class Bookshelf extends Entity implements HasCoverImage } /** - * Returns BookShelf cover image, if cover does not exists return default cover image. - * - * @param int $width - Width of the image - * @param int $height - Height of the image - * - * @return string + * Returns shelf cover image, if cover not exists return default cover image. */ - public function getBookCover($width = 440, $height = 250) + public function getBookCover(int $width = 440, int $height = 250): string { // TODO - Make generic, focused on books right now, Perhaps set-up a better image $default = 'data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw=='; - if (!$this->image_id) { + if (!$this->image_id || !$this->cover) { return $default; } try { - $cover = $this->cover ? url($this->cover->getThumb($width, $height, false)) : $default; - } catch (\Exception $err) { - $cover = $default; + return $this->cover->getThumb($width, $height, false) ?? $default; + } catch (Exception $err) { + return $default; } - - return $cover; } /** diff --git a/app/Uploads/Image.php b/app/Uploads/Image.php index 5291dac05..5e197e750 100644 --- a/app/Uploads/Image.php +++ b/app/Uploads/Image.php @@ -45,13 +45,14 @@ class Image extends Model } /** - * Get an (already existing) thumbnail for this image. + * Get a thumbnail URL for this image. + * Attempts to generate the thumbnail if not already existing. * * @throws \Exception */ public function getThumb(?int $width, ?int $height, bool $keepRatio = false): ?string { - return app()->make(ImageService::class)->getThumbnail($this, $width, $height, $keepRatio); + return app()->make(ImageService::class)->getThumbnail($this, $width, $height, $keepRatio, false, true); } /** diff --git a/app/Uploads/ImageService.php b/app/Uploads/ImageService.php index 5db8defd3..c7e4aefad 100644 --- a/app/Uploads/ImageService.php +++ b/app/Uploads/ImageService.php @@ -21,23 +21,18 @@ use Intervention\Image\Exception\NotSupportedException; use Intervention\Image\Image as InterventionImage; use Intervention\Image\ImageManager; use League\Flysystem\WhitespacePathNormalizer; -use Psr\SimpleCache\InvalidArgumentException; use Symfony\Component\HttpFoundation\File\UploadedFile; use Symfony\Component\HttpFoundation\StreamedResponse; class ImageService { - protected ImageManager $imageTool; - protected Cache $cache; - protected FilesystemManager $fileSystem; - protected static array $supportedExtensions = ['jpg', 'jpeg', 'png', 'gif', 'webp']; - public function __construct(ImageManager $imageTool, FilesystemManager $fileSystem, Cache $cache) - { - $this->imageTool = $imageTool; - $this->fileSystem = $fileSystem; - $this->cache = $cache; + public function __construct( + protected ImageManager $imageTool, + protected FilesystemManager $fileSystem, + protected Cache $cache + ) { } /** @@ -206,7 +201,7 @@ class ImageService * Save image data for the given path in the public space, if possible, * for the provided storage mechanism. */ - protected function saveImageDataInPublicSpace(Storage $storage, string $path, string $data) + protected function saveImageDataInPublicSpace(Storage $storage, string $path, string $data): void { $storage->put($path, $data); @@ -269,8 +264,14 @@ class ImageService * * @throws Exception */ - public function getThumbnail(Image $image, ?int $width, ?int $height, bool $keepRatio = false, bool $shouldCreate = false): ?string - { + public function getThumbnail( + Image $image, + ?int $width, + ?int $height, + bool $keepRatio = false, + bool $shouldCreate = false, + bool $canCreate = false, + ): ?string { // Do not resize GIF images where we're not cropping if ($keepRatio && $this->isGif($image)) { return $this->getPublicUrl($image->path); @@ -305,7 +306,7 @@ class ImageService return $this->getPublicUrl($image->path); } - if (!$shouldCreate) { + if (!$shouldCreate && !$canCreate) { return null; } @@ -559,7 +560,7 @@ class ImageService // Check the image file exists && $disk->exists($imagePath) // Check the file is likely an image file - && strpos($disk->mimeType($imagePath), 'image/') === 0; + && str_starts_with($disk->mimeType($imagePath), 'image/'); } /** @@ -568,14 +569,14 @@ class ImageService */ protected function checkUserHasAccessToRelationOfImageAtPath(string $path): bool { - if (strpos($path, '/uploads/images/') === 0) { + if (str_starts_with($path, '/uploads/images/')) { $path = substr($path, 15); } // Strip thumbnail element from path if existing $originalPathSplit = array_filter(explode('/', $path), function (string $part) { - $resizedDir = (strpos($part, 'thumbs-') === 0 || strpos($part, 'scaled-') === 0); - $missingExtension = strpos($part, '.') === false; + $resizedDir = (str_starts_with($part, 'thumbs-') || str_starts_with($part, 'scaled-')); + $missingExtension = !str_contains($part, '.'); return !($resizedDir && $missingExtension); }); @@ -641,9 +642,9 @@ class ImageService $url = ltrim(trim($url), '/'); // Handle potential relative paths - $isRelative = strpos($url, 'http') !== 0; + $isRelative = !str_starts_with($url, 'http'); if ($isRelative) { - if (strpos(strtolower($url), 'uploads/images') === 0) { + if (str_starts_with(strtolower($url), 'uploads/images')) { return trim($url, '/'); } @@ -658,7 +659,7 @@ class ImageService foreach ($potentialHostPaths as $potentialBasePath) { $potentialBasePath = strtolower($potentialBasePath); - if (strpos(strtolower($url), $potentialBasePath) === 0) { + if (str_starts_with(strtolower($url), $potentialBasePath)) { return 'uploads/images/' . trim(substr($url, strlen($potentialBasePath)), '/'); } } @@ -679,7 +680,7 @@ class ImageService // region-based url will be used to prevent http issues. if (!$storageUrl && config('filesystems.images') === 's3') { $storageDetails = config('filesystems.disks.s3'); - if (strpos($storageDetails['bucket'], '.') === false) { + if (!str_contains($storageDetails['bucket'], '.')) { $storageUrl = 'https://' . $storageDetails['bucket'] . '.s3.amazonaws.com'; } else { $storageUrl = 'https://s3-' . $storageDetails['region'] . '.amazonaws.com/' . $storageDetails['bucket']; diff --git a/app/Users/Models/User.php b/app/Users/Models/User.php index 39236c7e4..5bd308ae8 100644 --- a/app/Users/Models/User.php +++ b/app/Users/Models/User.php @@ -244,7 +244,7 @@ class User extends Model implements AuthenticatableContract, CanResetPasswordCon } try { - $avatar = $this->avatar ? url($this->avatar->getThumb($size, $size, false)) : $default; + $avatar = $this->avatar?->getThumb($size, $size, false) ?? $default; } catch (Exception $err) { $avatar = $default; } From 97274a81401bc17ae3e79e77c7475f25a3193412 Mon Sep 17 00:00:00 2001 From: Dan Brown Date: Sat, 30 Sep 2023 12:29:49 +0100 Subject: [PATCH 05/11] Images: Added test to cover thubmnail regen endpoint --- tests/Helpers/FileProvider.php | 11 ++++++++++- tests/Uploads/ImageTest.php | 23 +++++++++++++++++++++++ 2 files changed, 33 insertions(+), 1 deletion(-) diff --git a/tests/Helpers/FileProvider.php b/tests/Helpers/FileProvider.php index 9e44697c7..99ee11efb 100644 --- a/tests/Helpers/FileProvider.php +++ b/tests/Helpers/FileProvider.php @@ -133,12 +133,21 @@ class FileProvider */ public function deleteAtRelativePath(string $path): void { - $fullPath = public_path($path); + $fullPath = $this->relativeToFullPath($path); if (file_exists($fullPath)) { unlink($fullPath); } } + /** + * Convert a relative path used by default in this provider to a full + * absolute local filesystem path. + */ + public function relativeToFullPath(string $path): string + { + return public_path($path); + } + /** * Delete all uploaded files. * To assist with cleanup. diff --git a/tests/Uploads/ImageTest.php b/tests/Uploads/ImageTest.php index a9684eef7..9943302d3 100644 --- a/tests/Uploads/ImageTest.php +++ b/tests/Uploads/ImageTest.php @@ -552,6 +552,29 @@ class ImageTest extends TestCase $this->files->deleteAtRelativePath($relPath); } + public function test_image_manager_regen_thumbnails() + { + $this->asEditor(); + $imageName = 'first-image.png'; + $relPath = $this->files->expectedImagePath('gallery', $imageName); + + $this->files->uploadGalleryImage($this, $imageName, $this->entities->page()->id); + $image = Image::first(); + + $resp = $this->get("/images/edit/{$image->id}"); + $this->withHtml($resp)->assertElementExists('button#image-manager-rebuild-thumbs'); + + $expectedThumbPath = dirname($relPath) . '/scaled-1680-/' . basename($relPath); + $this->files->deleteAtRelativePath($expectedThumbPath); + $this->assertFileDoesNotExist($this->files->relativeToFullPath($expectedThumbPath)); + + $resp = $this->put("/images/{$image->id}/rebuild-thumbnails"); + $resp->assertOk(); + + $this->assertFileExists($this->files->relativeToFullPath($expectedThumbPath)); + $this->files->deleteAtRelativePath($relPath); + } + protected function getTestProfileImage() { $imageName = 'profile.png'; From 40721433f721bf9233a57e5072493dba16c3552a Mon Sep 17 00:00:00 2001 From: Dan Brown Date: Sat, 30 Sep 2023 12:43:51 +0100 Subject: [PATCH 06/11] Image manager: Tweaked grid sizing to prevent massive items --- resources/sass/_components.scss | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/resources/sass/_components.scss b/resources/sass/_components.scss index c66a432bf..c1989c1f6 100644 --- a/resources/sass/_components.scss +++ b/resources/sass/_components.scss @@ -382,7 +382,7 @@ body.flexbox-support #entity-selector-wrap .popup-body .form-group { .image-manager-list { padding: 3px; display: grid; - grid-template-columns: repeat( auto-fit, minmax(140px, 1fr) ); + grid-template-columns: repeat( auto-fill, minmax(max(140px, 17%), 1fr) ); gap: 3px; z-index: 3; > div { From 7247e31936ebf630b28be5870a5760be920b0d90 Mon Sep 17 00:00:00 2001 From: Dan Brown Date: Sat, 30 Sep 2023 18:28:42 +0100 Subject: [PATCH 07/11] Images: Started refactor of image service To break it up. Also added better memory handling to other parts of the app. --- app/Entities/Tools/ExportFormatter.php | 2 +- .../Controllers/DrawioImageController.php | 8 +- .../Controllers/GalleryImageController.php | 5 + app/Uploads/Controllers/ImageController.php | 8 +- app/Uploads/ImageResizer.php | 95 ++++++ app/Uploads/ImageService.php | 299 +++--------------- app/Uploads/ImageStorage.php | 183 +++++++++++ lang/en/errors.php | 1 + 8 files changed, 340 insertions(+), 261 deletions(-) create mode 100644 app/Uploads/ImageResizer.php create mode 100644 app/Uploads/ImageStorage.php diff --git a/app/Entities/Tools/ExportFormatter.php b/app/Entities/Tools/ExportFormatter.php index 80b039b80..9a8c687b0 100644 --- a/app/Entities/Tools/ExportFormatter.php +++ b/app/Entities/Tools/ExportFormatter.php @@ -222,7 +222,7 @@ class ExportFormatter foreach ($imageTagsOutput[0] as $index => $imgMatch) { $oldImgTagString = $imgMatch; $srcString = $imageTagsOutput[2][$index]; - $imageEncoded = $this->imageService->imageUriToBase64($srcString); + $imageEncoded = $this->imageService->imageUrlToBase64($srcString); if ($imageEncoded === null) { $imageEncoded = $srcString; } diff --git a/app/Uploads/Controllers/DrawioImageController.php b/app/Uploads/Controllers/DrawioImageController.php index 35deada88..49f0c1655 100644 --- a/app/Uploads/Controllers/DrawioImageController.php +++ b/app/Uploads/Controllers/DrawioImageController.php @@ -10,11 +10,9 @@ use Illuminate\Http\Request; class DrawioImageController extends Controller { - protected $imageRepo; - - public function __construct(ImageRepo $imageRepo) - { - $this->imageRepo = $imageRepo; + public function __construct( + protected ImageRepo $imageRepo + ) { } /** diff --git a/app/Uploads/Controllers/GalleryImageController.php b/app/Uploads/Controllers/GalleryImageController.php index 02e58faf5..0696ca62b 100644 --- a/app/Uploads/Controllers/GalleryImageController.php +++ b/app/Uploads/Controllers/GalleryImageController.php @@ -5,6 +5,7 @@ namespace BookStack\Uploads\Controllers; use BookStack\Exceptions\ImageUploadException; use BookStack\Http\Controller; use BookStack\Uploads\ImageRepo; +use BookStack\Util\OutOfMemoryHandler; use Illuminate\Http\Request; use Illuminate\Support\Facades\App; use Illuminate\Support\Facades\Log; @@ -53,6 +54,10 @@ class GalleryImageController extends Controller return $this->jsonError(implode("\n", $exception->errors()['file'])); } + new OutOfMemoryHandler(function () { + return $this->jsonError(trans('errors.image_upload_memory_limit')); + }); + try { $imageUpload = $request->file('file'); $uploadedTo = $request->get('uploaded_to', 0); diff --git a/app/Uploads/Controllers/ImageController.php b/app/Uploads/Controllers/ImageController.php index edf1533fa..f92338bc8 100644 --- a/app/Uploads/Controllers/ImageController.php +++ b/app/Uploads/Controllers/ImageController.php @@ -11,7 +11,6 @@ use BookStack\Uploads\ImageService; use BookStack\Util\OutOfMemoryHandler; use Exception; use Illuminate\Http\Request; -use Illuminate\Validation\ValidationException; class ImageController extends Controller { @@ -39,9 +38,6 @@ class ImageController extends Controller /** * Update image details. - * - * @throws ImageUploadException - * @throws ValidationException */ public function update(Request $request, string $id) { @@ -75,6 +71,10 @@ class ImageController extends Controller $this->checkOwnablePermission('image-update', $image); $file = $request->file('file'); + new OutOfMemoryHandler(function () { + return $this->jsonError(trans('errors.image_upload_memory_limit')); + }); + try { $this->imageRepo->updateImageFile($image, $file); } catch (ImageUploadException $exception) { diff --git a/app/Uploads/ImageResizer.php b/app/Uploads/ImageResizer.php new file mode 100644 index 000000000..7a89b9d35 --- /dev/null +++ b/app/Uploads/ImageResizer.php @@ -0,0 +1,95 @@ +intervention->make($imageData); + } catch (NotSupportedException $e) { + throw new ImageUploadException(trans('errors.cannot_create_thumbs')); + } + + $this->orientImageToOriginalExif($thumb, $imageData); + + if ($keepRatio) { + $thumb->resize($width, $height, function ($constraint) { + $constraint->aspectRatio(); + $constraint->upsize(); + }); + } else { + $thumb->fit($width, $height); + } + + $thumbData = (string) $thumb->encode(); + + // Use original image data if we're keeping the ratio + // and the resizing does not save any space. + if ($keepRatio && strlen($thumbData) > strlen($imageData)) { + return $imageData; + } + + return $thumbData; + } + + /** + * Orientate the given intervention image based upon the given original image data. + * Intervention does have an `orientate` method but the exif data it needs is lost before it + * can be used (At least when created using binary string data) so we need to do some + * implementation on our side to use the original image data. + * Bulk of logic taken from: https://github.com/Intervention/image/blob/b734a4988b2148e7d10364b0609978a88d277536/src/Intervention/Image/Commands/OrientateCommand.php + * Copyright (c) Oliver Vogel, MIT License. + */ + protected function orientImageToOriginalExif(InterventionImage $image, string $originalData): void + { + if (!extension_loaded('exif')) { + return; + } + + $stream = Utils::streamFor($originalData)->detach(); + $exif = @exif_read_data($stream); + $orientation = $exif ? ($exif['Orientation'] ?? null) : null; + + switch ($orientation) { + case 2: + $image->flip(); + break; + case 3: + $image->rotate(180); + break; + case 4: + $image->rotate(180)->flip(); + break; + case 5: + $image->rotate(270)->flip(); + break; + case 6: + $image->rotate(270); + break; + case 7: + $image->rotate(90)->flip(); + break; + case 8: + $image->rotate(90); + break; + } + } +} diff --git a/app/Uploads/ImageService.php b/app/Uploads/ImageService.php index c7e4aefad..81d6add92 100644 --- a/app/Uploads/ImageService.php +++ b/app/Uploads/ImageService.php @@ -8,19 +8,16 @@ use BookStack\Entities\Models\Page; use BookStack\Exceptions\ImageUploadException; use ErrorException; use Exception; -use GuzzleHttp\Psr7\Utils; use Illuminate\Contracts\Cache\Repository as Cache; use Illuminate\Contracts\Filesystem\FileNotFoundException; -use Illuminate\Contracts\Filesystem\Filesystem as Storage; +use Illuminate\Contracts\Filesystem\Filesystem as StorageDisk; use Illuminate\Filesystem\FilesystemAdapter; use Illuminate\Filesystem\FilesystemManager; use Illuminate\Support\Facades\DB; use Illuminate\Support\Facades\Log; use Illuminate\Support\Str; use Intervention\Image\Exception\NotSupportedException; -use Intervention\Image\Image as InterventionImage; use Intervention\Image\ImageManager; -use League\Flysystem\WhitespacePathNormalizer; use Symfony\Component\HttpFoundation\File\UploadedFile; use Symfony\Component\HttpFoundation\StreamedResponse; @@ -31,79 +28,15 @@ class ImageService public function __construct( protected ImageManager $imageTool, protected FilesystemManager $fileSystem, - protected Cache $cache + protected Cache $cache, + protected ImageStorage $storage, ) { } - /** - * Get the storage that will be used for storing images. - */ - protected function getStorageDisk(string $imageType = ''): Storage - { - return $this->fileSystem->disk($this->getStorageDiskName($imageType)); - } - - /** - * Check if local secure image storage (Fetched behind authentication) - * is currently active in the instance. - */ - protected function usingSecureImages(string $imageType = 'gallery'): bool - { - return $this->getStorageDiskName($imageType) === 'local_secure_images'; - } - - /** - * Check if "local secure restricted" (Fetched behind auth, with permissions enforced) - * is currently active in the instance. - */ - protected function usingSecureRestrictedImages() - { - return config('filesystems.images') === 'local_secure_restricted'; - } - - /** - * Change the originally provided path to fit any disk-specific requirements. - * This also ensures the path is kept to the expected root folders. - */ - protected function adjustPathForStorageDisk(string $path, string $imageType = ''): string - { - $path = (new WhitespacePathNormalizer())->normalizePath(str_replace('uploads/images/', '', $path)); - - if ($this->usingSecureImages($imageType)) { - return $path; - } - - return 'uploads/images/' . $path; - } - - /** - * Get the name of the storage disk to use. - */ - protected function getStorageDiskName(string $imageType): string - { - $storageType = config('filesystems.images'); - $localSecureInUse = ($storageType === 'local_secure' || $storageType === 'local_secure_restricted'); - - // Ensure system images (App logo) are uploaded to a public space - if ($imageType === 'system' && $localSecureInUse) { - return 'local'; - } - - // Rename local_secure options to get our image specific storage driver which - // is scoped to the relevant image directories. - if ($localSecureInUse) { - return 'local_secure_images'; - } - - return $storageType; - } - /** * Saves a new image from an upload. * * @throws ImageUploadException - * - * @return mixed */ public function saveNewFromUpload( UploadedFile $uploadedFile, @@ -112,7 +45,7 @@ class ImageService int $resizeWidth = null, int $resizeHeight = null, bool $keepRatio = true - ) { + ): Image { $imageName = $uploadedFile->getClientOriginalName(); $imageData = file_get_contents($uploadedFile->getRealPath()); @@ -146,13 +79,13 @@ class ImageService */ public function saveNew(string $imageName, string $imageData, string $type, int $uploadedTo = 0): Image { - $storage = $this->getStorageDisk($type); + $disk = $this->storage->getDisk($type); $secureUploads = setting('app-secure-images'); - $fileName = $this->cleanImageFileName($imageName); + $fileName = $this->storage->cleanImageFileName($imageName); $imagePath = '/uploads/images/' . $type . '/' . date('Y-m') . '/'; - while ($storage->exists($this->adjustPathForStorageDisk($imagePath . $fileName, $type))) { + while ($disk->exists($this->storage->adjustPathForDisk($imagePath . $fileName, $type))) { $fileName = Str::random(3) . $fileName; } @@ -162,7 +95,7 @@ class ImageService } try { - $this->saveImageDataInPublicSpace($storage, $this->adjustPathForStorageDisk($fullPath, $type), $imageData); + $this->storage->storeInPublicSpace($disk, $this->storage->adjustPathForDisk($fullPath, $type), $imageData); } catch (Exception $e) { Log::error('Error when attempting image upload:' . $e->getMessage()); @@ -172,7 +105,7 @@ class ImageService $imageDetails = [ 'name' => $imageName, 'path' => $fullPath, - 'url' => $this->getPublicUrl($fullPath), + 'url' => $this->storage->getPublicUrl($fullPath), 'type' => $type, 'uploaded_to' => $uploadedTo, ]; @@ -189,50 +122,17 @@ class ImageService return $image; } + /** + * Replace an existing image file in the system using the given file. + */ public function replaceExistingFromUpload(string $path, string $type, UploadedFile $file): void { $imageData = file_get_contents($file->getRealPath()); - $storage = $this->getStorageDisk($type); - $adjustedPath = $this->adjustPathForStorageDisk($path, $type); - $storage->put($adjustedPath, $imageData); + $disk = $this->storage->getDisk($type); + $adjustedPath = $this->storage->adjustPathForDisk($path, $type); + $disk->put($adjustedPath, $imageData); } - /** - * Save image data for the given path in the public space, if possible, - * for the provided storage mechanism. - */ - protected function saveImageDataInPublicSpace(Storage $storage, string $path, string $data): void - { - $storage->put($path, $data); - - // Set visibility when a non-AWS-s3, s3-like storage option is in use. - // Done since this call can break s3-like services but desired for other image stores. - // Attempting to set ACL during above put request requires different permissions - // hence would technically be a breaking change for actual s3 usage. - $usingS3 = strtolower(config('filesystems.images')) === 's3'; - $usingS3Like = $usingS3 && !is_null(config('filesystems.disks.s3.endpoint')); - if (!$usingS3Like) { - $storage->setVisibility($path, 'public'); - } - } - - /** - * Clean up an image file name to be both URL and storage safe. - */ - protected function cleanImageFileName(string $name): string - { - $name = str_replace(' ', '-', $name); - $nameParts = explode('.', $name); - $extension = array_pop($nameParts); - $name = implode('-', $nameParts); - $name = Str::slug($name); - - if (strlen($name) === 0) { - $name = Str::random(10); - } - - return $name . '.' . $extension; - } /** * Checks if the image is a gif. Returns true if it is, else false. @@ -274,7 +174,7 @@ class ImageService ): ?string { // Do not resize GIF images where we're not cropping if ($keepRatio && $this->isGif($image)) { - return $this->getPublicUrl($image->path); + return $this->storage->getPublicUrl($image->path); } $thumbDirName = '/' . ($keepRatio ? 'scaled-' : 'thumbs-') . $width . '-' . $height . '/'; @@ -286,24 +186,24 @@ class ImageService // Return path if in cache $cachedThumbPath = $this->cache->get($thumbCacheKey); if ($cachedThumbPath && !$shouldCreate) { - return $this->getPublicUrl($cachedThumbPath); + return $this->storage->getPublicUrl($cachedThumbPath); } // If thumbnail has already been generated, serve that and cache path - $storage = $this->getStorageDisk($image->type); - if (!$shouldCreate && $storage->exists($this->adjustPathForStorageDisk($thumbFilePath, $image->type))) { + $disk = $this->storage->getDisk($image->type); + if (!$shouldCreate && $disk->exists($this->storage->adjustPathForDisk($thumbFilePath, $image->type))) { $this->cache->put($thumbCacheKey, $thumbFilePath, 60 * 60 * 72); - return $this->getPublicUrl($thumbFilePath); + return $this->storage->getPublicUrl($thumbFilePath); } - $imageData = $storage->get($this->adjustPathForStorageDisk($imagePath, $image->type)); + $imageData = $disk->get($this->storage->adjustPathForDisk($imagePath, $image->type)); // Do not resize apng images where we're not cropping if ($keepRatio && $this->isApngData($image, $imageData)) { $this->cache->put($thumbCacheKey, $image->path, 60 * 60 * 72); - return $this->getPublicUrl($image->path); + return $this->storage->getPublicUrl($image->path); } if (!$shouldCreate && !$canCreate) { @@ -312,10 +212,10 @@ class ImageService // If not in cache and thumbnail does not exist, generate thumb and cache path $thumbData = $this->resizeImage($imageData, $width, $height, $keepRatio); - $this->saveImageDataInPublicSpace($storage, $this->adjustPathForStorageDisk($thumbFilePath, $image->type), $thumbData); + $this->storage->storeInPublicSpace($disk, $this->storage->adjustPathForDisk($thumbFilePath, $image->type), $thumbData); $this->cache->put($thumbCacheKey, $thumbFilePath, 60 * 60 * 72); - return $this->getPublicUrl($thumbFilePath); + return $this->storage->getPublicUrl($thumbFilePath); } /** @@ -353,59 +253,17 @@ class ImageService return $thumbData; } - /** - * Orientate the given intervention image based upon the given original image data. - * Intervention does have an `orientate` method but the exif data it needs is lost before it - * can be used (At least when created using binary string data) so we need to do some - * implementation on our side to use the original image data. - * Bulk of logic taken from: https://github.com/Intervention/image/blob/b734a4988b2148e7d10364b0609978a88d277536/src/Intervention/Image/Commands/OrientateCommand.php - * Copyright (c) Oliver Vogel, MIT License. - */ - protected function orientImageToOriginalExif(InterventionImage $image, string $originalData): void - { - if (!extension_loaded('exif')) { - return; - } - - $stream = Utils::streamFor($originalData)->detach(); - $exif = @exif_read_data($stream); - $orientation = $exif ? ($exif['Orientation'] ?? null) : null; - - switch ($orientation) { - case 2: - $image->flip(); - break; - case 3: - $image->rotate(180); - break; - case 4: - $image->rotate(180)->flip(); - break; - case 5: - $image->rotate(270)->flip(); - break; - case 6: - $image->rotate(270); - break; - case 7: - $image->rotate(90)->flip(); - break; - case 8: - $image->rotate(90); - break; - } - } /** * Get the raw data content from an image. * - * @throws FileNotFoundException + * @throws Exception */ public function getImageData(Image $image): string { - $storage = $this->getStorageDisk(); + $disk = $this->storage->getDisk(); - return $storage->get($this->adjustPathForStorageDisk($image->path, $image->type)); + return $disk->get($this->storage->adjustPathForDisk($image->path, $image->type)); } /** @@ -425,24 +283,24 @@ class ImageService */ protected function destroyImagesFromPath(string $path, string $imageType): bool { - $path = $this->adjustPathForStorageDisk($path, $imageType); - $storage = $this->getStorageDisk($imageType); + $path = $this->storage->adjustPathForDisk($path, $imageType); + $disk = $this->storage->getDisk($imageType); $imageFolder = dirname($path); $imageFileName = basename($path); - $allImages = collect($storage->allFiles($imageFolder)); + $allImages = collect($disk->allFiles($imageFolder)); // Delete image files $imagesToDelete = $allImages->filter(function ($imagePath) use ($imageFileName) { return basename($imagePath) === $imageFileName; }); - $storage->delete($imagesToDelete->all()); + $disk->delete($imagesToDelete->all()); // Cleanup of empty folders - $foldersInvolved = array_merge([$imageFolder], $storage->directories($imageFolder)); + $foldersInvolved = array_merge([$imageFolder], $disk->directories($imageFolder)); foreach ($foldersInvolved as $directory) { - if ($this->isFolderEmpty($storage, $directory)) { - $storage->deleteDirectory($directory); + if ($this->isFolderEmpty($disk, $directory)) { + $disk->deleteDirectory($directory); } } @@ -452,7 +310,7 @@ class ImageService /** * Check whether a folder is empty. */ - protected function isFolderEmpty(Storage $storage, string $path): bool + protected function isFolderEmpty(StorageDisk $storage, string $path): bool { $files = $storage->files($path); $folders = $storage->directories($path); @@ -506,33 +364,33 @@ class ImageService * * @throws FileNotFoundException */ - public function imageUriToBase64(string $uri): ?string + public function imageUrlToBase64(string $url): ?string { - $storagePath = $this->imageUrlToStoragePath($uri); - if (empty($uri) || is_null($storagePath)) { + $storagePath = $this->storage->urlToPath($url); + if (empty($url) || is_null($storagePath)) { return null; } - $storagePath = $this->adjustPathForStorageDisk($storagePath); + $storagePath = $this->storage->adjustPathForDisk($storagePath); // Apply access control when local_secure_restricted images are active - if ($this->usingSecureRestrictedImages()) { + if ($this->storage->usingSecureRestrictedImages()) { if (!$this->checkUserHasAccessToRelationOfImageAtPath($storagePath)) { return null; } } - $storage = $this->getStorageDisk(); + $disk = $this->storage->getDisk(); $imageData = null; - if ($storage->exists($storagePath)) { - $imageData = $storage->get($storagePath); + if ($disk->exists($storagePath)) { + $imageData = $disk->get($storagePath); } if (is_null($imageData)) { return null; } - $extension = pathinfo($uri, PATHINFO_EXTENSION); + $extension = pathinfo($url, PATHINFO_EXTENSION); if ($extension === 'svg') { $extension = 'svg+xml'; } @@ -547,15 +405,14 @@ class ImageService */ public function pathAccessibleInLocalSecure(string $imagePath): bool { - /** @var FilesystemAdapter $disk */ - $disk = $this->getStorageDisk('gallery'); + $disk = $this->storage->getDisk('gallery'); - if ($this->usingSecureRestrictedImages() && !$this->checkUserHasAccessToRelationOfImageAtPath($imagePath)) { + if ($this->storage->usingSecureRestrictedImages() && !$this->checkUserHasAccessToRelationOfImageAtPath($imagePath)) { return false; } // Check local_secure is active - return $this->usingSecureImages() + return $this->storage->usingSecureImages() && $disk instanceof FilesystemAdapter // Check the image file exists && $disk->exists($imagePath) @@ -617,7 +474,7 @@ class ImageService */ public function streamImageFromStorageResponse(string $imageType, string $path): StreamedResponse { - $disk = $this->getStorageDisk($imageType); + $disk = $this->storage->getDisk($imageType); return $disk->response($path); } @@ -631,64 +488,4 @@ class ImageService { return in_array($extension, static::$supportedExtensions); } - - /** - * Get a storage path for the given image URL. - * Ensures the path will start with "uploads/images". - * Returns null if the url cannot be resolved to a local URL. - */ - private function imageUrlToStoragePath(string $url): ?string - { - $url = ltrim(trim($url), '/'); - - // Handle potential relative paths - $isRelative = !str_starts_with($url, 'http'); - if ($isRelative) { - if (str_starts_with(strtolower($url), 'uploads/images')) { - return trim($url, '/'); - } - - return null; - } - - // Handle local images based on paths on the same domain - $potentialHostPaths = [ - url('uploads/images/'), - $this->getPublicUrl('/uploads/images/'), - ]; - - foreach ($potentialHostPaths as $potentialBasePath) { - $potentialBasePath = strtolower($potentialBasePath); - if (str_starts_with(strtolower($url), $potentialBasePath)) { - return 'uploads/images/' . trim(substr($url, strlen($potentialBasePath)), '/'); - } - } - - return null; - } - - /** - * Gets a public facing url for an image by checking relevant environment variables. - * If s3-style store is in use it will default to guessing a public bucket URL. - */ - private function getPublicUrl(string $filePath): string - { - $storageUrl = config('filesystems.url'); - - // Get the standard public s3 url if s3 is set as storage type - // Uses the nice, short URL if bucket name has no periods in otherwise the longer - // region-based url will be used to prevent http issues. - if (!$storageUrl && config('filesystems.images') === 's3') { - $storageDetails = config('filesystems.disks.s3'); - if (!str_contains($storageDetails['bucket'], '.')) { - $storageUrl = 'https://' . $storageDetails['bucket'] . '.s3.amazonaws.com'; - } else { - $storageUrl = 'https://s3-' . $storageDetails['region'] . '.amazonaws.com/' . $storageDetails['bucket']; - } - } - - $basePath = $storageUrl ?: url('/'); - - return rtrim($basePath, '/') . $filePath; - } } diff --git a/app/Uploads/ImageStorage.php b/app/Uploads/ImageStorage.php new file mode 100644 index 000000000..c51450052 --- /dev/null +++ b/app/Uploads/ImageStorage.php @@ -0,0 +1,183 @@ +fileSystem->disk($this->getDiskName($imageType)); + } + + /** + * Check if local secure image storage (Fetched behind authentication) + * is currently active in the instance. + */ + public function usingSecureImages(string $imageType = 'gallery'): bool + { + return $this->getDiskName($imageType) === 'local_secure_images'; + } + + /** + * Check if "local secure restricted" (Fetched behind auth, with permissions enforced) + * is currently active in the instance. + */ + public function usingSecureRestrictedImages() + { + return config('filesystems.images') === 'local_secure_restricted'; + } + + /** + * Change the originally provided path to fit any disk-specific requirements. + * This also ensures the path is kept to the expected root folders. + */ + public function adjustPathForDisk(string $path, string $imageType = ''): string + { + $path = (new WhitespacePathNormalizer())->normalizePath(str_replace('uploads/images/', '', $path)); + + if ($this->usingSecureImages($imageType)) { + return $path; + } + + return 'uploads/images/' . $path; + } + + /** + * Clean up an image file name to be both URL and storage safe. + */ + public function cleanImageFileName(string $name): string + { + $name = str_replace(' ', '-', $name); + $nameParts = explode('.', $name); + $extension = array_pop($nameParts); + $name = implode('-', $nameParts); + $name = Str::slug($name); + + if (strlen($name) === 0) { + $name = Str::random(10); + } + + return $name . '.' . $extension; + } + + /** + * Get the name of the storage disk to use. + */ + protected function getDiskName(string $imageType): string + { + $storageType = config('filesystems.images'); + $localSecureInUse = ($storageType === 'local_secure' || $storageType === 'local_secure_restricted'); + + // Ensure system images (App logo) are uploaded to a public space + if ($imageType === 'system' && $localSecureInUse) { + return 'local'; + } + + // Rename local_secure options to get our image specific storage driver which + // is scoped to the relevant image directories. + if ($localSecureInUse) { + return 'local_secure_images'; + } + + return $storageType; + } + + /** + * Get a storage path for the given image URL. + * Ensures the path will start with "uploads/images". + * Returns null if the url cannot be resolved to a local URL. + */ + public function urlToPath(string $url): ?string + { + $url = ltrim(trim($url), '/'); + + // Handle potential relative paths + $isRelative = !str_starts_with($url, 'http'); + if ($isRelative) { + if (str_starts_with(strtolower($url), 'uploads/images')) { + return trim($url, '/'); + } + + return null; + } + + // Handle local images based on paths on the same domain + $potentialHostPaths = [ + url('uploads/images/'), + $this->getPublicUrl('/uploads/images/'), + ]; + + foreach ($potentialHostPaths as $potentialBasePath) { + $potentialBasePath = strtolower($potentialBasePath); + if (str_starts_with(strtolower($url), $potentialBasePath)) { + return 'uploads/images/' . trim(substr($url, strlen($potentialBasePath)), '/'); + } + } + + return null; + } + + /** + * Gets a public facing url for an image by checking relevant environment variables. + * If s3-style store is in use it will default to guessing a public bucket URL. + */ + public function getPublicUrl(string $filePath): string + { + $storageUrl = config('filesystems.url'); + + // Get the standard public s3 url if s3 is set as storage type + // Uses the nice, short URL if bucket name has no periods in otherwise the longer + // region-based url will be used to prevent http issues. + if (!$storageUrl && config('filesystems.images') === 's3') { + $storageDetails = config('filesystems.disks.s3'); + if (!str_contains($storageDetails['bucket'], '.')) { + $storageUrl = 'https://' . $storageDetails['bucket'] . '.s3.amazonaws.com'; + } else { + $storageUrl = 'https://s3-' . $storageDetails['region'] . '.amazonaws.com/' . $storageDetails['bucket']; + } + } + + $basePath = $storageUrl ?: url('/'); + + return rtrim($basePath, '/') . $filePath; + } + + /** + * Save image data for the given path in the public space, if possible, + * for the provided storage mechanism. + */ + public function storeInPublicSpace(StorageDisk $storage, string $path, string $data): void + { + $storage->put($path, $data); + + // Set visibility when a non-AWS-s3, s3-like storage option is in use. + // Done since this call can break s3-like services but desired for other image stores. + // Attempting to set ACL during above put request requires different permissions + // hence would technically be a breaking change for actual s3 usage. + if (!$this->isS3Like()) { + $storage->setVisibility($path, 'public'); + } + } + + /** + * Check if the image storage in use is an S3-like (but not likely S3) external system. + */ + protected function isS3Like(): bool + { + $usingS3 = strtolower(config('filesystems.images')) === 's3'; + return $usingS3 && !is_null(config('filesystems.disks.s3.endpoint')); + } +} diff --git a/lang/en/errors.php b/lang/en/errors.php index 4164d558b..285817e47 100644 --- a/lang/en/errors.php +++ b/lang/en/errors.php @@ -51,6 +51,7 @@ return [ 'image_upload_error' => 'An error occurred uploading the image', 'image_upload_type_error' => 'The image type being uploaded is invalid', 'image_upload_replace_type' => 'Image file replacements must be of the same type', + 'image_upload_memory_limit' => 'Failed to handle image upload and/or create thumbnails due to system resource limits', 'image_thumbnail_memory_limit' => 'Failed to create image size variations due to system resource limits', 'drawing_data_not_found' => 'Drawing data could not be loaded. The drawing file might no longer exist or you may not have permission to access it.', From e703009d7fa6d1f3e448c23611ac907277412c42 Mon Sep 17 00:00:00 2001 From: Dan Brown Date: Sat, 30 Sep 2023 19:12:22 +0100 Subject: [PATCH 08/11] Images: Added thin wrapper around image filesystem instances Extracts duplicated required handling (Like path adjustment) out to simpler storage disk instance which can be passed around. --- app/Uploads/ImageService.php | 75 +++-------------- app/Uploads/ImageStorage.php | 63 ++------------ app/Uploads/ImageStorageDisk.php | 139 +++++++++++++++++++++++++++++++ 3 files changed, 159 insertions(+), 118 deletions(-) create mode 100644 app/Uploads/ImageStorageDisk.php diff --git a/app/Uploads/ImageService.php b/app/Uploads/ImageService.php index 81d6add92..f8567c3e5 100644 --- a/app/Uploads/ImageService.php +++ b/app/Uploads/ImageService.php @@ -9,9 +9,6 @@ use BookStack\Exceptions\ImageUploadException; use ErrorException; use Exception; use Illuminate\Contracts\Cache\Repository as Cache; -use Illuminate\Contracts\Filesystem\FileNotFoundException; -use Illuminate\Contracts\Filesystem\Filesystem as StorageDisk; -use Illuminate\Filesystem\FilesystemAdapter; use Illuminate\Filesystem\FilesystemManager; use Illuminate\Support\Facades\DB; use Illuminate\Support\Facades\Log; @@ -85,7 +82,7 @@ class ImageService $imagePath = '/uploads/images/' . $type . '/' . date('Y-m') . '/'; - while ($disk->exists($this->storage->adjustPathForDisk($imagePath . $fileName, $type))) { + while ($disk->exists($imagePath . $fileName)) { $fileName = Str::random(3) . $fileName; } @@ -95,7 +92,7 @@ class ImageService } try { - $this->storage->storeInPublicSpace($disk, $this->storage->adjustPathForDisk($fullPath, $type), $imageData); + $disk->put($fullPath, $imageData, true); } catch (Exception $e) { Log::error('Error when attempting image upload:' . $e->getMessage()); @@ -129,11 +126,9 @@ class ImageService { $imageData = file_get_contents($file->getRealPath()); $disk = $this->storage->getDisk($type); - $adjustedPath = $this->storage->adjustPathForDisk($path, $type); - $disk->put($adjustedPath, $imageData); + $disk->put($path, $imageData); } - /** * Checks if the image is a gif. Returns true if it is, else false. */ @@ -191,13 +186,13 @@ class ImageService // If thumbnail has already been generated, serve that and cache path $disk = $this->storage->getDisk($image->type); - if (!$shouldCreate && $disk->exists($this->storage->adjustPathForDisk($thumbFilePath, $image->type))) { + if (!$shouldCreate && $disk->exists($thumbFilePath)) { $this->cache->put($thumbCacheKey, $thumbFilePath, 60 * 60 * 72); return $this->storage->getPublicUrl($thumbFilePath); } - $imageData = $disk->get($this->storage->adjustPathForDisk($imagePath, $image->type)); + $imageData = $disk->get($imagePath); // Do not resize apng images where we're not cropping if ($keepRatio && $this->isApngData($image, $imageData)) { @@ -212,7 +207,7 @@ class ImageService // If not in cache and thumbnail does not exist, generate thumb and cache path $thumbData = $this->resizeImage($imageData, $width, $height, $keepRatio); - $this->storage->storeInPublicSpace($disk, $this->storage->adjustPathForDisk($thumbFilePath, $image->type), $thumbData); + $disk->put($thumbFilePath, $thumbData, true); $this->cache->put($thumbCacheKey, $thumbFilePath, 60 * 60 * 72); return $this->storage->getPublicUrl($thumbFilePath); @@ -253,7 +248,6 @@ class ImageService return $thumbData; } - /** * Get the raw data content from an image. * @@ -263,7 +257,7 @@ class ImageService { $disk = $this->storage->getDisk(); - return $disk->get($this->storage->adjustPathForDisk($image->path, $image->type)); + return $disk->get($image->path); } /** @@ -271,53 +265,13 @@ class ImageService * * @throws Exception */ - public function destroy(Image $image) + public function destroy(Image $image): void { - $this->destroyImagesFromPath($image->path, $image->type); + $disk = $this->storage->getDisk($image->type); + $disk->destroyAllMatchingNameFromPath($image->path); $image->delete(); } - /** - * Destroys an image at the given path. - * Searches for image thumbnails in addition to main provided path. - */ - protected function destroyImagesFromPath(string $path, string $imageType): bool - { - $path = $this->storage->adjustPathForDisk($path, $imageType); - $disk = $this->storage->getDisk($imageType); - - $imageFolder = dirname($path); - $imageFileName = basename($path); - $allImages = collect($disk->allFiles($imageFolder)); - - // Delete image files - $imagesToDelete = $allImages->filter(function ($imagePath) use ($imageFileName) { - return basename($imagePath) === $imageFileName; - }); - $disk->delete($imagesToDelete->all()); - - // Cleanup of empty folders - $foldersInvolved = array_merge([$imageFolder], $disk->directories($imageFolder)); - foreach ($foldersInvolved as $directory) { - if ($this->isFolderEmpty($disk, $directory)) { - $disk->deleteDirectory($directory); - } - } - - return true; - } - - /** - * Check whether a folder is empty. - */ - protected function isFolderEmpty(StorageDisk $storage, string $path): bool - { - $files = $storage->files($path); - $folders = $storage->directories($path); - - return count($files) === 0 && count($folders) === 0; - } - /** * Delete gallery and drawings that are not within HTML content of pages or page revisions. * Checks based off of only the image name. @@ -325,7 +279,7 @@ class ImageService * * Returns the path of the images that would be/have been deleted. */ - public function deleteUnusedImages(bool $checkRevisions = true, bool $dryRun = true) + public function deleteUnusedImages(bool $checkRevisions = true, bool $dryRun = true): array { $types = ['gallery', 'drawio']; $deletedPaths = []; @@ -361,8 +315,6 @@ class ImageService * Attempts to convert the URL to a system storage url then * fetch the data from the disk or storage location. * Returns null if the image data cannot be fetched from storage. - * - * @throws FileNotFoundException */ public function imageUrlToBase64(string $url): ?string { @@ -371,8 +323,6 @@ class ImageService return null; } - $storagePath = $this->storage->adjustPathForDisk($storagePath); - // Apply access control when local_secure_restricted images are active if ($this->storage->usingSecureRestrictedImages()) { if (!$this->checkUserHasAccessToRelationOfImageAtPath($storagePath)) { @@ -412,8 +362,7 @@ class ImageService } // Check local_secure is active - return $this->storage->usingSecureImages() - && $disk instanceof FilesystemAdapter + return $disk->usingSecureImages() // Check the image file exists && $disk->exists($imagePath) // Check the file is likely an image file diff --git a/app/Uploads/ImageStorage.php b/app/Uploads/ImageStorage.php index c51450052..dc4abc0f2 100644 --- a/app/Uploads/ImageStorage.php +++ b/app/Uploads/ImageStorage.php @@ -2,10 +2,8 @@ namespace BookStack\Uploads; -use Illuminate\Contracts\Filesystem\Filesystem as StorageDisk; use Illuminate\Filesystem\FilesystemManager; use Illuminate\Support\Str; -use League\Flysystem\WhitespacePathNormalizer; class ImageStorage { @@ -17,44 +15,25 @@ class ImageStorage /** * Get the storage disk for the given image type. */ - public function getDisk(string $imageType = ''): StorageDisk + public function getDisk(string $imageType = ''): ImageStorageDisk { - return $this->fileSystem->disk($this->getDiskName($imageType)); - } + $diskName = $this->getDiskName($imageType); - /** - * Check if local secure image storage (Fetched behind authentication) - * is currently active in the instance. - */ - public function usingSecureImages(string $imageType = 'gallery'): bool - { - return $this->getDiskName($imageType) === 'local_secure_images'; + return new ImageStorageDisk( + $diskName, + $this->fileSystem->disk($diskName), + ); } /** * Check if "local secure restricted" (Fetched behind auth, with permissions enforced) * is currently active in the instance. */ - public function usingSecureRestrictedImages() + public function usingSecureRestrictedImages(): bool { return config('filesystems.images') === 'local_secure_restricted'; } - /** - * Change the originally provided path to fit any disk-specific requirements. - * This also ensures the path is kept to the expected root folders. - */ - public function adjustPathForDisk(string $path, string $imageType = ''): string - { - $path = (new WhitespacePathNormalizer())->normalizePath(str_replace('uploads/images/', '', $path)); - - if ($this->usingSecureImages($imageType)) { - return $path; - } - - return 'uploads/images/' . $path; - } - /** * Clean up an image file name to be both URL and storage safe. */ @@ -78,7 +57,7 @@ class ImageStorage */ protected function getDiskName(string $imageType): string { - $storageType = config('filesystems.images'); + $storageType = strtolower(config('filesystems.images')); $localSecureInUse = ($storageType === 'local_secure' || $storageType === 'local_secure_restricted'); // Ensure system images (App logo) are uploaded to a public space @@ -154,30 +133,4 @@ class ImageStorage return rtrim($basePath, '/') . $filePath; } - - /** - * Save image data for the given path in the public space, if possible, - * for the provided storage mechanism. - */ - public function storeInPublicSpace(StorageDisk $storage, string $path, string $data): void - { - $storage->put($path, $data); - - // Set visibility when a non-AWS-s3, s3-like storage option is in use. - // Done since this call can break s3-like services but desired for other image stores. - // Attempting to set ACL during above put request requires different permissions - // hence would technically be a breaking change for actual s3 usage. - if (!$this->isS3Like()) { - $storage->setVisibility($path, 'public'); - } - } - - /** - * Check if the image storage in use is an S3-like (but not likely S3) external system. - */ - protected function isS3Like(): bool - { - $usingS3 = strtolower(config('filesystems.images')) === 's3'; - return $usingS3 && !is_null(config('filesystems.disks.s3.endpoint')); - } } diff --git a/app/Uploads/ImageStorageDisk.php b/app/Uploads/ImageStorageDisk.php new file mode 100644 index 000000000..3a95661ca --- /dev/null +++ b/app/Uploads/ImageStorageDisk.php @@ -0,0 +1,139 @@ +diskName === 'local_secure_images'; + } + + /** + * Change the originally provided path to fit any disk-specific requirements. + * This also ensures the path is kept to the expected root folders. + */ + protected function adjustPathForDisk(string $path): string + { + $path = (new WhitespacePathNormalizer())->normalizePath(str_replace('uploads/images/', '', $path)); + + if ($this->usingSecureImages()) { + return $path; + } + + return 'uploads/images/' . $path; + } + + /** + * Check if a file at the given path exists. + */ + public function exists(string $path): bool + { + return $this->filesystem->exists($this->adjustPathForDisk($path)); + } + + /** + * Get the file at the given path. + */ + public function get(string $path): bool + { + return $this->filesystem->get($this->adjustPathForDisk($path)); + } + + /** + * Save the given image data at the given path. Can choose to set + * the image as public which will update its visibility after saving. + */ + public function put(string $path, string $data, bool $makePublic = false): void + { + $path = $this->adjustPathForDisk($path); + $this->filesystem->put($path, $data); + + // Set visibility when a non-AWS-s3, s3-like storage option is in use. + // Done since this call can break s3-like services but desired for other image stores. + // Attempting to set ACL during above put request requires different permissions + // hence would technically be a breaking change for actual s3 usage. + if ($makePublic && !$this->isS3Like()) { + $this->filesystem->setVisibility($path, 'public'); + } + } + + /** + * Destroys an image at the given path. + * Searches for image thumbnails in addition to main provided path. + */ + public function destroyAllMatchingNameFromPath(string $path): void + { + $path = $this->adjustPathForDisk($path); + + $imageFolder = dirname($path); + $imageFileName = basename($path); + $allImages = collect($this->filesystem->allFiles($imageFolder)); + + // Delete image files + $imagesToDelete = $allImages->filter(function ($imagePath) use ($imageFileName) { + return basename($imagePath) === $imageFileName; + }); + $this->filesystem->delete($imagesToDelete->all()); + + // Cleanup of empty folders + $foldersInvolved = array_merge([$imageFolder], $this->filesystem->directories($imageFolder)); + foreach ($foldersInvolved as $directory) { + if ($this->isFolderEmpty($directory)) { + $this->filesystem->deleteDirectory($directory); + } + } + } + + /** + * Get the mime type of the file at the given path. + * Only works for local filesystem adapters. + */ + public function mimeType(string $path): string + { + return $this->filesystem instanceof FilesystemAdapter ? $this->filesystem->mimeType($path) : ''; + } + + /** + * Get a stream response for the image at the given path. + */ + public function response(string $path): StreamedResponse + { + return $this->filesystem->response($path); + } + + /** + * Check if the image storage in use is an S3-like (but not likely S3) external system. + */ + protected function isS3Like(): bool + { + $usingS3 = $this->diskName === 's3'; + return $usingS3 && !is_null(config('filesystems.disks.s3.endpoint')); + } + + /** + * Check whether a folder is empty. + */ + protected function isFolderEmpty(string $path): bool + { + $files = $this->filesystem->files($path); + $folders = $this->filesystem->directories($path); + + return count($files) === 0 && count($folders) === 0; + } +} From 20bcbd76efdffa7537c7373197db4491ea846ab0 Mon Sep 17 00:00:00 2001 From: Dan Brown Date: Sat, 30 Sep 2023 20:00:48 +0100 Subject: [PATCH 09/11] Images: Extracted out image resizing to its own class --- app/Uploads/Image.php | 2 +- app/Uploads/ImageRepo.php | 9 +-- app/Uploads/ImageResizer.php | 94 +++++++++++++++++++++- app/Uploads/ImageService.php | 132 +------------------------------ app/Uploads/ImageStorageDisk.php | 5 +- tests/Uploads/ImageTest.php | 1 + 6 files changed, 102 insertions(+), 141 deletions(-) diff --git a/app/Uploads/Image.php b/app/Uploads/Image.php index 5e197e750..1e42f414b 100644 --- a/app/Uploads/Image.php +++ b/app/Uploads/Image.php @@ -52,7 +52,7 @@ class Image extends Model */ public function getThumb(?int $width, ?int $height, bool $keepRatio = false): ?string { - return app()->make(ImageService::class)->getThumbnail($this, $width, $height, $keepRatio, false, true); + return app()->make(ImageResizer::class)->resizeToThumbnailUrl($this, $width, $height, $keepRatio, false, true); } /** diff --git a/app/Uploads/ImageRepo.php b/app/Uploads/ImageRepo.php index 8a770da78..4aa36bab9 100644 --- a/app/Uploads/ImageRepo.php +++ b/app/Uploads/ImageRepo.php @@ -13,7 +13,8 @@ class ImageRepo { public function __construct( protected ImageService $imageService, - protected PermissionApplicator $permissions + protected PermissionApplicator $permissions, + protected ImageResizer $imageResizer, ) { } @@ -225,14 +226,12 @@ class ImageRepo } /** - * Get the thumbnail for an image. - * If $keepRatio is true only the width will be used. - * Checks the cache then storage to avoid creating / accessing the filesystem on every check. + * Get a thumbnail URL for the given image. */ protected function getThumbnail(Image $image, ?int $width, ?int $height, bool $keepRatio, bool $shouldCreate): ?string { try { - return $this->imageService->getThumbnail($image, $width, $height, $keepRatio, $shouldCreate); + return $this->imageResizer->resizeToThumbnailUrl($image, $width, $height, $keepRatio, $shouldCreate); } catch (Exception $exception) { return null; } diff --git a/app/Uploads/ImageResizer.php b/app/Uploads/ImageResizer.php index 7a89b9d35..5fe8a8954 100644 --- a/app/Uploads/ImageResizer.php +++ b/app/Uploads/ImageResizer.php @@ -3,28 +3,91 @@ namespace BookStack\Uploads; use BookStack\Exceptions\ImageUploadException; +use Exception; use GuzzleHttp\Psr7\Utils; -use Intervention\Image\Exception\NotSupportedException; +use Illuminate\Support\Facades\Cache; use Intervention\Image\Image as InterventionImage; use Intervention\Image\ImageManager; class ImageResizer { public function __construct( - protected ImageManager $intervention + protected ImageManager $intervention, + protected ImageStorage $storage, ) { } + /** + * Get the thumbnail for an image. + * If $keepRatio is true only the width will be used. + * Checks the cache then storage to avoid creating / accessing the filesystem on every check. + * + * @throws Exception + */ + public function resizeToThumbnailUrl( + Image $image, + ?int $width, + ?int $height, + bool $keepRatio = false, + bool $shouldCreate = false, + bool $canCreate = false, + ): ?string { + // Do not resize GIF images where we're not cropping + if ($keepRatio && $this->isGif($image)) { + return $this->storage->getPublicUrl($image->path); + } + + $thumbDirName = '/' . ($keepRatio ? 'scaled-' : 'thumbs-') . $width . '-' . $height . '/'; + $imagePath = $image->path; + $thumbFilePath = dirname($imagePath) . $thumbDirName . basename($imagePath); + + $thumbCacheKey = 'images::' . $image->id . '::' . $thumbFilePath; + + // Return path if in cache + $cachedThumbPath = Cache::get($thumbCacheKey); + if ($cachedThumbPath && !$shouldCreate) { + return $this->storage->getPublicUrl($cachedThumbPath); + } + + // If thumbnail has already been generated, serve that and cache path + $disk = $this->storage->getDisk($image->type); + if (!$shouldCreate && $disk->exists($thumbFilePath)) { + Cache::put($thumbCacheKey, $thumbFilePath, 60 * 60 * 72); + + return $this->storage->getPublicUrl($thumbFilePath); + } + + $imageData = $disk->get($imagePath); + + // Do not resize apng images where we're not cropping + if ($keepRatio && $this->isApngData($image, $imageData)) { + Cache::put($thumbCacheKey, $image->path, 60 * 60 * 72); + + return $this->storage->getPublicUrl($image->path); + } + + if (!$shouldCreate && !$canCreate) { + return null; + } + + // If not in cache and thumbnail does not exist, generate thumb and cache path + $thumbData = $this->resizeImageData($imageData, $width, $height, $keepRatio); + $disk->put($thumbFilePath, $thumbData, true); + Cache::put($thumbCacheKey, $thumbFilePath, 60 * 60 * 72); + + return $this->storage->getPublicUrl($thumbFilePath); + } + /** * Resize the image of given data to the specified size, and return the new image data. * * @throws ImageUploadException */ - protected function resizeImageData(string $imageData, ?int $width, ?int $height, bool $keepRatio): string + public function resizeImageData(string $imageData, ?int $width, ?int $height, bool $keepRatio): string { try { $thumb = $this->intervention->make($imageData); - } catch (NotSupportedException $e) { + } catch (Exception $e) { throw new ImageUploadException(trans('errors.cannot_create_thumbs')); } @@ -92,4 +155,27 @@ class ImageResizer break; } } + + /** + * Checks if the image is a gif. Returns true if it is, else false. + */ + protected function isGif(Image $image): bool + { + return strtolower(pathinfo($image->path, PATHINFO_EXTENSION)) === 'gif'; + } + + /** + * Check if the given image and image data is apng. + */ + protected function isApngData(Image $image, string &$imageData): bool + { + $isPng = strtolower(pathinfo($image->path, PATHINFO_EXTENSION)) === 'png'; + if (!$isPng) { + return false; + } + + $initialHeader = substr($imageData, 0, strpos($imageData, 'IDAT')); + + return str_contains($initialHeader, 'acTL'); + } } diff --git a/app/Uploads/ImageService.php b/app/Uploads/ImageService.php index f8567c3e5..1655a4cc3 100644 --- a/app/Uploads/ImageService.php +++ b/app/Uploads/ImageService.php @@ -6,15 +6,10 @@ use BookStack\Entities\Models\Book; use BookStack\Entities\Models\Bookshelf; use BookStack\Entities\Models\Page; use BookStack\Exceptions\ImageUploadException; -use ErrorException; use Exception; -use Illuminate\Contracts\Cache\Repository as Cache; -use Illuminate\Filesystem\FilesystemManager; use Illuminate\Support\Facades\DB; use Illuminate\Support\Facades\Log; use Illuminate\Support\Str; -use Intervention\Image\Exception\NotSupportedException; -use Intervention\Image\ImageManager; use Symfony\Component\HttpFoundation\File\UploadedFile; use Symfony\Component\HttpFoundation\StreamedResponse; @@ -23,10 +18,8 @@ class ImageService protected static array $supportedExtensions = ['jpg', 'jpeg', 'png', 'gif', 'webp']; public function __construct( - protected ImageManager $imageTool, - protected FilesystemManager $fileSystem, - protected Cache $cache, protected ImageStorage $storage, + protected ImageResizer $resizer, ) { } @@ -47,7 +40,7 @@ class ImageService $imageData = file_get_contents($uploadedFile->getRealPath()); if ($resizeWidth !== null || $resizeHeight !== null) { - $imageData = $this->resizeImage($imageData, $resizeWidth, $resizeHeight, $keepRatio); + $imageData = $this->resizer->resizeImageData($imageData, $resizeWidth, $resizeHeight, $keepRatio); } return $this->saveNew($imageName, $imageData, $type, $uploadedTo); @@ -129,125 +122,6 @@ class ImageService $disk->put($path, $imageData); } - /** - * Checks if the image is a gif. Returns true if it is, else false. - */ - protected function isGif(Image $image): bool - { - return strtolower(pathinfo($image->path, PATHINFO_EXTENSION)) === 'gif'; - } - - /** - * Check if the given image and image data is apng. - */ - protected function isApngData(Image $image, string &$imageData): bool - { - $isPng = strtolower(pathinfo($image->path, PATHINFO_EXTENSION)) === 'png'; - if (!$isPng) { - return false; - } - - $initialHeader = substr($imageData, 0, strpos($imageData, 'IDAT')); - - return str_contains($initialHeader, 'acTL'); - } - - /** - * Get the thumbnail for an image. - * If $keepRatio is true only the width will be used. - * Checks the cache then storage to avoid creating / accessing the filesystem on every check. - * - * @throws Exception - */ - public function getThumbnail( - Image $image, - ?int $width, - ?int $height, - bool $keepRatio = false, - bool $shouldCreate = false, - bool $canCreate = false, - ): ?string { - // Do not resize GIF images where we're not cropping - if ($keepRatio && $this->isGif($image)) { - return $this->storage->getPublicUrl($image->path); - } - - $thumbDirName = '/' . ($keepRatio ? 'scaled-' : 'thumbs-') . $width . '-' . $height . '/'; - $imagePath = $image->path; - $thumbFilePath = dirname($imagePath) . $thumbDirName . basename($imagePath); - - $thumbCacheKey = 'images::' . $image->id . '::' . $thumbFilePath; - - // Return path if in cache - $cachedThumbPath = $this->cache->get($thumbCacheKey); - if ($cachedThumbPath && !$shouldCreate) { - return $this->storage->getPublicUrl($cachedThumbPath); - } - - // If thumbnail has already been generated, serve that and cache path - $disk = $this->storage->getDisk($image->type); - if (!$shouldCreate && $disk->exists($thumbFilePath)) { - $this->cache->put($thumbCacheKey, $thumbFilePath, 60 * 60 * 72); - - return $this->storage->getPublicUrl($thumbFilePath); - } - - $imageData = $disk->get($imagePath); - - // Do not resize apng images where we're not cropping - if ($keepRatio && $this->isApngData($image, $imageData)) { - $this->cache->put($thumbCacheKey, $image->path, 60 * 60 * 72); - - return $this->storage->getPublicUrl($image->path); - } - - if (!$shouldCreate && !$canCreate) { - return null; - } - - // If not in cache and thumbnail does not exist, generate thumb and cache path - $thumbData = $this->resizeImage($imageData, $width, $height, $keepRatio); - $disk->put($thumbFilePath, $thumbData, true); - $this->cache->put($thumbCacheKey, $thumbFilePath, 60 * 60 * 72); - - return $this->storage->getPublicUrl($thumbFilePath); - } - - /** - * Resize the image of given data to the specified size, and return the new image data. - * - * @throws ImageUploadException - */ - protected function resizeImage(string $imageData, ?int $width, ?int $height, bool $keepRatio): string - { - try { - $thumb = $this->imageTool->make($imageData); - } catch (ErrorException | NotSupportedException $e) { - throw new ImageUploadException(trans('errors.cannot_create_thumbs')); - } - - $this->orientImageToOriginalExif($thumb, $imageData); - - if ($keepRatio) { - $thumb->resize($width, $height, function ($constraint) { - $constraint->aspectRatio(); - $constraint->upsize(); - }); - } else { - $thumb->fit($width, $height); - } - - $thumbData = (string) $thumb->encode(); - - // Use original image data if we're keeping the ratio - // and the resizing does not save any space. - if ($keepRatio && strlen($thumbData) > strlen($imageData)) { - return $imageData; - } - - return $thumbData; - } - /** * Get the raw data content from an image. * @@ -375,7 +249,7 @@ class ImageService */ protected function checkUserHasAccessToRelationOfImageAtPath(string $path): bool { - if (str_starts_with($path, '/uploads/images/')) { + if (str_starts_with($path, 'uploads/images/')) { $path = substr($path, 15); } diff --git a/app/Uploads/ImageStorageDisk.php b/app/Uploads/ImageStorageDisk.php index 3a95661ca..798b72abd 100644 --- a/app/Uploads/ImageStorageDisk.php +++ b/app/Uploads/ImageStorageDisk.php @@ -50,7 +50,7 @@ class ImageStorageDisk /** * Get the file at the given path. */ - public function get(string $path): bool + public function get(string $path): ?string { return $this->filesystem->get($this->adjustPathForDisk($path)); } @@ -106,6 +106,7 @@ class ImageStorageDisk */ public function mimeType(string $path): string { + $path = $this->adjustPathForDisk($path); return $this->filesystem instanceof FilesystemAdapter ? $this->filesystem->mimeType($path) : ''; } @@ -114,7 +115,7 @@ class ImageStorageDisk */ public function response(string $path): StreamedResponse { - return $this->filesystem->response($path); + return $this->filesystem->response($this->adjustPathForDisk($path)); } /** diff --git a/tests/Uploads/ImageTest.php b/tests/Uploads/ImageTest.php index 9943302d3..4da964d48 100644 --- a/tests/Uploads/ImageTest.php +++ b/tests/Uploads/ImageTest.php @@ -557,6 +557,7 @@ class ImageTest extends TestCase $this->asEditor(); $imageName = 'first-image.png'; $relPath = $this->files->expectedImagePath('gallery', $imageName); + $this->files->deleteAtRelativePath($relPath); $this->files->uploadGalleryImage($this, $imageName, $this->entities->page()->id); $image = Image::first(); From b2d48d9a7f52ae0d37567eec57469ea2d9c901d3 Mon Sep 17 00:00:00 2001 From: Dan Brown Date: Sun, 1 Oct 2023 13:05:18 +0100 Subject: [PATCH 10/11] Images: Rolled out image memory handling to image actions - Moved thumnbail loading out of repo into ImageResizer. - Updated gallery and editor image handling to show errors where possible to indicate memory issues for resizing/thumbs. - Updated gallery to load image data in a per-image basis via edit form for more resiliant thumb/data fetching. Data was previously provided via gallery listing, which could be affected by failing generation of other images. - Updated image manager double click handling to be more pleasant and not flash away the edit form. - Updated editor handlers to use main URL when thumbs fail to load. --- .../Controllers/DrawioImageController.php | 19 ++++++-- .../Controllers/GalleryImageController.php | 18 ++++++-- app/Uploads/Controllers/ImageController.php | 26 ++++++++--- .../Controllers/ImageGalleryApiController.php | 7 ++- app/Uploads/Image.php | 2 +- app/Uploads/ImageRepo.php | 43 +++---------------- app/Uploads/ImageResizer.php | 43 +++++++++++++++---- lang/en/errors.php | 5 ++- resources/js/components/image-manager.js | 20 +++++---- resources/js/markdown/actions.js | 4 +- resources/js/wysiwyg/drop-paste-handling.js | 2 +- resources/js/wysiwyg/plugins-imagemanager.js | 2 +- resources/sass/_components.scss | 12 ++++++ .../pages/parts/image-manager-form.blade.php | 9 ++++ .../pages/parts/image-manager-list.blade.php | 8 +++- 15 files changed, 142 insertions(+), 78 deletions(-) diff --git a/app/Uploads/Controllers/DrawioImageController.php b/app/Uploads/Controllers/DrawioImageController.php index 49f0c1655..6293da4f7 100644 --- a/app/Uploads/Controllers/DrawioImageController.php +++ b/app/Uploads/Controllers/DrawioImageController.php @@ -5,6 +5,8 @@ namespace BookStack\Uploads\Controllers; use BookStack\Exceptions\ImageUploadException; use BookStack\Http\Controller; use BookStack\Uploads\ImageRepo; +use BookStack\Uploads\ImageResizer; +use BookStack\Util\OutOfMemoryHandler; use Exception; use Illuminate\Http\Request; @@ -19,7 +21,7 @@ class DrawioImageController extends Controller * Get a list of gallery images, in a list. * Can be paged and filtered by entity. */ - public function list(Request $request) + public function list(Request $request, ImageResizer $resizer) { $page = $request->get('page', 1); $searchTerm = $request->get('search', null); @@ -27,11 +29,20 @@ class DrawioImageController extends Controller $parentTypeFilter = $request->get('filter_type', null); $imgData = $this->imageRepo->getEntityFiltered('drawio', $parentTypeFilter, $page, 24, $uploadedToFilter, $searchTerm); - - return view('pages.parts.image-manager-list', [ + $viewData = [ + 'warning' => '', 'images' => $imgData['images'], 'hasMore' => $imgData['has_more'], - ]); + ]; + + new OutOfMemoryHandler(function () use ($viewData) { + $viewData['warning'] = trans('errors.image_gallery_thumbnail_memory_limit'); + return response()->view('pages.parts.image-manager-list', $viewData, 200); + }); + + $resizer->loadGalleryThumbnailsForMany($imgData['images']); + + return view('pages.parts.image-manager-list', $viewData); } /** diff --git a/app/Uploads/Controllers/GalleryImageController.php b/app/Uploads/Controllers/GalleryImageController.php index 0696ca62b..258f2bef6 100644 --- a/app/Uploads/Controllers/GalleryImageController.php +++ b/app/Uploads/Controllers/GalleryImageController.php @@ -5,6 +5,7 @@ namespace BookStack\Uploads\Controllers; use BookStack\Exceptions\ImageUploadException; use BookStack\Http\Controller; use BookStack\Uploads\ImageRepo; +use BookStack\Uploads\ImageResizer; use BookStack\Util\OutOfMemoryHandler; use Illuminate\Http\Request; use Illuminate\Support\Facades\App; @@ -22,7 +23,7 @@ class GalleryImageController extends Controller * Get a list of gallery images, in a list. * Can be paged and filtered by entity. */ - public function list(Request $request) + public function list(Request $request, ImageResizer $resizer) { $page = $request->get('page', 1); $searchTerm = $request->get('search', null); @@ -30,11 +31,20 @@ class GalleryImageController extends Controller $parentTypeFilter = $request->get('filter_type', null); $imgData = $this->imageRepo->getEntityFiltered('gallery', $parentTypeFilter, $page, 30, $uploadedToFilter, $searchTerm); - - return view('pages.parts.image-manager-list', [ + $viewData = [ + 'warning' => '', 'images' => $imgData['images'], 'hasMore' => $imgData['has_more'], - ]); + ]; + + new OutOfMemoryHandler(function () use ($viewData) { + $viewData['warning'] = trans('errors.image_gallery_thumbnail_memory_limit'); + return response()->view('pages.parts.image-manager-list', $viewData, 200); + }); + + $resizer->loadGalleryThumbnailsForMany($imgData['images']); + + return view('pages.parts.image-manager-list', $viewData); } /** diff --git a/app/Uploads/Controllers/ImageController.php b/app/Uploads/Controllers/ImageController.php index f92338bc8..c68ffdf6b 100644 --- a/app/Uploads/Controllers/ImageController.php +++ b/app/Uploads/Controllers/ImageController.php @@ -4,9 +4,11 @@ namespace BookStack\Uploads\Controllers; use BookStack\Exceptions\ImageUploadException; use BookStack\Exceptions\NotFoundException; +use BookStack\Exceptions\NotifyException; use BookStack\Http\Controller; use BookStack\Uploads\Image; use BookStack\Uploads\ImageRepo; +use BookStack\Uploads\ImageResizer; use BookStack\Uploads\ImageService; use BookStack\Util\OutOfMemoryHandler; use Exception; @@ -16,7 +18,8 @@ class ImageController extends Controller { public function __construct( protected ImageRepo $imageRepo, - protected ImageService $imageService + protected ImageService $imageService, + protected ImageResizer $imageResizer, ) { } @@ -98,12 +101,20 @@ class ImageController extends Controller $dependantPages = $this->imageRepo->getPagesUsingImage($image); } - $this->imageRepo->loadThumbs($image, false); - - return view('pages.parts.image-manager-form', [ + $viewData = [ 'image' => $image, 'dependantPages' => $dependantPages ?? null, - ]); + 'warning' => '', + ]; + + new OutOfMemoryHandler(function () use ($viewData) { + $viewData['warning'] = trans('errors.image_thumbnail_memory_limit'); + return response()->view('pages.parts.image-manager-form', $viewData); + }); + + $this->imageResizer->loadGalleryThumbnailsForImage($image, false); + + return view('pages.parts.image-manager-form', $viewData); } /** @@ -135,15 +146,16 @@ class ImageController extends Controller return $this->jsonError(trans('errors.image_thumbnail_memory_limit')); }); - $this->imageRepo->loadThumbs($image, true); + $this->imageResizer->loadGalleryThumbnailsForImage($image, true); return response(trans('components.image_rebuild_thumbs_success')); } /** * Check related page permission and ensure type is drawio or gallery. + * @throws NotifyException */ - protected function checkImagePermission(Image $image) + protected function checkImagePermission(Image $image): void { if ($image->type !== 'drawio' && $image->type !== 'gallery') { $this->showPermissionError(); diff --git a/app/Uploads/Controllers/ImageGalleryApiController.php b/app/Uploads/Controllers/ImageGalleryApiController.php index efdff5be4..ec96e4593 100644 --- a/app/Uploads/Controllers/ImageGalleryApiController.php +++ b/app/Uploads/Controllers/ImageGalleryApiController.php @@ -6,6 +6,7 @@ use BookStack\Entities\Models\Page; use BookStack\Http\ApiController; use BookStack\Uploads\Image; use BookStack\Uploads\ImageRepo; +use BookStack\Uploads\ImageResizer; use Illuminate\Http\Request; class ImageGalleryApiController extends ApiController @@ -15,7 +16,8 @@ class ImageGalleryApiController extends ApiController ]; public function __construct( - protected ImageRepo $imageRepo + protected ImageRepo $imageRepo, + protected ImageResizer $imageResizer, ) { } @@ -130,7 +132,7 @@ class ImageGalleryApiController extends ApiController */ protected function formatForSingleResponse(Image $image): array { - $this->imageRepo->loadThumbs($image, false); + $this->imageResizer->loadGalleryThumbnailsForImage($image, false); $data = $image->toArray(); $data['created_by'] = $image->createdBy; $data['updated_by'] = $image->updatedBy; @@ -138,6 +140,7 @@ class ImageGalleryApiController extends ApiController $escapedUrl = htmlentities($image->url); $escapedName = htmlentities($image->name); + if ($image->type === 'drawio') { $data['content']['html'] = "
id}\">
"; $data['content']['markdown'] = $data['content']['html']; diff --git a/app/Uploads/Image.php b/app/Uploads/Image.php index 1e42f414b..0a267a644 100644 --- a/app/Uploads/Image.php +++ b/app/Uploads/Image.php @@ -52,7 +52,7 @@ class Image extends Model */ public function getThumb(?int $width, ?int $height, bool $keepRatio = false): ?string { - return app()->make(ImageResizer::class)->resizeToThumbnailUrl($this, $width, $height, $keepRatio, false, true); + return app()->make(ImageResizer::class)->resizeToThumbnailUrl($this, $width, $height, $keepRatio, false); } /** diff --git a/app/Uploads/ImageRepo.php b/app/Uploads/ImageRepo.php index 4aa36bab9..0e312d883 100644 --- a/app/Uploads/ImageRepo.php +++ b/app/Uploads/ImageRepo.php @@ -30,19 +30,13 @@ class ImageRepo * Execute a paginated query, returning in a standard format. * Also runs the query through the restriction system. */ - private function returnPaginated(Builder $query, int $page = 1, int $pageSize = 24): array + protected function returnPaginated(Builder $query, int $page = 1, int $pageSize = 24): array { $images = $query->orderBy('created_at', 'desc')->skip($pageSize * ($page - 1))->take($pageSize + 1)->get(); - $hasMore = count($images) > $pageSize; - - $returnImages = $images->take($pageSize); - $returnImages->each(function (Image $image) { - $this->loadThumbs($image, false); - }); return [ - 'images' => $returnImages, - 'has_more' => $hasMore, + 'images' => $images->take($pageSize), + 'has_more' => count($images) > $pageSize, ]; } @@ -120,7 +114,7 @@ class ImageRepo $image = $this->imageService->saveNewFromUpload($uploadFile, $type, $uploadedTo, $resizeWidth, $resizeHeight, $keepRatio); if ($type !== 'system') { - $this->loadThumbs($image, true); + $this->imageResizer->loadGalleryThumbnailsForImage($image, true); } return $image; @@ -134,7 +128,7 @@ class ImageRepo public function saveNewFromData(string $imageName, string $imageData, string $type, int $uploadedTo = 0): Image { $image = $this->imageService->saveNew($imageName, $imageData, $type, $uploadedTo); - $this->loadThumbs($image, true); + $this->imageResizer->loadGalleryThumbnailsForImage($image, true); return $image; } @@ -161,7 +155,7 @@ class ImageRepo $image->fill($updateDetails); $image->updated_by = user()->id; $image->save(); - $this->loadThumbs($image, false); + $this->imageResizer->loadGalleryThumbnailsForImage($image, false); return $image; } @@ -182,7 +176,7 @@ class ImageRepo $image->save(); $this->imageService->replaceExistingFromUpload($image->path, $image->type, $file); - $this->loadThumbs($image, true); + $this->imageResizer->loadGalleryThumbnailsForImage($image, true); } /** @@ -214,29 +208,6 @@ class ImageRepo } } - /** - * Load thumbnails onto an image object. - */ - public function loadThumbs(Image $image, bool $shouldCreate): void - { - $image->setAttribute('thumbs', [ - 'gallery' => $this->getThumbnail($image, 150, 150, false, $shouldCreate), - 'display' => $this->getThumbnail($image, 1680, null, true, $shouldCreate), - ]); - } - - /** - * Get a thumbnail URL for the given image. - */ - protected function getThumbnail(Image $image, ?int $width, ?int $height, bool $keepRatio, bool $shouldCreate): ?string - { - try { - return $this->imageResizer->resizeToThumbnailUrl($image, $width, $height, $keepRatio, $shouldCreate); - } catch (Exception $exception) { - return null; - } - } - /** * Get the raw image data from an Image. */ diff --git a/app/Uploads/ImageResizer.php b/app/Uploads/ImageResizer.php index 5fe8a8954..0d090a94b 100644 --- a/app/Uploads/ImageResizer.php +++ b/app/Uploads/ImageResizer.php @@ -11,12 +11,42 @@ use Intervention\Image\ImageManager; class ImageResizer { + protected const THUMBNAIL_CACHE_TIME = 604_800; // 1 week + public function __construct( protected ImageManager $intervention, protected ImageStorage $storage, ) { } + /** + * Load gallery thumbnails for a set of images. + * @param iterable $images + */ + public function loadGalleryThumbnailsForMany(iterable $images, bool $shouldCreate = false): void + { + foreach ($images as $image) { + $this->loadGalleryThumbnailsForImage($image, $shouldCreate); + } + } + + /** + * Load gallery thumbnails into the given image instance. + */ + public function loadGalleryThumbnailsForImage(Image $image, bool $shouldCreate): void + { + $thumbs = ['gallery' => null, 'display' => null]; + + try { + $thumbs['gallery'] = $this->resizeToThumbnailUrl($image, 150, 150, false, $shouldCreate); + $thumbs['display'] = $this->resizeToThumbnailUrl($image, 1680, null, true, $shouldCreate); + } catch (Exception $exception) { + // Prevent thumbnail errors from stopping execution + } + + $image->setAttribute('thumbs', $thumbs); + } + /** * Get the thumbnail for an image. * If $keepRatio is true only the width will be used. @@ -29,8 +59,7 @@ class ImageResizer ?int $width, ?int $height, bool $keepRatio = false, - bool $shouldCreate = false, - bool $canCreate = false, + bool $shouldCreate = false ): ?string { // Do not resize GIF images where we're not cropping if ($keepRatio && $this->isGif($image)) { @@ -52,7 +81,7 @@ class ImageResizer // If thumbnail has already been generated, serve that and cache path $disk = $this->storage->getDisk($image->type); if (!$shouldCreate && $disk->exists($thumbFilePath)) { - Cache::put($thumbCacheKey, $thumbFilePath, 60 * 60 * 72); + Cache::put($thumbCacheKey, $thumbFilePath, static::THUMBNAIL_CACHE_TIME); return $this->storage->getPublicUrl($thumbFilePath); } @@ -61,19 +90,15 @@ class ImageResizer // Do not resize apng images where we're not cropping if ($keepRatio && $this->isApngData($image, $imageData)) { - Cache::put($thumbCacheKey, $image->path, 60 * 60 * 72); + Cache::put($thumbCacheKey, $image->path, static::THUMBNAIL_CACHE_TIME); return $this->storage->getPublicUrl($image->path); } - if (!$shouldCreate && !$canCreate) { - return null; - } - // If not in cache and thumbnail does not exist, generate thumb and cache path $thumbData = $this->resizeImageData($imageData, $width, $height, $keepRatio); $disk->put($thumbFilePath, $thumbData, true); - Cache::put($thumbCacheKey, $thumbFilePath, 60 * 60 * 72); + Cache::put($thumbCacheKey, $thumbFilePath, static::THUMBNAIL_CACHE_TIME); return $this->storage->getPublicUrl($thumbFilePath); } diff --git a/lang/en/errors.php b/lang/en/errors.php index 285817e47..8813cf90a 100644 --- a/lang/en/errors.php +++ b/lang/en/errors.php @@ -51,8 +51,9 @@ return [ 'image_upload_error' => 'An error occurred uploading the image', 'image_upload_type_error' => 'The image type being uploaded is invalid', 'image_upload_replace_type' => 'Image file replacements must be of the same type', - 'image_upload_memory_limit' => 'Failed to handle image upload and/or create thumbnails due to system resource limits', - 'image_thumbnail_memory_limit' => 'Failed to create image size variations due to system resource limits', + 'image_upload_memory_limit' => 'Failed to handle image upload and/or create thumbnails due to system resource limits.', + 'image_thumbnail_memory_limit' => 'Failed to create image size variations due to system resource limits.', + 'image_gallery_thumbnail_memory_limit' => 'Failed to create gallery thumbnails due to system resource limits.', 'drawing_data_not_found' => 'Drawing data could not be loaded. The drawing file might no longer exist or you may not have permission to access it.', // Attachments diff --git a/resources/js/components/image-manager.js b/resources/js/components/image-manager.js index bc0493a88..b6397b004 100644 --- a/resources/js/components/image-manager.js +++ b/resources/js/components/image-manager.js @@ -1,6 +1,4 @@ -import { - onChildEvent, onSelect, removeLoading, showLoading, -} from '../services/dom'; +import {onChildEvent, onSelect, removeLoading, showLoading,} from '../services/dom'; import {Component} from './component'; export class ImageManager extends Component { @@ -229,8 +227,8 @@ export class ImageManager extends Component { this.loadGallery(); } - onImageSelectEvent(event) { - const image = JSON.parse(event.detail.data); + async onImageSelectEvent(event) { + let image = JSON.parse(event.detail.data); const isDblClick = ((image && image.id === this.lastSelected.id) && Date.now() - this.lastSelectedTime < 400); const alreadySelected = event.target.classList.contains('selected'); @@ -238,12 +236,15 @@ export class ImageManager extends Component { el.classList.remove('selected'); }); - if (!alreadySelected) { + if (!alreadySelected && !isDblClick) { event.target.classList.add('selected'); - this.loadImageEditForm(image.id); - } else { + image = await this.loadImageEditForm(image.id); + } else if (!isDblClick) { this.resetEditForm(); + } else if (isDblClick) { + image = this.lastSelected; } + this.selectButton.classList.toggle('hidden', alreadySelected); if (isDblClick && this.callback) { @@ -265,6 +266,9 @@ export class ImageManager extends Component { this.formContainer.innerHTML = formHtml; this.formContainerPlaceholder.setAttribute('hidden', ''); window.$components.init(this.formContainer); + + const imageDataEl = this.formContainer.querySelector('#image-manager-form-image-data'); + return JSON.parse(imageDataEl.text); } runLoadMore() { diff --git a/resources/js/markdown/actions.js b/resources/js/markdown/actions.js index a7fde9322..4909a59d0 100644 --- a/resources/js/markdown/actions.js +++ b/resources/js/markdown/actions.js @@ -34,7 +34,7 @@ export class Actions { const imageManager = window.$components.first('image-manager'); imageManager.show(image => { - const imageUrl = image.thumbs.display || image.url; + const imageUrl = image.thumbs?.display || image.url; const selectedText = this.#getSelectionText(); const newText = `[![${selectedText || image.name}](${imageUrl})](${image.url})`; this.#replaceSelection(newText, newText.length); @@ -417,7 +417,7 @@ export class Actions { const newContent = `[![](${data.thumbs.display})](${data.url})`; this.#findAndReplaceContent(placeHolderText, newContent); } catch (err) { - window.$events.emit('error', this.editor.config.text.imageUploadError); + window.$events.error(err?.data?.message || this.editor.config.text.imageUploadError); this.#findAndReplaceContent(placeHolderText, ''); console.error(err); } diff --git a/resources/js/wysiwyg/drop-paste-handling.js b/resources/js/wysiwyg/drop-paste-handling.js index 33078cd1d..9668692c8 100644 --- a/resources/js/wysiwyg/drop-paste-handling.js +++ b/resources/js/wysiwyg/drop-paste-handling.js @@ -61,7 +61,7 @@ function paste(editor, options, event) { editor.dom.replace(newEl, id); }).catch(err => { editor.dom.remove(id); - window.$events.emit('error', options.translations.imageUploadErrorText); + window.$events.error(err?.data?.message || options.translations.imageUploadErrorText); console.error(err); }); }, 10); diff --git a/resources/js/wysiwyg/plugins-imagemanager.js b/resources/js/wysiwyg/plugins-imagemanager.js index 37b5bfafd..f1ea12050 100644 --- a/resources/js/wysiwyg/plugins-imagemanager.js +++ b/resources/js/wysiwyg/plugins-imagemanager.js @@ -11,7 +11,7 @@ function register(editor) { /** @type {ImageManager} * */ const imageManager = window.$components.first('image-manager'); imageManager.show(image => { - const imageUrl = image.thumbs.display || image.url; + const imageUrl = image.thumbs?.display || image.url; let html = ``; html += `${image.name}`; html += ''; diff --git a/resources/sass/_components.scss b/resources/sass/_components.scss index c1989c1f6..150f78e12 100644 --- a/resources/sass/_components.scss +++ b/resources/sass/_components.scss @@ -457,6 +457,18 @@ body.flexbox-support #entity-selector-wrap .popup-body .form-group { text-align: center; } +.image-manager-list .image-manager-list-warning { + grid-column: 1 / -1; + aspect-ratio: auto; +} + +.image-manager-warning { + @include lightDark(background, #FFF, #333); + color: var(--color-warning); + font-weight: bold; + border-inline: 3px solid var(--color-warning); +} + .image-manager-sidebar { width: 300px; margin: 0 auto; diff --git a/resources/views/pages/parts/image-manager-form.blade.php b/resources/views/pages/parts/image-manager-form.blade.php index 3a73bee7c..bd84e247d 100644 --- a/resources/views/pages/parts/image-manager-form.blade.php +++ b/resources/views/pages/parts/image-manager-form.blade.php @@ -8,8 +8,17 @@ option:dropzone:file-accept="image/*" class="image-manager-details"> + @if($warning ?? '') +
+
@icon('warning')
+
{{ $warning }}
+
+ @endif +
+ +
+
@icon('warning')
+
{{ $warning }}
+ +@endif @foreach($images as $index => $image)