返回

Filament 中基于令牌的自定义邀请页面指南：保障用户安全

php

如何在 Filament 中创建基于令牌的自定义邀请页面

导言

在当今以安全为中心的数字环境中，保护用户数据至关重要。对于依赖用户邀请的应用程序，需要一种方法来确保只有持有有效令牌的授权用户才能访问注册表单。本文将指导你如何在 Filament 3 和 Laravel 10 中实现此功能，同时保留其无代码架构的优势。

步骤 1：创建自定义页面

自定义页面是 Filament 中创建自定义 UI 的一种方法。对于此特定用例，需要创建一个页面来容纳带有邀请表单的 Livewire 组件。为此，请执行以下步骤：

  1. 创建一个名为 UserInvitations.blade.php 的新文件，位于 resources/views/vendor/filament/pages 目录中。
  2. 在文件中添加以下代码，它将显示带有或不带有表单的页面，具体取决于是否存在有效的令牌。
@extends('filament::pages.dashboard')

@section('content')
    <div class="container">
        <div class="row">
            <div class="col-12">
                <h1 class="mb-4">用户邀请</h1>

                @if ($token)
                    <x-filament::form wire:submit.prevent="createUser">
                        <!-- 表单结构 -->
                    </x-filament::form>
                @else
                    <p>无效的邀请链接。</p>
                @endif
            </div>
        </div>
    </div>
@endsection

步骤 2：创建 Livewire 组件

Livewire 组件允许我们在不离开页面的情况下处理复杂的交互。对于用户邀请，需要一个组件来：

  1. 验证路由中提供的令牌。
  2. 在令牌有效的情况下显示注册表单。
  3. 处理表单提交并创建新用户。

为此，请执行以下步骤：

  1. 创建一个名为 UserInvitationsForm.php 的新文件，位于 app/Http/Livewire 目录中。
  2. 在文件中添加以下代码：
namespace App\Http\Livewire;

use App\Models\Token;
use App\Models\User;
use Filament\Forms\ComponentContainer;
use Filament\Forms\Concerns\InteractsWithForms;
use Illuminate\Support\Facades\Hash;
use Livewire\Component;

class UserInvitationsForm extends Component
{
    use InteractsWithForms;

    public $token;

    protected function getFormSchema(): array
    {
        // 表单结构
    }

    public function mount(): void
    {
        $this->token = request()->route()->parameter('token');
    }

    public function createUser(): void
    {
        // 令牌验证、用户创建和重定向逻辑
    }

    public function render(): View
    {
        return view('filament.pages.user-invitations');
    }
}

步骤 3：注册自定义页面和 Livewire 组件

最后，需要在路由中注册自定义页面和 Livewire 组件，以便 Filament 可以在应用程序中使用它们。为此，请在 routes/web.php 文件中添加以下代码：

use App\Http\Livewire\UserInvitationsForm;

Route::get('/user-invitations/{token}', UserInvitationsForm::class)->name('user-invitations');

结论

通过遵循这些步骤，你可以在 Filament 应用程序中创建基于令牌的自定义邀请页面。此解决方案保留了 Filament 的无代码架构的优点，同时提高了用户邀请过程的安全性。通过利用 Livewire 和自定义页面的强大功能，你可以创建动态、响应式的用户界面，增强应用程序的用户体验。

常见问题解答

  • 问：如何生成邀请令牌？
    答：邀请令牌通常使用 Laravel 中的 Str::random() 函数生成。
  • 问：如何验证令牌是否有效？
    答：可以使用数据库模型或其他存储机制来验证令牌。
  • 问：如果令牌无效，用户会看到什么？
    答：你可以显示一条消息，说明邀请链接无效。
  • 问：Livewire 组件是否必须包含在自定义页面中？
    答：是的，Livewire 组件是处理邀请逻辑的必要部分。
  • 问：这种方法是否适用于其他基于 Filament 的自定义页面？
    答：是的，这种方法可以适应其他自定义页面，但需要根据具体情况进行修改。