A modern web korszakban a jelszavak már nem elegendőek. Ezek az adatok megsértésének több mint 80% -ának gyökere, a phishing, az újrafelhasználás és a szörnyű bonyolultság szabályainak hatálya alá tartoznak. Passkeys are the future. A webes hitelesítésre épített passkeys ( ) és A készülék (iPhone, Android, Windows Hello, YubiKey) tárolja a privát kulcsot, míg a szerver csak a nyilvános kulcsot látja. WebAuthn FIDO2 Ebben az átfogó útmutatóban a A Symfony és a hivatalos Eltávolítjuk a jelszó fogalmát teljes egészében az alkalmazásunkból. Nincs visszalépés, nincs „jelszó visszaállítása” link. Csak tiszta, biztonságos, biometrikus háttérrel ellátott jelszavak. will build a 100% passwordless authentication system web-auth/webauthn-symfony-bundle Core Architecture és követelmények A Passkeys úgy működik, hogy egy megosztott titkot (jelszót) helyettesít egy nyilvános/magán kulcspárral.A privát kulcs soha nem hagyja el a felhasználó Apple készülékét (iPhone, Mac, iPad), és a nyilvános kulcs a Symfony kiszolgálón tárolódik. Műszaki Stack 
 
 
 
 
 PHP: 8.2 vagy magasabb (A legújabb WebAuthn libokhoz szükséges) Szimfónia: 7,4 LTS Adatbázis: PostgreSQL, MySQL vagy SQLite for dev (a hitelesítési források tárolására) Elsődleges könyvtár: web-auth/webauthn-symfony-bundle Alapvető csomagok Végezze el a következő parancsot a szükséges függőségek telepítéséhez: composer require web-auth/webauthn-symfony-bundle:^5.2 \
                 web-auth/webauthn-stimulus:^5.2 \
                 symfony/uid:^7.4
 Mi használjuk Az AssetMapper segítségével (amely kiváló csomagolási funkciókat biztosít a WebAuthn API-k számára a natív böngészőben), mivel az Apple Passkeys-nek olyan frontend interakcióra van szüksége, amelyet a legjobban egy modern Symfony környezetben, vagy használhatja a React/Vue modulokat. Kezdőlap / böngésző Stimulus controller Kezdőlap / böngésző Database Schema: A hitelesítő forrás Ez az, ahol az alkalmazásunk drasztikusan eltér a hagyományos Symfony alkalmazástól. A szabványos Symfony felhasználói entitások nem rendelkeznek Passkey metaadatok tárolására (például AAGUID-k vagy nyilvános kulcsú Cose algoritmusok). A felhasználói entitás A miénk Egységes megvalósítás A kiemelkedően hiányzó a . User Symfony\Component\Security\Core\User\UserInterface PasswordAuthenticatedUserInterface namespace App\Entity;

use App\Repository\UserRepository;
use Doctrine\ORM\Mapping as ORM;
use Symfony\Component\Security\Core\User\UserInterface;
use Symfony\Component\Uid\Uuid;
use Symfony\Component\Validator\Constraints as Assert;

#[ORM\Entity(repositoryClass: UserRepository::class)]
#[ORM\Table(name: '`user`')]
class User implements UserInterface
{
    #[ORM\Id]
    #[ORM\GeneratedValue]
    #[ORM\Column]
    private ?int $id = null;

    #[ORM\Column(length: 255, unique: true)]
    private ?string $userHandle = null;

    #[ORM\Column(length: 180, unique: true)]
    #[Assert\NotBlank]
    #[Assert\Email]
    private ?string $email = null;

    public function __construct()
    {
        $this->userHandle = Uuid::v4()->toRfc4122();
    }

    ...
}
 A PublicKeyCredentialSource entitás Egy felhasználónak több passkeye is lehet (például Face ID a telefonján, Touch ID a Macen, YubiKey a kulcsszálán). Szükségünk van egy entitásra, amely tárolja ezeket a nyilvános kulcsokat és azokhoz kapcsolódó metaadatokat. létrehozni Ennek az entitásnak képesnek kell lennie arra, hogy lefordítsa a köteg anyanyelvét a csomagba és onnan. Az objektum. src/Entity/PublicKeyCredentialSource.php Webauthn\PublicKeyCredentialSource Fontos, hogy megőrizzük a Ha ezt nem teszi meg, elpusztítja a szükséges igazolási adatokat, ha valaha is nagy biztonságú vállalati hardverkulcsokra van szüksége. TrustPath namespace App\Entity;

