OAuth2 Token SSR

Hello,

I’m currently trying to implement OAuth2 for my Nuxt 3 (v3.0.0) application. I’m able to request a valid token, login goes through and everything is set properly in the localStorage. Once I refresh the site the localStorage will be cleared {"token":"","model":null}.

I’m using the provided example https://github.com/pocketbase/js-sdk#ssr-integration

Any idea how to prevent it from clearing on a refresh?

Many thanks!

[ganigeorgiev]

@Ponkhy I’m not able to reproduce the issue. Just tested your code with a new nuxt3 project (aka. npx nuxi init myapp) and it woks fine and the correct cookie is set both client and server side.

Are you authenticating as app user or admin? If the latter then it is possible that the authRefresh call will fail, since it is for the users collection only.

[Ponkhy]

I’ve modified now the Nuxt plugin and it seems to hold the token and user infos even after refreshing. Do you @ganigeorgiev think this is a good practice?

import PocketBase from 'pocketbase';

export default defineNuxtPlugin(async (nuxtApp) => {
  const config = useRuntimeConfig()
  const authCookie = useCookie('pocketbase_auth', { httpOnly: false });

  const pb = new PocketBase(config.public.pocketbase);

  pb.authStore.loadFromCookie(authCookie.value || '');

  pb.authStore.onChange(() => {
    authCookie.value = pb.authStore.exportToCookie({ httpOnly: false });
  });

  try {
    pb.authStore.isValid && await pb.collection('users').authRefresh();
  } catch (_) {
    pb.authStore.clear();
  }

  return {
    provide: { pb }
  }
});