
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 U   ove serije istražili smo "sveti gral" moderne autentifikacije: 100% aplikaciju bez lozinki. Uklonili smo lozinke, hasheve i e-poruke za poništavanje lozinke, zamjenjujući ih kriptografskom elegancijom WebAuthn API-ja. 1. dijelu Ali stvarni svijet rijetko je tako čist. Imate postojeće korisnike koji više vjeruju svojim upraviteljima lozinki nego svojoj biometriji. Imate korporativna okruženja gdje sigurnosni ključevi još nisu standard. Najvažnije, imate "Prijelazno razdoblje" — tu neugodnu fazu u kojoj morate podržavati staro, a istovremeno agresivno promicati novo. Danas gradimo hibridni model. Stvorit ćemo jedinstveni, inteligentni obrazac za prijavu koji automatski otkriva ima li korisnik Passkey, pokreće biometriju ako je dostupna, ali se elegantno vraća na tradicionalnu lozinku kada je to potrebno. Također ćemo pogledati Uvjetno posredovanje (Passkey automatsko popunjavanje) — "čarobni" UX koji omogućuje korisniku da se prijavi jednostavnim fokusiranjem polja za unos. Tehnološki Stack Da biste slijedili ovaj vodič, trebat će vam: 
 
 
 
 
  Iskorištavanje readonly klasa i promocije konstruktora. PHP 8.2+:  Korištenje najnovijih poboljšanja Komponente za sigurnost. Symfony 7.4: : Industrijski standard za WebAuthn u Symfonyju. web-auth/webauthn-symfony-bundle  Za frontend iskustvo bez Node.js. Stimulus & AssetMapper: Remek-djelo UX-a: Kako to funkcionira Umjesto zbunjivanja korisnika s dva odvojena gumba za prijavu ("Prijavi se lozinkom" vs "Prijavi se Passkeyjem"), predstavljamo im jedan, elegantan unos: Njihovu e-mail adresu. 
 
 
 
 
 Korisnik unese svoju e-poštu i klikne "Nastavi". Iza kulisa, naš Symfony 7.4 backend obavlja munjevitu provjeru.  Trenutačno pokrećemo izvorni WebAuthn biometrijski upit (FaceID, TouchID, Windows Hello). Ako korisnik ima registrirani Passkey:  Obrazac se elegantno proširuje kako bi otkrio polje za unos tradicionalne lozinke. Ako se korisnik oslanja na lozinku: Ovo je točan protok koji koriste tehnološki divovi poput   i   a danas ga gradimo u potpunosti sa standardnim Symfony alatima! Googlea GitHub-a, Domenski model: Premošćivanje dva svijeta U našoj  , naš entitet Korisnik nije ni imao polje za lozinku. Da bismo podržali hibridni protok, moramo ga ponovno uvesti, ali kao opcionalni vjerodajnicu. To omogućuje slojeviti sigurnosni model: korisnik može početi s jednostavnom lozinkom i kasnije "nadograditi" svoj račun registriranjem Passkeyja, koji na kraju postaje njihov primarni (i najsigurniji) način prijave. prethodnoj postavi potpuno bez lozinki Implementacijom   uz zadržavanje polja za lozinku kao nullable, zadovoljavamo sigurnosne zahtjeve Symfonyja za tradicionalnu prijavu, a da ne prisiljavamo svakog korisnika da ima naslijeđenu vjerodajnicu. Ovaj arhitekturni izbor ključan je za održavanje unazadne kompatibilnosti, istovremeno jasno signalizirajući da su Passkeys budućnost primjeren standard za aplikaciju. PasswordAuthenticatedUserInterface // src/Entity/User.php
namespace App\Entity;

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

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

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

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

    #[ORM\Column(type: 'string', length: 255, nullable: true)]
    private ?string $password = null;

    public function __construct()
    {
        // WebAuthn requires a persistent, non-identifying handle
        $this->userHandle = Uuid::v4()->toRfc4122();
    }

    // ... standard getters/setters

    public function getPassword(): ?string
    {
        return $this->password;
    }

    public function setPassword(?string $password): static
    {
        $this->password = $password;
        return $this;
    }

    public function eraseCredentials(): void
    {
        // Clear temporary sensitive data
    }

    public function getUserIdentifier(): string
    {
        return (string) $this->email;
    }
}
 Arhitektura izbora: Detekcija protoka Srž izvrsnog hibridnog UX-a je Detekcija protoka. Ne želimo prikazati dva obrasca. Želimo jedan unos: "Unesite svoju e-poštu." Kada korisnik klikne "Nastavi", naš Stimulus kontroler poziva laganu API točku kako bi odlučio o sljedećem potezu. Ovo sprječava "zamor polja lozinke" gdje se korisnici suočavaju sa složenim obrascem prije nego što su se uopće identificirali. Važno je da je ova točka dizajnirana s "sigurnošću kroz dvosmislenost" na umu. Ako e-pošta nije pronađena, zadani odgovor je protok lozinke. Ovo sprječava zlonamjerne aktere da koriste API za provjeru koje su e-pošte registrirane u našem sustavu (enumeracija korisnika), a istovremeno nam omogućuje pružanje prilagođenog, progresivnog korisničkog sučelja za naše legitimne korisnike. API protoka // src/Controller/AuthController.php