use App\Repository\PublicKeyCredentialSourceRepository;
use Doctrine\ORM\Mapping as ORM;
use Webauthn\PublicKeyCredentialSource as WebauthnSource;

#[ORM\Entity(repositoryClass: PublicKeyCredentialSourceRepository::class)]
#[ORM\Table(name: 'webauthn_credentials')]
class PublicKeyCredentialSource extends WebauthnSource
{
    #[ORM\Id]
    #[ORM\GeneratedValue]
    #[ORM\Column]
    private ?int $id = null;

    public function getId(): ?int
    {
        return $this->id;
    }
}
 A CredentialSourceRepository Szükséges továbbá a Ezeket a végrehajtásokat . CredentialSourceRepository Webauthn\Bundle\Repository\PublicKeyCredentialSourceRepository 
namespace App\Repository;

use App\Entity\PublicKeyCredentialSource;
use Doctrine\Bundle\DoctrineBundle\Repository\ServiceEntityRepository;
use Doctrine\Persistence\ManagerRegistry;
use Symfony\Component\ObjectMapper\ObjectMapperInterface;
use Webauthn\Bundle\Repository\PublicKeyCredentialSourceRepositoryInterface;
use Webauthn\Bundle\Repository\CanSaveCredentialSource;
use Webauthn\PublicKeyCredentialSource as WebauthnSource;
use Webauthn\PublicKeyCredentialUserEntity;

class PublicKeyCredentialSourceRepository extends ServiceEntityRepository implements PublicKeyCredentialSourceRepositoryInterface, CanSaveCredentialSource
{
    public function __construct(ManagerRegistry $registry, private readonly ObjectMapperInterface $objectMapper)
    {
        parent::__construct($registry, PublicKeyCredentialSource::class);
    }

    public function findOneByCredentialId(string $publicKeyCredentialId): ?WebauthnSource
    {
        return $this->findOneBy(['publicKeyCredentialId' => $publicKeyCredentialId]);
    }

    public function findAllForUserEntity(PublicKeyCredentialUserEntity $publicKeyCredentialUserEntity): array
    {
        return $this->findBy(['userHandle' => $publicKeyCredentialUserEntity->id]);
    }

    public function saveCredentialSource(WebauthnSource $publicKeyCredentialSource): void
    {
        $entity = $this->findOneBy(['publicKeyCredentialId' => base64_encode($publicKeyCredentialSource->publicKeyCredentialId)])
            ?? $this->objectMapper->map($publicKeyCredentialSource, PublicKeyCredentialSource::class);

        $this->getEntityManager()->persist($entity);
        $this->getEntityManager()->flush();
    }
}
 A WebAuthn köteg absztrakt interfészekre támaszkodik a felhasználók és hitelesítő adatok megtalálásához és megtartásához. Felhasználó Repository A UserRepository végrehajtja a PublicKeyCredentialUserEntityRepositoryInterface-t. Mivel azt szeretnénk, hogy a csomag automatikusan kezelje a felhasználói létrehozást egy passkey regisztráció során, mi is végrehajtjuk és . CanRegisterUserEntity CanGenerateUserEntity 
namespace App\Repository;

use App\Entity\User;
use Doctrine\Bundle\DoctrineBundle\Repository\ServiceEntityRepository;
use Doctrine\Persistence\ManagerRegistry;
use Symfony\Component\Uid\Uuid;
use Webauthn\Bundle\Repository\CanGenerateUserEntity;
use Webauthn\Bundle\Repository\CanRegisterUserEntity;
use Webauthn\Bundle\Repository\PublicKeyCredentialUserEntityRepositoryInterface;
use Webauthn\Exception\InvalidDataException;
use Webauthn\PublicKeyCredentialUserEntity;

class UserRepository extends ServiceEntityRepository implements PublicKeyCredentialUserEntityRepositoryInterface, CanRegisterUserEntity, CanGenerateUserEntity
{
    public function __construct(ManagerRegistry $registry)
    {
        parent::__construct($registry, User::class);
    }

    public function saveUserEntity(PublicKeyCredentialUserEntity $userEntity): void
    {
        $user = new User();
        $user->setEmail($userEntity->name);
        $user->setUserHandle($userEntity->id);

        $this->getEntityManager()->persist($user);
        $this->getEntityManager()->flush();
    }

