Hosted Login (Authorization Code + PKCE)

import { AurisClient } from '@auris/js'
 
const auris = new AurisClient({
  domain: 'auth.yourdomain.com',
  clientId: 'your-client-id',
  redirectUri: 'http://localhost:3000/callback',
  // Optional: Refresh-Tokens über Sitzungen hinweg speichern
  autoRefresh: true,
})
 
// Login auslösen — leitet den Browser zur gehosteten Login-Seite weiter
await auris.loginWithRedirect()
 
// Auf deiner Callback-Seite (http://localhost:3000/callback)
// Einmalig aufrufen, wenn die Seite lädt
const result = await auris.handleRedirectCallback()
 
if (result.user) {
  console.log('Authentifiziert:', result.user)
  // result.user: { id, email, name, firstName, lastName, roles, ... }
}
 
// Authentifizierungsstatus prüfen
const isAuthenticated = await auris.isAuthenticated()
 
// Aktuellen Benutzer abrufen ohne Weiterleitung auszulösen
const user = await auris.getUser()
 
// Access Token abrufen (wird automatisch erneuert wenn abgelaufen, wenn autoRefresh: true)
const accessToken = await auris.getAccessToken()
 
// Abmelden
await auris.logout({ returnTo: 'http://localhost:3000' })

import { AurisProvider, useAuris } from '@auris/react'
 
// App-Root mit AurisProvider umhüllen
function App() {
  return (
    <AurisProvider
      domain="auth.yourdomain.com"
      clientId="your-client-id"
      redirectUri="http://localhost:3000/callback"
    >
      <MyApp />
    </AurisProvider>
  )
}
 
// Login-Button-Komponente
function LoginButton() {
  const { loginWithRedirect, logout, isAuthenticated, user, isLoading } = useAuris()
 
  if (isLoading) return <p>Lädt...</p>
 
  if (isAuthenticated) {
    return (
      <div>
        <p>Willkommen, {user.name}</p>
        <button onClick={() => logout({ returnTo: window.location.origin })}>
          Abmelden
        </button>
      </div>
    )
  }
 
  return <button onClick={loginWithRedirect}>Anmelden</button>
}
 
// Callback-Seite — verarbeitet die Weiterleitung von Auris zurück
// Platziere dies unter deinem redirectUri-Pfad
import { useEffect } from 'react'
import { useAuris } from '@auris/react'
import { useNavigate } from 'react-router-dom'
 
function CallbackPage() {
  const { handleRedirectCallback } = useAuris()
  const navigate = useNavigate()
 
  useEffect(() => {
    handleRedirectCallback().then(() => {
      navigate('/dashboard')
    })
  }, [])
 
  return <p>Anmeldung wird abgeschlossen...</p>
}
 
// AuthGuard — Routen schützen, die Authentifizierung erfordern
import { AuthGuard } from '@auris/react'
 
function ProtectedPage() {
  return (
    <AuthGuard>
      <h1>Diese Seite erfordert Authentifizierung</h1>
    </AuthGuard>
  )
}

// middleware.ts — Routen am Edge schützen
import { aurisMiddleware } from '@auris/nextjs/middleware'
 
export default aurisMiddleware({
  protectedPaths: ['/dashboard(.*)'],
  publicPaths: ['/', '/about', '/pricing'],
  loginUrl: '/auth/login',
})
 
export const config = {
  matcher: ['/((?!_next|api|favicon).*)'],
}
 
// app/layout.tsx — Auris-Kontext für Client-Komponenten bereitstellen
import { AurisProvider } from '@auris/nextjs'
 
export default function RootLayout({ children }: { children: React.ReactNode }) {
  return (
    <html>
      <body>
        <AurisProvider
          domain={process.env.NEXT_PUBLIC_AURIS_DOMAIN!}
          clientId={process.env.NEXT_PUBLIC_AURIS_CLIENT_ID!}
          redirectUri={`${process.env.NEXT_PUBLIC_APP_URL}/auth/callback`}
        >
          {children}
        </AurisProvider>
      </body>
    </html>
  )
}
 
// app/auth/login/page.tsx — Login-Weiterleitung initiieren
'use client'
import { useAuris } from '@auris/react'
import { useEffect } from 'react'
 
export default function LoginPage() {
  const { loginWithRedirect } = useAuris()
  useEffect(() => { loginWithRedirect() }, [])
  return <p>Weiterleitung zur Anmeldung...</p>
}
 
// app/auth/callback/page.tsx — Weiterleitung verarbeiten
'use client'
import { useAuris } from '@auris/react'
import { useRouter } from 'next/navigation'
import { useEffect } from 'react'
 
export default function CallbackPage() {
  const { handleRedirectCallback } = useAuris()
  const router = useRouter()
  useEffect(() => {
    handleRedirectCallback().then(() => router.push('/dashboard'))
  }, [])
  return <p>Anmeldung wird abgeschlossen...</p>
}
 
// app/dashboard/page.tsx — Server Component mit Sitzung
import { getSession } from '@auris/nextjs/server'
import { redirect } from 'next/navigation'
 
export default async function DashboardPage() {
  const session = await getSession()
  if (!session) redirect('/auth/login')
 
  return <h1>Willkommen, {session.user.name}</h1>
}
 
// API-Route — serverseitige Endpunkte schützen
import { withAuth } from '@auris/nextjs/server'
 
export const GET = withAuth(async (req, { session }) => {
  return Response.json({ userId: session.user.id })
})

<?php
use Auris\AurisClient;
use Auris\AurisConfig;
 
// composer require auris/sdk
require 'vendor/autoload.php';
 
$config = new AurisConfig(
    domain: 'auth.yourdomain.com',
    clientId: 'your-client-id',
    redirectUri: 'http://localhost:8000/callback.php'
);
$auris = new AurisClient($config);
 
// login.php — zum Hosted Login weiterleiten
session_start();
header('Location: ' . $auris->getLoginUrl());
exit;
 
// callback.php — Weiterleitung verarbeiten
session_start();
$result = $auris->handleCallback(
    code: $_GET['code'],
    state: $_GET['state']
);
$user = $result->getUser();
 
echo 'Willkommen, ' . htmlspecialchars($user->name);