Self-Host Maps on Supabase Storage with Protomaps
Create a static PMTiles Map file
Follow the instructions in the Protomaps docs to extract a my_area.pmtiles
file.
Upload to Supabase Storage
- Create a new private bucket called
maps-private
. - Upload your
my_area.pmtiles
file there.
Take note of the file size limits depending on your project tier.
Proxy through Edge Functions
You can use Supabase Edge Functions to set up fine grained access controls. Use the /supabase/functions/maps-private/index.ts.
You can also use Edge Functions with Supabase Auth JWTs to only render Maps for authenticated users for example. Read the docs.
- Deploy the function to your Supabase project:
supabase functions deploy maps-private --no-verify-jwt
. - Update the
protomaps.url
in the index.html file.
Start simple web server
You can use python to serve the index.html
file:
python3 -m http.server
Now navigate to http://localhost:8000/ to see your beauiful Map!