    public function generateUserEntity(?string $username, ?string $displayName): PublicKeyCredentialUserEntity
    {
        return new PublicKeyCredentialUserEntity(
            $username ?? '',
            Uuid::v4()->toRfc4122(),
            $displayName ?? $username ?? ''
        );
    }

    ...
 Konfiguráció: Bridging Symfony és Apple Az Apple speciális Ez azonosítja az alkalmazást a felhasználó iCloud Keychain-jével. “Relying Party” (RP) WebAuthn konfiguráció Létrehozása vagy frissítése config/packages/webauthn.yaml: webauthn:
    allowed_origins: ['%env(WEBAUTHN_ALLOWED_ORIGINS)%']
    credential_repository: 'App\Repository\PublicKeyCredentialSourceRepository'
    user_repository: 'App\Repository\UserRepository'
    creation_profiles:
        default:
            rp:
                name: '%env(RELYING_PARTY_NAME)%'
                id: '%env(RELYING_PARTY_ID)%'
    request_profiles:
        default:
            rp_id: '%env(RELYING_PARTY_ID)%'
 A WebAuthn hihetetlenül szigorú a domainekkel kapcsolatban. Nem használható a Annak érdekében, hogy alkalmazásunk hordozható legyen a különböző környezetekben, a Reliance Party (RP) beállításainkat a A fájl. example.com phishing-example.com .env Nyitott és adjunk hozzá: .env or .env.local ###> web-auth/webauthn-symfony-bundle ###
RELYING_PARTY_ID=localhost
RELYING_PARTY_NAME="My Application"
WEBAUTHN_ALLOWED_ORIGINS=localhost
###< web-auth/webauthn-symfony-bundle ###
 A termelés során, meg kell, hogy legyen a pontos root domain (pl. ) és A . . RELYING_PARTY_ID example.com WebAuthn requires a secure HTTPS context Browsers only exempt localhost for development A regisztrációs folyamat (teremtés) Passkey regisztráció egy kétlépcsős kézfogás: 
 
 
 Kihívás: A kiszolgáló egyedi kihívást és „Létrehozási lehetőségeket” hoz létre. Bevallás: A böngésző (Safari/Chrome) megkérdezi a felhasználót a FaceID/TouchID, aláírja a kihívást, és visszaküldi a „Vallásobjektumot” a kiszolgálóra. A Frontend: Stimulus és CSRF A biztonság a legfontosabb, bár természetében ellenáll a phishingnek, a végpontok még mindig sérülékenyek a hagyományos Ha védekezés nélkül maradtunk, a Symfony beépített CSRF tokenjeit a fejléceken keresztül továbbítjuk . WebAuthn Cross-Site Request Forgery (CSRF) fetch() calls Feltételezve, hogy van egy szabvány segédeszközök (mint amely kivonja a tokent egy meta-címkéből vagy rejtett bemenetből), beadjuk a Passkey vezérlőbe. CSRF csrf_protection_controller.js import { Controller } from '@hotwired/stimulus';
import { startRegistration, startAuthentication } from '@simplewebauthn/browser';
import { generateCsrfHeaders } from './csrf_protection_controller.js';

export default class extends Controller {
    static values = {
        optionsUrl: String,
        resultUrl: String,
        isLogin: Boolean
    }

    connect() {
        console.log('Passkey controller connected! 🔑');
    }

