How to Set Laravel Nova Trix s3 Uploads as Public

Learn how to configure and use s3 disk for Laravel. Nova Trix field and save the image to be publicly accessible to everyone

Created on Feb 01, 2022

•

1095 views

In this short snippet, you will learn how to configure and use the s3 disk for the Laravel Nova Trix field and save the image to be publicly accessible to everyone.
I assume that you have set up s3 disk such as by using AWS S3 or its compatible alternative Digital Ocean Spaces / Vultr Object Storage. If you have not then you can refer to our tutorials on it by searching our post list.

Using Default "public" Disk

The default public disk will have the following configuration and this is generally will be stored inside the "storage" directory itself.

<?php // filesystem.php

'public' => [
    'driver' => 'local',
    'root' => storage_path('app/public'),
    'url' => env('APP_URL').'/storage',
    'visibility' => 'public',
],

While for the nova Trix field, you will be chining the "withFiles()" method and then specifying the disk such as "public" like the following.

<?php // app/Nova/Post.php

Trix::make(__('Body'), 'body')
    ->withFiles('public')
    ->rules('required'),

By default, any uploads will be stored inside the "storage" and any subfolders can be passed on as the 2nd parameter of the withFiles method.

Using "s3" Disk

If you are using s3 disk then you can specify it like below. But do note that by default it will be stored as "private" file and won't be accessible by everyone.

<?php // app/Nova/Post.php

Trix::make(__('Body'), 'body')
    ->withFiles('s3')
    ->rules('required'),

The reason for this is that internally Nova is using the "store" method to save the image instead of the "storePublicly" as we wanted it to be.

storePublicly()

Do note that the configuration for the s3 will be like the following.

<?php

's3' => [
    'driver' => 's3',
    'key' => env('AWS_ACCESS_KEY_ID'),
    'secret' => env('AWS_SECRET_ACCESS_KEY'),
    'region' => env('AWS_DEFAULT_REGION'),
    'bucket' => env('AWS_BUCKET'),
    'url' => env('AWS_URL'),
    'endpoint' => env('AWS_ENDPOINT'),
    'use_path_style_endpoint' => env('AWS_USE_PATH_STYLE_ENDPOINT', false),
]

And now you have to specify the "attach" method that will override the way to save the image. Do refer to the code example below for the whole example.

<?php

Trix::make(__('Body'), 'body')
    ->withFiles('s3')
    ->attach(function (NovaRequest $request) {
        $url = $request->file('attachment')->storePublicly('/your-subdirectory/');

        return Storage::url($url);
    })
    ->rules('required')

Or if you wanted to change the name or have a custom name then it will be like below.

<?php

Trix::make(__('Body'), 'body')->attach(function (NovaRequest $request) {
    // First do extract the file name and extension (the default file name is 'attachment')
    [$name, $extension] = explode('.', $request->file('attachment')->getClientOriginalName());

    // Generate the slug and concatenate it with the extension
    $filename = Str::slug($name) . '.' . $extension;

    // Store the file name in s3
    $request->file('attachment')->storePubliclyAs('/your-subdirectory/', $filename);

    // Return the url for the newly saved file
    return 'https://your-site.com/' . $filename;
}),