Storage gets cleared everyday with persistant storage using custom storage class (Angular)

[kewur]

Bug report

• [X] I confirm this is a bug with Supabase, not with my own application.
• [X] I confirm I have searched the Docs, GitHub Discussions, and Discord.

Describe the bug

We are using Angular SSR alongside supabseJs for authentication. This works fine using cookie storage. However, the next day the users are required to log back in again as the storage is disregarded. This logic works fine if we don't use SSR and just go with the default implementation of supabasejs.

On a similar but unrelated note, setting a custom key also breaks authentication for us, so we use it without a custom key, idk how related that is to the issue, but thought it might be helpful.

To Reproduce

Steps to reproduce the behavior, please provide code snippets or a repository:

create a new angular project, use this service for supabase

import { Injectable } from '@angular/core';
import { SsrCookieService } from 'ngx-cookie-service-ssr';
import { SupportedStorage } from '@supabase/supabase-js';

// noinspection JSUnusedGlobalSymbols
@Injectable({
  providedIn: 'root',
})
export class SupabaseStorageService implements SupportedStorage {
  constructor(private readonly cookieService: SsrCookieService) {}

  getItem(key: string): string | Promise<string | null> | null {
    return this.cookieService.get(key);
  }

  setItem(key: string, value: string): void | Promise<void> {
    this.cookieService.set(key, value);
  }

  removeItem(key: string): void | Promise<void> {
    this.cookieService.delete(key);
  }
}

initialize by adding this service.

import { Injectable } from '@angular/core';
import {
  AuthChangeEvent,
  AuthSession,
  createClient,
  Session,
  SupabaseClient,
  User,
} from '@supabase/supabase-js';
import { SupabaseStorageService } from './auth/supabase-storage.service';

@Injectable({
  providedIn: 'root',
})
export class AuthService {
  private readonly supabase: SupabaseClient;

  constructor(
    private readonly supabaseStorage: SupabaseStorageService
  ) {
    this.supabase = this.initializeSupabase();
  }

  private initializeSupabase(): SupabaseClient {
    return createClient(environment.supabaseUrl, environment.supabaseKey, {
      auth: {
        persistSession: true,
        autoRefreshToken: true,
        // if you set the storage key, ssr login will not work
        storage: this.supabaseStorage,
      },
    });
  }

  authChanges(callback: (event: AuthChangeEvent, session: Session | null) => void) {
    return this.supabase.auth.onAuthStateChange(callback);
  }

  signIn(email: string, password: string) {
    return this.supabase.auth.signInWithPassword({ email, password });
  }

  session() {
    return this.supabase.auth.getSession();
  }

  signOut() {
    return this.supabase.auth.signOut();
  }

  signUp(displayName: string, email: string, password: string) {
    return this.supabase.auth.signUp({
      email,
      password,
      options: {
        data: { 'display_name': displayName },
        emailRedirectTo: environment.redirectSignUp,
      },
    });
  }

  sendResetPasswordRequest(email: string) {
    const redirectTo = `${window.location.origin}/reset-password`;
    return this.supabase.auth.resetPasswordForEmail(email, {
      redirectTo: redirectTo,
    });
  }

  reinitialize() {
    return this.supabase.auth.initialize();
  }

  verifyToken(token: string) {
    return this.supabase.auth.exchangeCodeForSession(token);
  }

  async changeDisplayName(displayName: string) {
    return this.supabase.auth.updateUser({ data: { 'display_name': displayName } });
  }

  changePassword(newPassword: string) {
    return this.supabase.auth.updateUser({ password: newPassword });
  }
}

install the package

npm install ngx-cookie-service-ssr

Expected behavior

Users does not get logged out after a day

System information

• OS: Debian 11
• Browser Firefox
• Version of supabase-js:
• "@supabase/ssr": "^0.5.2", "@supabase/supabase-js": "^2.46.2",
• Version of Node.js: v18.19.1