namespace App\Controller;

use App\Repository\UserRepository;
use App\Repository\PublicKeyCredentialSourceRepository;
use Symfony\Component\HttpFoundation\JsonResponse;
use Symfony\Component\HttpFoundation\Request;
use Symfony\Component\Routing\Attribute\Route;

class AuthController extends AbstractController
{
    #[Route('/api/auth/flow', name: 'app_api_auth_flow', methods: ['GET'])]
    public function apiAuthFlow(
        Request $request, 
        UserRepository $userRepo, 
        PublicKeyCredentialSourceRepository $credsRepo
    ): JsonResponse {
        $email = $request->query->get('email');
        $user = $userRepo->findOneBy(['email' => $email]);

        if (!$user) {
            // Treat non-existent users as password users to prevent enumeration
            return new JsonResponse(['flow' => 'password']);
        }

        $hasPasskeys = count($credsRepo->findAllForUserEntity($user->toWebauthnUser())) > 0;

        return new JsonResponse([
            'flow' => $hasPasskeys ? 'passkey' : 'password'
        ]);
    }
}
 Sigurnosni čuvar: HybridAuthenticator Dok   automatski  , potreban nam je način za obradu tradicionalnog fallbacka lozinke. Umjesto korištenja ugrađenog form_login, implementiramo prilagođeni  . Ovo nam omogućuje da različite vrste vjerodajnica ( ) tretiramo kao odvojene "značke" unutar jednog objedinjenog događaja autentifikacije, pružajući mnogo čišću integraciju sa modernom Symfony 7.4 sigurnosnom komponentom. webauthn-symfony-bundle obrađuje provjeru Passkeyja HybridAuthenticator Passkeys vs. Lozinke Korištenjem prilagođenog autentifikatora, također možemo osigurati da obje metode autentifikacije dijele potpuno iste rukovatelje uspjeha i neuspjeha. To znači da su URL-ovi preusmjeravanja na nadzornu ploču, bljeskajuće poruke i sigurnosno logiranje dosljedni u cijeloj aplikaciji, neovisno o tome je li korisnik koristio svoj otisak prsta ili lozinku od 20 znakova za ulazak. // src/Security/HybridAuthenticator.php
namespace App\Security;

use Symfony\Component\HttpFoundation\Request;
use Symfony\Component\HttpFoundation\Response;
use Symfony\Component\Security\Core\Authentication\Token\TokenInterface;
use Symfony\Component\Security\Core\Exception\AuthenticationException;
use Symfony\Component\Security\Http\Authenticator\AbstractAuthenticator;
use Symfony\Component\Security\Http\Authenticator\Passport\Badge\UserBadge;
use Symfony\Component\Security\Http\Authenticator\Passport\Credentials\PasswordCredentials;
use Symfony\Component\Security\Http\Authenticator\Passport\Passport;

class HybridAuthenticator extends AbstractAuthenticator
{
    public function __construct(
        private readonly AuthenticationSuccessHandler $successHandler,
        private readonly AuthenticationFailureHandler $failureHandler
    ) {}

    public function supports(Request $request): ?bool
    {
        // Only intercept standard POST login attempts with a password
        return $request->isMethod('POST') 
            && $request->getPathInfo() === '/login' 
            && $request->request->has('password');
    }

    public function authenticate(Request $request): Passport
    {
        $email = $request->request->getString('username');
        $password = $request->request->getString('password');

        return new Passport(
            new UserBadge($email),
            new PasswordCredentials($password)
        );
    }

    public function onAuthenticationSuccess(Request $request, TokenInterface $token, string $firewall): ?Response
    {
        return $this->successHandler->onAuthenticationSuccess($request, $token);
    }

