Tricks

Using Digital Ocean Spaces with Filament

Jun 19, 2022
Jeff Greco
Form builder, Admin panel, Integration

This quick tutorial will help you use Filament with Digital Ocean Spaces.

Start by creating a new Space, or you can use an existing one if one is already configured. Next, go to the Settings tab for your Space and locate the CORS Configurations section. Click to add a new configuration and remove the restrictions:

  • Origin: *
  • Allowed Headers: *
  • Allowed Methods: select only those you will need, or select all

Next, go to the Applications & API page and scroll to the Spaces access keys section. Generate a new key, then copy the Key and Secret.

Now, let's configure Laravel and Filament.

Laravel 8+ comes with AWS s3 driver support out of the box, but if you do not have the driver install it with composer:

composer require league/flysystem-aws-s3-v3:^1.0

Next, open your config/filesystems.php file and create a new disk:

"digitalocean" => [
"driver" => "s3",
"key" => [KEY],
"secret" => [SECRET],
"endpoint" => "https://[REGION].digitaloceanspaces.com",
"region" => "[REGION]",
"bucket" => "[NAME]", //
"root" => "[FOLDER]", // optional
"url" => "[EDGE OR CDN ENDPOINT]", // ex: https://[NAME].[REGION].cdn.digitaloceanspaces.com, or https://cdn.yourdomain.com if you setup a custom subdomain
"visibility" => "public", // set visibility to private or public
],

To set digitalocean as the default disk for your application, update your env file:

FILESYSTEM_DRIVER=digitalocean
FILAMENT_FILESYSTEM_DRIVER=digitalocean

Et voila!

No comments yet…