    async submit(event) {
        event.preventDefault();
        
        const username = this.element.querySelector('[name="username"]')?.value;

        if (!this.isLoginValue && !username) {
            alert('Please provide a username/email');
            return;
        }

        const csrfHeaders = generateCsrfHeaders(this.element);

        try {
            // 1. Fetch options
            const response = await fetch(this.optionsUrlValue, {
                method: 'POST',
                headers: { 'Content-Type': 'application/json', ...csrfHeaders },
                body: username ? JSON.stringify({ username: username, displayName: username }) : '{}'
            });
            
            if (!response.ok) {
                const errorData = await response.json().catch(() => ({}));
                throw new Error(errorData.errorMessage || 'Failed to fetch WebAuthn options from server');
            }
            
            const options = await response.json();

            // 2. Trigger Apple's Passkey UI (Create or Get)
            let credential;
            if (this.isLoginValue) {
                credential = await startAuthentication({ optionsJSON: options });
            } else {
                credential = await startRegistration({ optionsJSON: options });
            }

            // 3. Send result back to verify
            const result = await fetch(this.resultUrlValue, {
                method: 'POST',
                headers: { 'Content-Type': 'application/json', ...csrfHeaders },
                body: JSON.stringify(credential)
            });

            if (result.ok) {
                window.location.reload();
            } else {
                const errorText = await result.text();
                alert('Authentication failed: ' + errorText);
            }
        } catch (e) {
            console.error(e);
            alert('WebAuthn process failed: ' + e.message);
        }
    }
}
 útvonal Meg kell határoznia a router típusát Létrehozni – létrehozni : webauthn config/routes/webauthn_routes.yaml webauthn_routes:
    resource: .
    type: webauthn
 Biztonsági csomag integráció lehetővé teszi a felhasználók számára, hogy a saját Ehhez konfigurálni kell a . Passkey Symfony Guard (now the Authenticator system) A config/packages/security.yaml alkalmazásban: security:
    providers:
        app_user_provider:
            entity:
                class: App\Entity\User
                property: email
    firewalls:
        dev:
            pattern: ^/(_(profiler|wdt)|css|images|js)/
            security: false
        main:
            lazy: true
            provider: app_user_provider

            webauthn:
                authentication:
                    routes:
                        options_path: /login/passkey/options
                        result_path: /login/passkey/result
                registration:
                    enabled: true
                    routes:
                        options_path: /register/passkey/options
                        result_path: /register/passkey/result
                success_handler: App\Security\AuthenticationSuccessHandler
                failure_handler: App\Security\AuthenticationFailureHandler

            logout:
                path: app_logout
    access_control:
        - { path: ^/dashboard, roles: ROLE_USER }
 A hitelesítési hiba kezelése Mert A szertartásokban szerepel A frontend kérései, a szabványos Symfony átirányítás sikertelenül (pl. megpróbál regisztrálni egy már létező e-mailt) a böngésző csendben lenyeli, ami frusztráló felhasználói élményt eredményez. WebAuthn AJAX fetch() Egy szokást alkalmazunk Visszatér a tiszta A kérés megválaszolása Ajax. AuthenticationFailureHandler 401 Unauthorized JSON létrehozni : src/Security/AuthenticationFailureHandler.php 
namespace App\Security;

use Symfony\Component\HttpFoundation\JsonResponse;
use Symfony\Component\HttpFoundation\RedirectResponse;
use Symfony\Component\HttpFoundation\Request;
use Symfony\Component\HttpFoundation\Response;
use Symfony\Component\Routing\Generator\UrlGeneratorInterface;
use Symfony\Component\Security\Core\Exception\AuthenticationException;
use Symfony\Component\Security\Http\Authentication\AuthenticationFailureHandlerInterface;
use Symfony\Component\Security\Http\SecurityRequestAttributes;

readonly class AuthenticationFailureHandler implements AuthenticationFailureHandlerInterface
{
    public function __construct(private UrlGeneratorInterface $urlGenerator) {}

    public function onAuthenticationFailure(Request $request, AuthenticationException $exception): RedirectResponse|JsonResponse
    {
        if ($request->getContentTypeFormat() === 'json' || $request->isXmlHttpRequest()) {
            return new JsonResponse([
                'status' => 'error',
                'errorMessage' => $exception->getMessageKey(),
            ], Response::HTTP_UNAUTHORIZED);
        }

        // Store the error in the session
        $request->getSession()->set(SecurityRequestAttributes::AUTHENTICATION_ERROR, $exception);

        return new RedirectResponse($this->urlGenerator->generate('app_login'));
    }
}
 A hitelesítés sikeres kezelése Mivel a Passkeys gyakran megkerüli a hagyományos bejelentkezési űrlapot, meg kell határoznia, hogy a felhasználó hol megy egy successful “Handshake.” 
namespace App\Security;

use Symfony\Component\HttpFoundation\RedirectResponse;
use Symfony\Component\HttpFoundation\Request;
use Symfony\Component\Routing\Generator\UrlGeneratorInterface;
use Symfony\Component\Security\Core\Authentication\Token\TokenInterface;
use Symfony\Component\Security\Http\Authentication\AuthenticationSuccessHandlerInterface;

readonly class AuthenticationSuccessHandler implements AuthenticationSuccessHandlerInterface
{
    public function __construct(private UrlGeneratorInterface $urlGenerator) {}

    public function onAuthenticationSuccess(Request $request, TokenInterface $token): RedirectResponse
    {
        return new RedirectResponse($this->urlGenerator->generate('app_dashboard'));
    }
}
 Ellenőrzés és Apple-specifikus Gotchas 
 
 
 