    public function onAuthenticationFailure(Request $request, AuthenticationException $exception): ?Response
    {
        return $this->failureHandler->onAuthenticationFailure($request, $exception);
    }
}
 Symfony 7.4 sustav za autentifikaciju je nevjerojatno fleksibilan. Možemo konfigurirati naš   da prihvati oba oblika prijave (lozinke) i WebAuthn potvrde na istoj vatrozidu! security.yaml security:
    password_hashers:
        App\Entity\User: 'auto'
    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

            custom_authenticator: App\Security\HybridAuthenticator

            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 }
 Frontend magija: Uvjetno posredovanje (automatsko popunjavanje) Ovdje aplikacija počinje djelovati istinski moderno. Uvjetno posredovanje omogućuje pregledniku da prikaže prijedlog Passkeyja čim korisnik fokusira polje e-pošte. Ova prijava "bez napora" znači da je za mnoge korisnike proces prijave jednostavan jednim dodirom na njihovo ime u iskačućem prozoru preglednika, nakon čega slijedi biometrijsko skeniranje. Da bismo to postigli, koristimo atribut   u našem HTML-u. Ovo služi kao izravan signal upravitelju vjerodajnica preglednika. Na strani JavaScripta, Stimulus connect() metoda je savršeno mjesto za pokretanje "slušanja" ovih prijedloga za automatsko popunjavanje u pozadini, dopuštajući stranici da ostane interaktivna dok preglednik čeka korisnikov odabir. autocomplete=”username webauthn” Predložak Moramo dodati   na naš unos. Ovo je signal pregledniku. autocomplete=”username webauthn” {# templates/app/login.html.twig #}
<form data-controller="hybrid-login" data-action="submit->hybrid-login#submit">
    <input type="email" 
           name="username" 
           autocomplete="username webauthn"
           data-hybrid-login-target="email" 
           placeholder="Unesite svoju e-poštu">
    
    <div data-hybrid-login-target="passwordContainer" class="d-none">
        <input type="password" name="password" data-hybrid-login-target="password">
    </div>

    <button type="submit" data-hybrid-login-target="continueButton">Nastavi</button>
</form>
 Stimulus kontroler U našoj   metodi provjeravamo podržava li preglednik automatsko popunjavanje. Ako ga podržava, odmah  . connect() pokrećemo WebAuthn ceremoniju u pozadini // assets/controllers/hybrid_login_controller.js
import { Controller } from '@hotwired/stimulus';
import { startAuthentication, browserSupportsWebAuthnAutofill } from '@simplewebauthn/browser';

export default class extends Controller {
    async connect() {
        if (await browserSupportsWebAuthnAutofill()) {
            try {
                // Background listen for autofill
                const credential = await startAuthentication({
                    optionsJSON: await this.fetchOptions(),
                    useBrowserAutofill: true
                });
                await this.verifyResult(credential);
            } catch (e) {
                // Silent catch: user might just type manually
            }
        }
    }

    async submit(event) {
        event.preventDefault();
        const email = this.emailTarget.value;
        
        // 1. Check Flow
        const { flow } = await fetch(`/api/auth/flow?email=${email}`).then(r => r.json());

        if (flow === 'passkey') {
            await this.triggerPasskeyLogin(email);
        } else {
            this.showPasswordInput();
        }
    }
}
 Put "nadogradnje": Dodavanje Passkeyja s nadzorne ploče Najveći izazov s Passkeyjima nije kod; to je prihvaćanje. Morate svojim korisnicima dati razlog i način za dodavanje biometrijskih podataka svojim postojećim računima s lozinkama. Implementirali smo specijalizirani   koji već prijavljenim korisnicima omogućuje sigurno premošćivanje jaza između njihove prošlosti temeljene na lozinkama i njihove biometrijske budućnosti bez trenja potpune ponovne registracije. PasskeySettingsController Ključni dio ovog protoka je upotreba  . Prosljeđivanjem postojećih ID-ova vjerodajnica korisnika pregledniku tijekom ovog procesa osiguravamo da korisniku nije ponuđeno stvaranje duplikata Passkeyja na istom uređaju. Ovo sprječava "gomilanje vjerodajnica" i osigurava da nadzorna ploča korisnika prikazuje samo jedinstvene, funkcionalne sigurnosne ključeve, održavajući iskustvo čistim i upravljivim. excludeCredentials // src/Controller/PasskeySettingsController.php
#[Route('/dashboard/passkey/options', methods: ['POST'])]
public function options(): JsonResponse
{
    $user = $this->getUser();
    $userEntity = new PublicKeyCredentialUserEntity(
        $user->getEmail(),
        $user->getUserHandle(),
        $user->getEmail()
    );

    // Exclude existing keys so the browser doesn't offer duplicates
    $excludeDescriptors = array_map(
        fn ($source) => new PublicKeyCredentialDescriptor('public-key', $source->publicKeyCredentialId),
        $this->credsRepo->findAllForUserEntity($userEntity)
    );

    $options = $this->optionsFactory->create('default', $userEntity, $excludeDescriptors);
    $this->optionsStorage->store(Item::create($options, $userEntity));

    return new JsonResponse($this->serializer->serialize($options, 'json'), 200, [], true);
}
 Tehnički problemi i verifikacija Binarni podaci i JSON Jedan od najčešćih problema u razvoju WebAuthn-a je kodiranje. ID-ovi vjerodajnica i izazovi su sirovi binarni podaci, koje standardni json_encode ne može obraditi. Moramo koristiti base64url standard, koji je posebno dizajniran za siguran transport u URL-ovima i JSON-u bez problematičnih znakova + ili / pronađenih u standardnom Base64. Korištenje specijaliziranog serijalizatora paketa osigurava da se ova konverzija odvija ispravno i dosljedno. Koraci verifikacije 
 
 
 
 
  Stvorite račun putem naslijeđene /register/password rute kako biste uspostavili svoju osnovnu "staru" korisničku oznaku. Registracija lozinke:  Idite na /login i unesite e-poštu. Sustav bi trebao ispravno identificirati korisnika kao korisnika samo s lozinkom i otkriti polje lozinke. Hibridna prijava:  Prijavite se svojom lozinkom, idite na Nadzornu ploču i kliknite "Dodaj Passkey" kako biste premostili račun u biometrijski svijet. Nadogradnja:  Odjavite se. Kliknite polje e-pošte. Vaš preglednik bi sada trebao odmah ponuditi prijedlog Passkeyja, zaokružujući krug hibridnog iskustva. Automatsko popunjavanje: Zaključak Implementacija hibridnog modela autentifikacije u Symfony 7.4 predstavlja sofisticiranu ravnotežu između najsuvremenije sigurnosti i praktične pristupačnosti. Pružanjem jedinstvenog sučelja koje poštuje i naslijeđene navike lozinki i pomak prema biometriji, eliminirate trenje koje često ubija usvajanje novih značajki. Ovaj pristup ne samo da poboljšava sigurnost; gradi povjerenje kod vaših korisnika susrećući ih tamo gdje jesu, a istovremeno im jasno pokazujući bolji, brži put naprijed. Tehnički smo vidjeli da Symfonyjeva moderna sigurnosna komponenta i WebAuthn paket pružaju izvanredno robustan temelj za te složene protoke. Sposobnost tretiranja lozinki i Passkeyja kao komplementarnih znački unutar istog ekosustava znači da se vi, kao programer, ne borite s okvirom kako biste implementirali prilagođenu logiku. Umjesto toga, koristite standardne, interoperabilne primitivne elemente za izgradnju sustava koji je podjednako održiv koliko i siguran. Gledajući unaprijed, cilj je web gdje je autentifikacija toliko bez trenja da postaje nevidljiva. S uvjetnim posredovanjem i hibridnim fallbackovima, približavamo se toj stvarnosti, gdje se teret sigurnosti sjeća korisnika premješta na hardver u njegovom džepu. Usvajanjem ovih obrazaca danas, budućnosno osiguravate svoju aplikaciju i osiguravate da vaši korisnici imaju koristi od najviših standarda digitalne sigurnosti bez žrtvovanja praktičnosti koju su očekivali.  Puni implementaciju i napredak projekta možete pronaći na GitHubu: [ ] Izvorni kod: https://github.com/mattleads/PasskeysAuth Povežimo se! Ako vam je ovo bilo korisno ili imate pitanja o implementaciji, volio bih vas čuti. Ostanimo u kontaktu i nastavimo razgovor na ovim platformama: 
 
 
 
 
 LinkedIn: [ ] https://www.linkedin.com/in/matthew-mochalkin/ X (Twitter): [ ] https://x.com/MattLeads Telegram: [ ] https://t.me/MattLeads GitHub: [ ] https://github.com/mattleads

Read My Stories

Ovaj zvuk je proizveden na izvornom jeziku priče!

Kako izgraditi hibridnu strategiju lozinki u Symfony 7.4: Kretanje izvan utvrde bez lozinke

About Author

KOMENTARI

VIJESI OZNAKE

OVAJ ČLANAK JE PREDSTAVLJEN U

Related Stories

Light-Mode

Classic

Newspaper

Minty

Dark-Mode

Neon Noir

Minty

HN StartUps