misakstvanu/laravel-fortify-passkeys

Laravel Fortify 的 Passkeys 后端实现

v1.0.2-beta 2024-02-26 09:17 UTC

This package is auto-updated.

Last update: 2024-09-26 20:16:17 UTC


README

警告

该项目目前正在开发中

Laravel Passkeys

此包提供了一个简单的方法,使用 passkeys 来认证用户。

认证过程基于 web-auth/webauthn-lib 包。在前端,由 @simplewebauthn/browser 包提供相反的功能。

安装

  1. 使用 composer 安装此包
composer require misakstvanu/laravel-passkeys
  1. 服务提供者将被自动发现。如果您想手动注册,请将以下行添加到您的 config/app.php
'providers' => [
    /*
     * Package Service Providers...
     */
    // ...
    Misakstvanu\LaravelPasskeys\PasskeysServiceProvider::class,
];
  1. 发布迁移以创建 passkeys
php artisan vendor:publish --tag=laravel-passkeys-migrations
php artisan migrate
  1. (可选) 发布配置文件
php artisan vendor:publish --tag=laravel-passkeys-config

配置

  1. 在您的 User 模型上实现接口 Misakstvanu\LaravelPasskeys\Contracts\PasskeyAuthentication
use Misakstvanu\LaravelPasskeys\Contracts\PasskeyAuthentication;

class User extends Authenticatable implements PasskeyAuthentication {
    // ...
}
  1. 在您的 User 模型上设置 passkeys 关联
use Misakstvanu\LaravelPasskeys\Models\Passkey;

public function passkeys() :HasMany {
    return $this->hasMany(Passkey::class);
}
  1. 一旦发布了配置文件,您可以通过编辑 config/passkeys.php 文件来配置此包。变量有
  • user_model - 将用于认证用户的模型。默认:App\Models\User
  • route_prefix - 此包加载的 4 个路由的前缀。默认:passkeys
  • route_middleware - 将应用于路由的中件。默认:['web']
  • username_column - 用于查找用户的列。默认:email
  • relying_party_ids - 将允许不安全连接的域数组,请谨慎使用。默认:[]
  • registration_user_validation - 在注册新用户时应用于请求的验证规则。这些值将随后与新的用户持久化。默认:[]

使用方法

有 4 个命名路由使一切工作

POST 'passkeys.login.start' - 登录路由,接受 email 或您在配置中指定的其他字段。如果存在具有给定用户名/电子邮件的用户且已注册 passkey,则将返回凭证请求选项。如果用户不存在,则返回 HTTP 404。

POST 'passkeys.login.verify' - 登录路由,接受 passkey 响应。如果 passkey 认证通过,则用户将被登录。如果 passkey 认证失败,则抛出带有附加信息的异常。

POST 'passkeys.register.start' - 注册路由,接受 email 或您在配置中指定的其他字段。返回凭证请求选项。

POST 'passkeys.register.verify' - 注册路由,接受 passkey 响应。如果 passkey 注册通过且当前有用户登录,则 passkey 将添加到现有账户中;如果没有用户登录,则将从用户名/电子邮件以及配置中指定的任何其他数据创建账户。如果 passkey 注册失败,则抛出带有附加信息的异常。

JS 示例

以下是如何使用此包与 js @simplewebauthn/browser 一起使用的最小示例。

import {browserSupportsWebAuthn, startAuthentication, startRegistration} from "@simplewebauthn/browser";
//import 'api' object based on axios and configured with our app url

function register() {
    // Ask for the authentication options
    api.post('/passkey/register/options', {
        email: 'your@email.com',
    })
        // Prompt the user to create a passkey
        .then((response) => startRegistration(response.data))
        // Verify the data with the server
        .then((attResp) => api.post('/passkey/register', attResp))
        .then((verificationResponse) => {
            if (verificationResponse.data?.verified) {
                // WE ARE REGISTERED AND LOGGED IN / PASSKEY WAS ASSOCIATED WITH NEW OR LOGGED IN ACCOUNT
                return window.location.reload();
            }
            // Something went wrong verifying the registration.
        })
        .catch((error) => {
            // Handle error information
        });
}
function login() {
    // Ask for the authentication options
    api.post('/passkey/login/options', {
            email: 'your@email.com',
        })
        // Prompt the user to authenticate with their passkey
        .then((response) => startAuthentication(response.data))
        // Verify the data with the server
        .then((attResp) =>
            api.post('/passkey/login', attResp),
        )
        .then((verificationResponse) => {
            if (verificationResponse.data?.verified) {
                // WE ARE LOGGED IN
                return window.location.reload();
            }
            // Something went wrong verifying the authentication.
        })
        .catch((error) => {
            // Handle error information
        });
}