OctoberCMS using S3: thumbnzails in modules

Need Help
#1

Hi all

I have this project on October 3 that I just deployed to an AWS elasticbean server

Ive configured it to use S3 for storage and after a few tries, I got it working 100% except for one thing: if I go into modules, in the backend, the thumbnails for any images are broken

The admin is trying to load them like this:
https://[bucker-url]/media/resize/190_190_0_0_crop/img_747c9180196cfe41ac45900080bea7e9.png

Which is correct. But I checked the bucket and those thumbnails are actually being created on:
https://[bucker-url]/resize/190_190_0_0_crop/img_747c9180196cfe41ac45900080bea7e9.png

Which is wrong, its supposed to be inside media/

I got media in config/filesystems.php set like this:

        'media' => [
            'driver'     => env('FILESYSTEM_DRIVER', 'local'),
            'key'        => env('AWS_ACCESS_KEY_ID'),
            'secret'     => env('AWS_SECRET_ACCESS_KEY'),
            'region'     => env('AWS_DEFAULT_REGION', 'us-west-1'),
            'bucket'     => env('AWS_BUCKET'),
            'root'       => env('STORAGE_MEDIA_PATH', '/'),
            'url'        => env('STORAGE_MEDIA_URL', '/storage/app/media'),
            'visibility' => 'public',
            'throw'      => false,
        ],

.env:

AWS_BUCKET=[bucket-name]
STORAGE_MEDIA_URL=https://[bucker-url]/media
STORAGE_MEDIA_PATH=media/
AWS_URL=[bucker-url]
FILESYSTEM_DRIVER=s3
FILESYSTEM_CLOUD=s3
STORAGE_DISK=s3

It seems correct, upload is working, the files are loading on the site itself. Is just those thumbs in the modules are of the backend that are broken

Any clue why? Any help will be much appreciated

#2

Hey @DiogoAbdalla

At first glance, I think you need to change the root to /media

'root'       => env('STORAGE_MEDIA_PATH', '/media'),
#3

Actually, generated assets will use the “resources” disk. So this needs to be configured, also.

'resources' => [
    'driver' => 'local',
    'root' => storage_path('app/resources'),
    'url' => '/storage/app/resources',
    'visibility' => 'public',
    'throw' => false,
],
#4

Hey, thank you for your answers

Ive set STORAGE_MEDIA_PATH to media/ because otherwise the file manager on /media wont work, it gives me an error if I try “/media” (“Unable to retrieve the last_modified for file at location”). The only way I found to make this work is to set it for media/

Changing “resources” to be like you posted here seems to have worked, though

Thank you

1 Like
#5

Hi Guys,

We also have managed to get the media uploads to s3. That works fine.
Also set the resources disk to driver s3. But the resized images are not showing up in the s3 bucket.

        'media' => [
            'driver' => 's3',
            'key' => env('AWS_ACCESS_KEY_ID'),
            'secret' => env('AWS_SECRET_ACCESS_KEY'),
            'region' => env('AWS_DEFAULT_REGION'),
            'bucket' => env('AWS_BUCKET'),
            'url' => 'https://***.cloudfront.net',
            'visibility' => 'public',
            'throw' => true,
        ],

        'resources' => [
            'driver' => 's3',
            'key' => env('AWS_ACCESS_KEY_ID'),
            'secret' => env('AWS_SECRET_ACCESS_KEY'),
            'region' => env('AWS_DEFAULT_REGION'),
            'bucket' => env('AWS_BUCKET'),
            'url' => 'https://***.cloudfront.net',
            'visibility' => 'public',
            'throw' => true,
        ],

As soon as i set the root on the media-disk, there are no media-uploads anymore.
Setting the root on the resources-disk also did not work.

Any thoughts?

#6

Here is a working example taken from: Release Note 32: October CMS 3.1 - Stable Release - October CMS

'uploads' => [
    'driver' => env('FILESYSTEM_DRIVER', 'local'),
    'key' => env('AWS_ACCESS_KEY_ID'),
    'secret' => env('AWS_SECRET_ACCESS_KEY'),
    'region' => env('AWS_DEFAULT_REGION', 'us-west-1'),
    'bucket' => env('AWS_BUCKET'),
    'endpoint' => env('AWS_ENDPOINT'),
    'root' => env('STORAGE_UPLOADS_PATH', storage_path('app/uploads')),
    'url' => env('STORAGE_UPLOADS_URL', '/storage/app/uploads'),
    'visibility' => 'public',
    'throw' => false,
    'ttl' => 3600,
],

'media' => [
    'driver' => env('FILESYSTEM_DRIVER', 'local'),
    'key' => env('AWS_ACCESS_KEY_ID'),
    'secret' => env('AWS_SECRET_ACCESS_KEY'),
    'region' => env('AWS_DEFAULT_REGION', 'us-west-1'),
    'bucket' => env('AWS_BUCKET'),
    'endpoint' => env('AWS_ENDPOINT'),
    'root' => env('STORAGE_MEDIA_PATH', storage_path('app/media')),
    'url' => env('STORAGE_MEDIA_URL', '/storage/app/media'),
    'visibility' => 'public',
    'throw' => false,
],

'resources' => [
    'driver' => env('FILESYSTEM_DRIVER', 'local'),
    'key' => env('AWS_ACCESS_KEY_ID'),
    'secret' => env('AWS_SECRET_ACCESS_KEY'),
    'region' => env('AWS_DEFAULT_REGION', 'us-west-1'),
    'bucket' => env('AWS_BUCKET'),
    'endpoint' => env('AWS_ENDPOINT'),
    'root' => env('STORAGE_RESOURCES_PATH', storage_path('app/resources')),
    'url' => env('STORAGE_RESOURCES_URL', '/storage/app/resources'),
    'visibility' => 'public',
    'throw' => false,
],
#7

Also if i use this example, the resized images are not saved on s3, but after changing the CloudFront url back to the s3 url, the resizer can find the original image and, do its magic, and save to s3.
Any thoughts how we can use CloudFront url?

#8

Are you setting this variable to the cloudfront URL?

#9

Yes, and STORAGE_RESOURCE_PATH, but the resized images are never uploaded to s3, als soon as i set the cloudfront-url on the media object. The images are showing though, but resizing doesn’t work.

#10

It should definitely save to S3 since the code is there. For debugging, take a look at System\Classes\ResizeImages…

// Save resized file to disk
$disk = Storage::disk('resources');
$filePath = $this->getStoragePath($imageItem);
$success = $disk->putFileAs(
    dirname($filePath),
    $tempTargetPath,
    basename($filePath)
);