Strapi-provider-upload-supabase-4 NPM

Strapi Upload Provider for Supabase storage

This provider is a fork of shorwood's strapi upload provider digitalocean for Digital Ocean spaces, but applied to Supabase storage

Parameters

apiUrl : Supabase API Url
apiKey : Supabase API Key
bucket : Supabase storage bucket
directory : Directory inside Supabase storage bucket
options : Supabase client additional options

How to use

Install this package

npm i strapi-provider-upload-supabase-4

Create config in ./config/plugins.js with content

module.exports = ({ env }) => ({
  // ...
  upload: {
    config: {
      provider: "strapi-provider-upload-supabase-4",
      providerOptions: {
        apiUrl: env("SUPABASE_API_URL"),
        apiKey: env("SUPABASE_API_KEY"),
        bucket: env("SUPABASE_BUCKET"),
        directory: env("SUPABASE_DIRECTORY"),
        options: {},
      },
      actionOptions: {
        upload: {},
        uploadStream: {},
        delete: {},
      },
    },
  },
  // ...
});

Create .env and add to them

SUPABASE_API_URL="<Your Supabase url>"
SUPABASE_API_KEY="<Your Supabase api key>"
SUPABASE_BUCKET="strapi-uploads"
SUPABASE_DIRECTORY=""

Create middleware in ./config/middlewares.js with content

module.exports = ({ env }) => [
  "strapi::errors",
  {
    name: "strapi::security",
    config: {
      contentSecurityPolicy: {
        directives: {
          "default-src": ["'self'"],
          "img-src": ["'self'", "data:", "blob:", env("SUPABASE_API_URL")],
        },
      },
    },
  },
  "strapi::cors",
  "strapi::poweredBy",
  "strapi::logger",
  "strapi::query",
  "strapi::body",
  "strapi::session",
  "strapi::favicon",
  "strapi::public",
];

with values obtained from this page: