Forms: FileUpload - Image preview on subdomain

[camya]

Description

This PR for the FileUpload field adds support for image previews on subdomains.

In a multi-tenant application, tenants have their subdomains, e.g. "https://tenent1.site.test".
If a user on this subdomain uploads an image in a filament-form, the preview will not work because the URL from APP_URL is used, e.g. "https://www.site.test".

The method ->getUploadedFileUrlUsing(fn (string $file): string => url("/{$file}")) allows to set the current domain, instead of the one stored in APP_URL.

From the updated documentation: "Set a different base URL"

By default, uploaded files are served from the domain specified in the APP_URL set in your .env file. If your multitenant application uses subdomains, you can set the current subdomain URL using the `getUploadedFileUrlUsing' callback.

Filament\Forms\Components\FileUpload;

FileUpload::make('image')
    ->getUploadedFileUrlUsing(fn (string $file): string => url("/{$file}"))

To correctly preview images and other files, FilePond requires files to be served from the same domain as the app, or the appropriate CORS headers need to be present. If you're hosting files on a separate CDN domain like S3, ensure that CORS headers are set up.

Functional changes

• Code style has been fixed by running the composer cs command.
• Changes have been tested to not break existing functionality.
• Documentation is up-to-date.

[camya]

Maybe it's better to simplify it more to ->getUploadedFileDomainUsing(fn (): string => url('/'))

The filename is not needed here. What do you think?

[danharrin]

I think the current solution is good and changes are not necessary, thanks

[danharrin]

Before I merge this, I just wanted to check to see if there is an easier solution. You're using the public disk, right? Isn't it just easier to config()->set('filesystems.public.url', $tenantUrl), or set the entire app.url in middleware? Then we don't need to implement this in Filament @camya

[camya]

You're right. Your middleware idea works fine. You just missed the disc segment in the dot path. :)

Guess, this config()->set('filesystems.disks.public.url', url("/storage")); info should be added to the documentation too.

class SubdomainMiddleware
{
    public function handle(Request $request, Closure $next): Response
    {
        // Handle subdomain ...

        config()->set('filesystems.disks.public.url', url("/storage"));

        return $next($request);
    }
}

[danharrin]

To be honest, I disagree there, it's not really a concern of Filament how you have your filesystems set up, so I don't think it's our responsibility to document