Published on

Download and Parse Supabase File as JSON Object in JavaScript

Authors

Supabase provides a lot of features like database, file storage, auth, etc to build apps faster without having to worry about managing them.

Similar to that of AWS S3, you can also store and retrieve files using Supabase Storage (and they provide an awesome dashboard to manage them as well)

Let's see how to download and use a JSON file from Supabase and parse it as a JSON Object in JavaScript.

Dependency

npm install @supabase/supabase-js

And get the values for SUPABASE_URL and SUPABASE_PRIVATE_KEY from the Supabase dashboard as well.

// supabaseAdminClient.js
import { createClient } from '@supabase/supabase-js';

const SUPABASE_URL = process.env.SUPABASE_URL;
const SUPABASE_PRIVATE_KEY = process.env.SUPABASE_PRIVATE_KEY;

const supabaseAdmin = createClient(SUPABASE_URL, SUPABASE_PRIVATE_KEY);

export default supabaseAdmin;

Downloading and Parsing JSON file

const { data, error } = await supabaseAdmin.storage
  .from("example_bucket_name")
  .download(`example_file_name.json`);

if (error) {
  console.error(error);
} else if (data) {
  const arrayBuffer = await data.arrayBuffer();
  const jsonString = new TextDecoder("utf-8").decode(arrayBuffer);
  const jsonObject = JSON.parse(jsonString);
}

We convert the arrayBuffer to jsonString using TextDecoder

That's it.

It'll download the file and then parse it as JSON Object.

Happy parsing files!