Code in

Vue and Nuxt (JavaScript and TypeScript)

Melden Sie sich an, um Ihre eigene Test-Client-ID in den Beispielen zu sehen.

Coming soon. @aton-network/sdk is not published on npm yet, so the install line on this page does not work until it is. Until then, everything works over plain HTTP: pick cURL in any code block, or start from Endpoints.

@aton-network/vue brings Sign in with Atheron to Vue 3 and Nuxt: a plugin, a useAtheron() composable, the <AtheronSignInButton> component, and @aton-network/vue/nuxt for Nuxt's server routes.

Install

Set these on your server (never in code): ATHERON_CLIENT_ID, ATHERON_CLIENT_SECRET (server apps), ATHERON_REDIRECT_URI (the callback address you registered, such as https://your.app/auth/callback) and ATHERON_SECRET (32 or more random characters for sealing cookies: openssl rand -base64 32).

bash

npm install @aton-network/vue

Nuxt: the server routes

Dieses Beispiel gibt es noch nicht in cURL. Gezeigt in Next.js.

// app/auth/[...atheron]/route.ts: every Sign in with Atheron route in one file.
// Set ATHERON_CLIENT_ID, ATHERON_CLIENT_SECRET, ATHERON_SECRET and
// ATHERON_REDIRECT_URI=https://your.app/auth/callback (the address you registered).
import { Atheron } from "@aton-network/nextjs";

const atheron = Atheron();

export const { GET, POST } = atheron.handlers;

Vue: the plugin and the person

Dieses Beispiel gibt es noch nicht in cURL. Gezeigt in Next.js.

// proxy.ts (middleware.ts before Next 16): anybody not signed in goes to Atheron first, then back.
import { Atheron } from "@aton-network/nextjs";

const atheron = Atheron({ protect: ["/account", "/settings"] });

export async function proxy(request: Request): Promise<Response | undefined> {
  return atheron.proxy(request);
}

// In a server component, read the person with: await atheron.user(await cookies())

How it keeps you safe

PKCE (S256), state and nonce on every sign-in, checked in that order when the browser comes back.
The flow and the session live in HTTP-only cookies sealed with AES-256-GCM, so the browser carries them but cannot read or change them. Tokens never reach your page's JavaScript.
Sign-out is a POST from your own site only, and revokes the refresh token at Atheron.
A return address is always a path on your own site.

The same rules hold in every Atheron SDK: they all run one set of conformance tests.

Fragen Sie Atlas

KI-Assistent

Fragen Sie alles zu Mit Atheron anmelden, zur API oder zum Portal. Die Antwort kommt aus unserer Dokumentation, mit Links zu den genutzten Seiten.