CODEWITHSUNDEEP
supabasedenogetstream-chatdeno-deployedge-function
boeledi
boeledi

Reputation: 7567

GetStream with Supabase via Edge Function -- how to?

I need to write a Supabase Edge Function that interacts with GetStream. But as Supabase Edge Functions are running via Deno, I am importing the package via JS Deliver as follows:

import { StreamChat } from "https://cdn.jsdelivr.net/npm/stream-chat";

When I am serving the Edge Function locally, via the

supabase functions serve test_chat --debug

I get the following error:

error: TS2305 [ERROR]: Module '"https://cdn.jsdelivr.net/npm/stream-chat.js"' has no exported member 'StreamChat'.

revealing that it does not try to fetch "stream-chat" but "stream-chat .js", which does not exist.

Has anyone already found a solution to this?

Many thanks in advance,

Upvotes: 2

Views: 802

Answers (2)

Brian P.
Brian P.

Reputation: 1

I found a solution that worked for me. Step 1: upgrade your Supabase CLI to the latest version, e.g. brew upgrade supabase. v1.136.2 as of this writing.

Here's my working edge function:

import { StreamChat } from "npm:stream-chat";
import { createClient } from "https://esm.sh/@supabase/[email protected]";

const corsHeaders = {
  "Access-Control-Allow-Origin": "*",
  "Access-Control-Allow-Headers": "authorization, x-client-info, apikey, content-type"
};

const serverClient = StreamChat.getInstance(
  Deno.env.get("STREAM_KEY"),
  Deno.env.get("STREAM_SECRET")
);

Deno.serve(async (req: Request) => {
  // This is needed if you're planning to invoke your function from a browser.
  if (req.method === "OPTIONS") {
    return new Response("ok", { headers: corsHeaders });
  }

  try {
    // Create a Supabase client with the Auth context of the logged in user.
    const supabaseClient = createClient(
      Deno.env.get("SBASE_URL") ?? "",
      Deno.env.get("SBASE_ANON_KEY") ?? "",
      {
        global: {
          headers: { Authorization: req.headers.get("Authorization")! }
        }
      }
    );

    const { data } = await supabaseClient.auth.getUser();
    const userId = data.user.id;

    // Valid user ID check
    if (!userId) {
      throw new Error("User not found");
    }

    // Create a token using the userId
    try {
      const token = serverClient.createToken(userId);
      console.log("token:", token);

      // Respond with the created token
      return new Response(JSON.stringify({ token: token }), {
        status: 200,
        headers: {
          "Content-Type": "application/json"
        }
      });
    } catch (error) {
      return new Response(JSON.stringify({ error1: error.message }), {
        status: 500,
        headers: {
          "Content-Type": "application/json"
        }
      });
    }
  } catch (error) {
    return new Response(JSON.stringify({ error: error.message }), {
      headers: { ...corsHeaders, "Content-Type": "application/json" },
      status: 400
    });
  }
});

Upvotes: 0

Pedro Luz
Pedro Luz

Reputation: 2772

Usually with Deno, you should be able to use npm specifiers, where you prepend npm: to the package name, something like this:

import { StreamChat } from 'npm:[email protected]';

but this for some reason throws an error when you try to deploy. What I found that works is to use esm.sh.

import { StreamChat } from "https://esm.sh/[email protected]";

const client = StreamChat.getInstance('key', 'secret');

Upvotes: 0

Related Questions