Solid quickstart

The @authdog/solid SDK adds browser authentication state to SolidJS through a provider and reactive primitives. It has no server entry point.

@authdog/solid is not yet published to npm (npm view @authdog/solid returns 404 at the time of writing). Version 0.1.0 is set to publish publicly from the web-sdk repository, so install it from there until it lands on the registry.

Install

npm install @authdog/solid
solid-js

yarn add @authdog/solid
solid-js

pnpm add @authdog/solid
solid-js

bun add @authdog/solid
solid-js

deno add npm:@authdog/solid
solid-js

solid-js ^1.8 is a peer dependency. Use your environment's public key (pk_...); it is safe to expose to the browser.

Wrap your app

Every primitive reads from AuthdogProvider, so mount it at the root. The provider validates the public key once and throws immediately if it is malformed or points at an untrusted identity host:

import { AuthdogProvider } from "@authdog/solid"

export default function App() {
  return (
    <AuthdogProvider publicKey={import.meta.env.VITE_AUTHDOG_PUBLIC_KEY}>
      <Content />
    </AuthdogProvider>
  )
}

On mount (browser only) the provider accepts a ?token= only when it has three JWT-shaped segments, stores it in localStorage, strips it from the URL, and reloads. A value that is not JWT-shaped is stripped and discarded. This check is not signature, issuer, audience, or expiry validation. Otherwise the provider hydrates the token from localStorage.

Primitives

Primitives return Solid accessors, so call them (isAuthenticated()). Each throws if used outside AuthdogProvider.

load() calls the OIDC userinfo endpoint with the stored token and never throws. It resolves to null and sets error on failure. signIn and signUp redirect the browser to the OIDC authorize flow (sign-up adds prompt=signup); redirectUri defaults to window.location.origin. The public key comes from the provider, so you do not pass it.

import { Show } from "solid-js"
import { useSession, useUser, useSignIn, useSignOut } from "@authdog/solid"

function Content() {
  const { isAuthenticated } = useSession()
  const { user, load } = useUser()
  const { signIn } = useSignIn()
  const { signOut } = useSignOut()

  return (
    <Show
      when={isAuthenticated()}
      fallback={<button onClick={() => signIn()}>Sign in</button>}
    >
      <button onClick={() => load()}>Load profile</button>
      <button onClick={() => signOut("/")}>Sign out</button>
      <pre>{JSON.stringify(user(), null, 2)}</pre>
    </Show>
  )
}

Sign out

signOut(redirectTo?) clears the token from state and localStorage, and navigates to redirectTo if given. There is no server cookie to clear.

Caveats

• isAuthenticated() reflects token presence only. It is a UI hint, not validation.
• The token lives in localStorage, and the SDK sends it only to the trusted https: identity host.
• The package exposes no server helpers. Validate the bearer token with a backend SDK and enforce authorization on every protected operation server-side.

Next steps

• Sign up & sign in: the flows the provider drives.
• Backend requests: validate sessions on your API.