2 replies

Convex Auth: Invalid key provided to SecureStore

Hi, I am facing a bug while using the otherwise great new Convex Auth library.
I have followed the setup instructions in https://labs.convex.dev/auth/setup#add-authentication-tables-to-your-schema for my React Native app, and while the signUp flow seems to work (a user document gets created in my database), I get the following error regarding the SecureStore in my frontend:

Error: Invalid key provided to SecureStore. Keys must not be empty and contain only alphanumeric characters, ".", "-" and "_".

Error: Invalid key provided to SecureStore. Keys must not be empty and contain only alphanumeric characters, ".", "-" and "_".

Error: Invalid key provided to SecureStore. Keys must not be empty and contain only alphanumeric characters, ".", "-" and "_".

Error: Invalid key provided to SecureStore. Keys must not be empty and contain only alphanumeric characters, ".", "-" and "_".

Since the library is handling setting and reading these keys, I find it hard to debug, and have not found a solution in the documentation, here, or online.

Here is my Convex provider:

import { ConvexAuthProvider } from '@convex-dev/auth/react';
import { ConvexReactClient } from 'convex/react';
import * as SecureStore from 'expo-secure-store';
const convex = new ConvexReactClient(process.env.EXPO_PUBLIC_CONVEX_URL);

const secureStorage = {
  getItem: SecureStore.getItemAsync,
  setItem: SecureStore.setItemAsync,
  removeItem: SecureStore.deleteItemAsync,
};

export default function ConvexClientProvider({ children }: { children: React.ReactNode }) {
  return (
    <ConvexAuthProvider storage={secureStorage} client={convex}>
      {children}
    </ConvexAuthProvider>
  );
}

import { ConvexAuthProvider } from '@convex-dev/auth/react';
import { ConvexReactClient } from 'convex/react';
import * as SecureStore from 'expo-secure-store';
const convex = new ConvexReactClient(process.env.EXPO_PUBLIC_CONVEX_URL);

const secureStorage = {
  getItem: SecureStore.getItemAsync,
  setItem: SecureStore.setItemAsync,
  removeItem: SecureStore.deleteItemAsync,
};

export default function ConvexClientProvider({ children }: { children: React.ReactNode }) {
  return (
    <ConvexAuthProvider storage={secureStorage} client={convex}>
      {children}
    </ConvexAuthProvider>
  );
}

import { ConvexAuthProvider } from '@convex-dev/auth/react';
import { ConvexReactClient } from 'convex/react';
import * as SecureStore from 'expo-secure-store';
const convex = new ConvexReactClient(process.env.EXPO_PUBLIC_CONVEX_URL);

const secureStorage = {
  getItem: SecureStore.getItemAsync,
  setItem: SecureStore.setItemAsync,
  removeItem: SecureStore.deleteItemAsync,
};

export default function ConvexClientProvider({ children }: { children: React.ReactNode }) {
  return (
    <ConvexAuthProvider storage={secureStorage} client={convex}>
      {children}
    </ConvexAuthProvider>
  );
}

import { ConvexAuthProvider } from '@convex-dev/auth/react';
import { ConvexReactClient } from 'convex/react';
import * as SecureStore from 'expo-secure-store';
const convex = new ConvexReactClient(process.env.EXPO_PUBLIC_CONVEX_URL);

const secureStorage = {
  getItem: SecureStore.getItemAsync,
  setItem: SecureStore.setItemAsync,
  removeItem: SecureStore.deleteItemAsync,
};

export default function ConvexClientProvider({ children }: { children: React.ReactNode }) {
  return (
    <ConvexAuthProvider storage={secureStorage} client={convex}>
      {children}
    </ConvexAuthProvider>
  );
}

Set Up Convex Auth - Convex Auth

Authentication library for your Convex backend

Convex Auth: Invalid key provided to SecureStore

Similar Threads

Similar Threads

Similar Threads