Social Login

Auris supporta l’autenticazione social con i provider più diffusi. Gli utenti possono accedere con il proprio account preferito senza dover creare una nuova password.

Provider supportati: Google, GitHub, Microsoft, Apple, Facebook, Discord, LinkedIn, Twitter/X, Slack

Configurazione nella Console

Istruzioni per Provider

Google

1. Vai su Google Cloud Console  → API e Servizi → Credenziali
2. Crea credenziali ID client OAuth 2.0 (tipo: Applicazione Web)
3. Aggiungi l’URI di redirect autorizzato: https://auth.tuodominio.com/api/auth/social/google/callback
4. Copia il Client ID e il Client Secret

GitHub

1. Vai su GitHub → Impostazioni → Impostazioni sviluppatore → OAuth Apps → Nuova OAuth App
2. Imposta Homepage URL: https://tuaapp.com
3. Imposta Authorization callback URL: https://auth.tuodominio.com/api/auth/social/github/callback
4. Copia il Client ID e genera un Client Secret

Microsoft (Azure AD)

1. Vai su Azure Portal → Azure Active Directory → Registrazioni app → Nuova registrazione
2. Imposta l’URI di reindirizzamento: https://auth.tuodominio.com/api/auth/social/microsoft/callback
3. Crea un Segreto client sotto Certificati e segreti
4. Copia l’ID applicazione (client) e il segreto

Apple

1. Vai su Apple Developer → Certificates, Identifiers & Profiles → Identifiers
2. Registra un Services ID per il tuo dominio app
3. Abilita Sign in with Apple e configura l’URL di ritorno: https://auth.tuodominio.com/api/auth/social/apple/callback
4. Crea una Key con Sign in with Apple abilitato e scarica il file .p8
5. Nella Console Auris, inserisci: Team ID, Services ID (Client ID), Key ID e il contenuto del file .p8

Facebook

1. Vai su Meta for Developers  → Le mie App → Crea App
2. Aggiungi il prodotto Facebook Login
3. Sotto Impostazioni → Valid OAuth Redirect URIs: https://auth.tuodominio.com/api/auth/social/facebook/callback
4. Copia App ID e App Secret da Impostazioni → Base

Discord

1. Vai su Discord Developer Portal  → Nuova Applicazione
2. Vai su OAuth2 → Redirect e aggiungi: https://auth.tuodominio.com/api/auth/social/discord/callback
3. Copia Client ID e Client Secret dalla scheda OAuth2 → General

LinkedIn

1. Vai su LinkedIn Developers  → Crea App
2. Sotto Auth aggiungi l’URL di redirect: https://auth.tuodominio.com/api/auth/social/linkedin/callback
3. Assicurati che r_liteprofile e r_emailaddress siano tra i permessi richiesti
4. Copia Client ID e Client Secret

Twitter / X

1. Vai su developer.twitter.com  → Projects & Apps → Nuova App
2. Abilita OAuth 2.0 nelle impostazioni dell’app
3. Aggiungi l’URL di callback: https://auth.tuodominio.com/api/auth/social/twitter/callback
4. Copia Client ID e Client Secret

Slack

1. Vai su api.slack.com/apps  → Crea Nuova App → Da zero
2. Sotto OAuth & Permissions → Redirect URLs aggiungi: https://auth.tuodominio.com/api/auth/social/slack/callback
3. Aggiungi le scope OAuth: openid, profile, email
4. Copia Client ID e Client Secret da Informazioni Base

Utilizzo con l’SDK

import { AurisClient } from '@auris/js'
 
const auris = new AurisClient({
  domain: 'auth.tuodominio.com',
  clientId: 'il-tuo-client-id',
})
 
// Login diretto con un provider specifico
document.getElementById('google-btn').addEventListener('click', () => {
  auris.loginWithRedirect({ connection: 'google' })
})
 
document.getElementById('github-btn').addEventListener('click', () => {
  auris.loginWithRedirect({ connection: 'github' })
})

import { useAuris } from '@auris/react'
 
function LoginPage() {
  const { loginWithRedirect } = useAuris()
 
  return (
    <div>
      <button onClick={() => loginWithRedirect({ connection: 'google' })}>
        Accedi con Google
      </button>
      <button onClick={() => loginWithRedirect({ connection: 'github' })}>
        Accedi con GitHub
      </button>
      <button onClick={() => loginWithRedirect({ connection: 'microsoft' })}>
        Accedi con Microsoft
      </button>
    </div>
  )
}

// components/SocialLoginButtons.tsx
'use client'
 
export function SocialLoginButtons() {
  const providers = [
    { id: 'google', label: 'Google' },
    { id: 'github', label: 'GitHub' },
    { id: 'microsoft', label: 'Microsoft' },
  ]
 
  return (
    <div>
      {providers.map(p => (
        <a key={p.id} href={`/api/auth/login?connection=${p.id}`}>
          Accedi con {p.label}
        </a>
      ))}
    </div>
  )
}

Collegamento degli Account

Quando un utente tenta di accedere con un provider social usando un’email già registrata con un metodo diverso, Auris può:

• Collegare automaticamente: Unisce gli account in automatico (abilitato per default)
• Richiedere conferma: Mostra all’utente un prompt per confermare il collegamento
• Bloccare: Restituisce un errore e richiede l’accesso con il metodo originale

Configura questo comportamento su Console → Impostazioni → Sicurezza → Collegamento Account.

Dati del Profilo Utente

Auris normalizza i dati del profilo social in un formato standard. La disponibilità dipende dal provider e dai permessi concessi dall’utente:

* Apple può fornire un’email privata relay
** Apple fornisce il nome solo al primo login

Integrazione con la Hosted Login Page

Se usi la Hosted Login Page di Auris, i pulsanti di social login vengono mostrati automaticamente per ogni connessione social abilitata. Non è necessaria nessuna configurazione aggiuntiva. Puoi controllare l’ordinamento e l’aspetto visivo dei pulsanti su Console → Impostazioni → Branding → Hosted Login Page.

Guide Correlate

• Login Ospitato (PKCE) — Flusso di autenticazione standard
• Enterprise SSO — SAML e OIDC per organizzazioni aziendali
• Collegamento Account — Come Auris gestisce le sessioni multi-provider