 A HTTPS kötelező: A böngészők nem fogják feltárni a navigator.credentials-t a nem biztonságos eredeteken (kivéve a localhostot). RP ID Match: Győződjön meg róla, hogy a webauthn.yaml azonosítója pontosan megfelel az Ön tartományának. Ha a dev.example.com oldalon tartózkodik, az Ön RP azonosítójának az example.com-nak kell lennie. Apple AAGUID: Az Apple-eszközök gyakran „Zero AAGUID” (minden nulla) értéket adnak vissza. Ha a könyvtár úgy van beállítva, hogy szigorúan érvényesítse a hitelesítőket metaadatokon keresztül, előfordulhat, hogy engedélyezni kell az „Ismeretlen hitelesítőket” a konfigurációban. következtetés Az Apple Passkeys alkalmazásra való áttérés a Symfony 7.4 alkalmazással nem csupán biztonsági frissítés, hanem a felhasználói élmény jelentős javulása. az , Az összetett karakterkövetelmények növelik a konverziót és a felhasználói megtartást. password managers “forgot password” emails, Mint vezető fejlesztő vagy vezető, a prioritás az, hogy ez a végrehajtás fenntartható maradjon. és a PHP 8.x attribútumai biztosítják, hogy a kódbázis idiomatikus maradjon és készen álljon a Symfony LTS jövőbeli kiadásaira. WebAuthn-Symfony-Bundle Összefoglaló ellenőrzőlista a telepítéshez 
 
 
 
 
 SSL/TLS: Győződjön meg róla, hogy a termelési környezet érvényes tanúsítványt használ (a Passkeys egyszerű HTTP-n nem fog működni). RP ID stratégia: Döntse el, hogy támogatni szeretné-e az al-domainokat azáltal, hogy a Relaying Party ID-t a legfelső szintű tartományra állítja. Biztonsági mentési módszerek: Mindig biztosítson másodlagos bejelentkezési módot (például mágikus linkeket vagy hagyományos jelszót) a régebbi eszközökön lévő felhasználók számára, amelyek nem támogatják a FIDO2-t. Metadatok érvényesítése: Magas szintű biztonsági alkalmazások esetén fontolja meg a web-auth/webauthn-metadat-szolgáltatás engedélyezését annak ellenőrzésére, hogy a Passkey valóban egy Apple-eszközről származik, és nem egy jogosulatlan emulátorról. A teljes megvalósítás és a projekt előrehaladása megtalálható a GitHub-on: [ ] Source Code: https://github.com/mattleads/PasskeysAuth https://github.com/mattleads/PasskeysAuth Lássuk a kapcsolatot! Ha ezt hasznosnak találod, vagy kérdésed van a megvalósítással kapcsolatban, szeretném hallani tőled. Maradjunk kapcsolatban, és tartsuk a beszélgetést ezeken a platformokon: 
 
 
 
 
 Linkedin: [https://www.linkedin.com/in/matthew-mochalkin/] Székesfehérvár (Twitter): [https://x.com/MattLeads] Telegrám: [https://t.me/MattLeads] GitHub: [https://github.com/mattleads] https://www.linkedin.com/in/matthew-mochalkin/ https://x.com/MattLeads https://t.me/MattLeads https://github.com/mattleads

Read My Stories

Ez a hanganyag a történet eredeti nyelvén készült!

Passkeys a Szimfóniában 7.4: Hogyan építsünk egy teljesen jelszómentes jövőt

About Author

HOZZÁSZÓLÁSOK

HANG TAGOK

EZT A CIKKET BEMUTATTA

Related Stories

THE LAST DAY OF NEW YORK

INTRODUCTION

The Little Shop at Fishbourne

On OpenAI Failed Board Coup of Sam Altman & the Danger of Leaving AI Fate in the Hands of a Few

THE LAST DAY OF NEW YORK

INTRODUCTION

The Little Shop at Fishbourne

On OpenAI Failed Board Coup of Sam Altman & the Danger of Leaving AI Fate in the Hands of a Few

Light-Mode

Classic

Newspaper

Minty

Dark-Mode

Neon Noir

Minty

HN StartUps