Laravel - 前端

你需要的一切都是惊人的.

开箱即用，Laravel 为所有现代 Web 应用程序所需的通用功能提供了优雅的解决方案。是时候开始构建令人惊叹的应用程序并停止浪费时间搜索包和重新发明轮子了.

Authentication

验证用户就像在 Laravel 路由定义中添加一个身份验证中间件一样简单:

Route::get('/profile', ProfileController::class)
    ->middleware('auth');

用户通过身份验证后，您可以通过Auth门面访问经过身份验证的用户

use Illuminate\Support\Facades\Auth;
 
// Get the currently authenticated user...
$user = Auth::user();

当然，你也可以定义自己的认证中间件，自定义认证流程.

有关 Laravel 身份验证功能的更多信息，请查看身份验证文档n.

授权

您经常需要检查经过身份验证的用户是否有权执行特定操作。Laravel 的模型策略让它变得轻而易举:

php artisan make:policy UserPolicy

在生成的策略类中定义授权规则后，您可以在控制器方法中授权用户的请求:

public function update(Request $request, Invoice $invoice)
{
    Gate::authorize('update', $invoice);
 
    $invoice->update(/* ... */);
}

了解更多

Eloquent ORM

害怕数据库？别这样 Laravel 的 Eloquent ORM 可以轻松地与应用程序的数据进行交互，并且可以快速搭建模型、迁移和关系:

php artisan make:model Invoice --migration

一旦你定义了你的模型结构和关系，你就可以使用 Eloquent 强大的、富有表现力的语法与你的数据库进行交互:

// Create a related model...
$user->invoices()->create(['amount' => 100]);
 
// Update a model...
$invoice->update(['amount' => 200]);
 
// Retrieve models...
$invoices = Invoice::unpaid()->where('amount', '>=', 100)->get();
 
// Rich API for model interactions...
$invoices->each->pay();

了解更多

数据库迁移

迁移就像数据库的版本控制，允许您的团队定义和共享应用程序的数据库架构定义:

public function up(): void
{
    Schema::create('flights', function (Blueprint $table) {
        $table->uuid()->primary();
        $table->foreignUuid('airline_id')->constrained();
        $table->string('name');
        $table->timestamps();
    });
}

了解更多

表单验证

Laravel 拥有 90 多个强大的内置验证规则，并且使用 Laravel Precognition，可以在您的前端提供实时验证:

public function update(Request $request)
{
    $validated = $request->validate([
        'email' => 'required|email|unique:users',
        'password' => Password::required()->min(8)->uncompromised(),
    ]);
 
    $request->user()->update($validated);
}

了解更多

通知和邮件

使用 Laravel 通过电子邮件、Slack、SMS、应用内等方式快速向您的用户发送样式精美的通知:

php artisan make:notification InvoicePaid

生成通知后，您可以轻松地将消息发送给您的应用程序用户:

$user->notify(new InvoicePaid($invoice));

了解更多

文件储存

Laravel 提供了一个强大的文件系统抽象层，提供了一个单一的、统一的 API 来与本地文件系统和基于云的文件系统（如 Amazon S3）进行交互:

$path = $request->file('avatar')->store('s3');

无论你的文件存储在哪里，都可以使用 Laravel 简单、优雅的语法与它们进行交互:

$content = Storage::get('photo.jpg');
 
Storage::put('photo.jpg', $content);

了解更多

作业队列

Laravel 让您可以将慢速作业卸载到后台队列，让您的 Web 请求保持快速:

$podcast = Podcast::create(/* ... */);
 
ProcessPodcast::dispatch($podcast)->onQueue('podcasts');

您可以根据需要运行尽可能多的队列工作者来处理您的工作量:

php artisan queue:work redis --queue=podcasts

为了更好地了解和控制您的队列，Laravel Horizon为您的 Laravel 支持的 Redis 队列提供了一个漂亮的仪表板和代码驱动的配置。

了解更多

任务调度

使用富有表现力的语法安排重复作业和命令，并告别复杂的配置文件:

$schedule->job(NotifySubscribers::class)->hourly();

Laravel 的调度器甚至可以处理多个服务并提供内置的重叠预防:

$schedule->job(NotifySubscribers::class)
    ->dailyAt('9:00')
    ->onOneServer();
    ->withoutOverlapping();

了解更多

测试

Laravel 是为测试而构建的。从单元测试到浏览器测试，您会更有信心部署您的应用程序:

$user = User::factory()->create();
 
$this->browse(fn (Browser $browser) => $browser
    ->visit('/login')
    ->type('email', $user->email)
    ->type('password', 'password')
    ->press('Login')
    ->assertPathIs('/home')
    ->assertSee("Welcome {$user->name}")
);

了解更多

事件和 WebSocket

Laravel 的事件允许你在你的应用程序中发送和监听事件，监听器可以很容易地被分派到后台队列:

OrderShipped::dispatch($order);

class SendShipmentNotification implements ShouldQueue
{
    public function handle(OrderShipped $event): void
    {
        // ...
    }
}

您的前端应用程序甚至可以使用Laravel Echo和 WebSockets订阅您的 Laravel 事件，从而允许您构建实时的动态应用程序:

Echo.private(`orders.${orderId}`)
    .listen('OrderShipped', (e) => {
        console.log(e.order);
    });

Learn more

我们只是触及了表面。Laravel 涵盖了构建 Web 应用程序所需的一切，包括电子邮件验证、速率限制和自定义控制台命令。查看Laravel 文档以继续学习或立即开始我们的Laravel 训练营.

一个框架,
多种风格.

有许多方法可以构建应用程序的前端。值得庆幸的是, Laravel为你提供了广阔的选择空间.无论你是喜欢传统的PHP后端，还是喜欢使用Laravel Livewire的现代前端，还是对React和Vue爱不释手，Laravel 都可以让您在很短的时间内交付高度完善和可维护的应用程序.

Inertia

用 React、Vue 或 Svelte 增强 Laravel

Livewire

PHP 的Reactive服务器渲染模板

传统 SPAs 和移动应用

比以往更快地构建强大的 API

Laravel Inertia 处理 Laravel 后端和前端之间的路由和传输数据——无需构建 API 或维护两组路由。毫不费力地将数据从数据库直接传递到前端页面组件的道具，在一个梦幻般的单存储库中，Laravel的所有功能触手可及

UserController.php

 1class UserController
 2{
 3    public function index()
 4    {
 5        $users = User::active()
 6            ->orderByName()
 7            ->get(['id', 'name', 'email']);
 8 
 9        return Inertia::render('Users', [
10            'users' => $users,
11        ]);
12    }
13}

Users.jsx

 1import Layout from './Layout'
 2 
 3export default function Users({ users }) {
 4  return (
 5    <Layout>
 6      {users.map(user => (
 7        <Link href={route('users.show', user)}>
 8          {user.name} ({user.email})
 9        </Link>
10      ))}
11    </Layout>
12  )
13}

Inertia 为您提供开发人员体验和创建服务器渲染的多页面应用程序的简单性，以及 JavaScript SPA 的用户体验和响应能力.

您的前端组件可以专注于用户交互，而不是 API 调用和数据操作——不再需要手动触发 HTTP 请求和处理响应.

Inertia甚至为受益于搜索引擎优化的应用程序在初始页面加载时提供服务器端的渲染.

了解更多

它是如何工作的?

您的应用程序的初始页面加载将在单个请求中返回一个由 Inertia 驱动的 SPA 和页面道具。单击链接或提交表单的后续请求将自动仅返回所需的页面道具.

当你部署新的资产时，Inertia将自动执行下一个请求，作为一个完整的页面加载，所以你的用户将拥有最新的资产，而不会错过任何一个环节.

Livewire 是一种使用服务器渲染的模板而不是 JavaScript 框架来构建动态界面的现代方法。它将构建服务器渲染应用程序的简单性和速度与 JavaScript SPA 的用户体验相结合。你必须看到它才能相信它.

Search.php

 1use Livewire\Component;
 2 
 3class Search extends Component
 4{
 5    public $search = '';
 6 
 7    public function render()
 8    {
 9        $users = User::search($this->search)->get();
10 
11        return view('livewire.search', [
12            'users' => $users,
13        ]);
14    }
15}

search.blade.php

 1<div>
 2    <input wire:model="search"
 3        type="text"
 4        placeholder="Search users..." />
 5 
 6    <ul>
 7        @foreach ($users as $user)
 8            <li>{{ $user->username }}</li>
 9        @endforeach
10    </ul>
11</div>

使用 Livewire 时，您不需要 JavaScript 来管理 DOM 或状态 - 您只需将其添加到一些周到的交互中即可。Alpine.js是完美的轻量级 JavaScript 库，可与您的 Livewire 应用程序配对。

随着 Livewire 组件状态的变化，您的前端将自动更新。但是，Livewire 并不止于此。包括对实时验证、事件处理、文件下载、授权等的支持.

了解更多

它是如何工作的?

Livewire 使用 Blade 模板语言在服务器上渲染您的 HTML。它会自动添加使页面响应所需的 JavaScript，并自动重新渲染组件并在数据更改时更新 DOM.

强力赋能
你的 Vue App

你需要的一切都是惊人的.

Authentication

授权

Eloquent ORM

数据库迁移

表单验证

通知和邮件

文件储存

作业队列

任务调度

测试

事件和 WebSocket

一个框架,
多种风格.

Inertia

Livewire

Traditional SPAs & Mobile Applications

Inertia

Livewire

传统 SPAs 和移动应用

Inertia

Livewire

传统 SPAs 和移动应用

它是如何工作的?

它是如何工作的?

使用入门套件
深入研究.

社区
和生态系统.

强力赋能 你的 Vue App

你需要的一切都是惊人的.

Authentication

授权

Eloquent ORM

数据库迁移

表单验证

通知和邮件

文件储存

作业队列

任务调度

测试

事件和 WebSocket

一个框架,多种风格.

Inertia

Livewire

Traditional SPAs & Mobile Applications

Inertia

Livewire

传统 SPAs 和移动应用

Inertia

Livewire

传统 SPAs 和移动应用

它是如何工作的?

它是如何工作的?

使用 入门套件 深入研究.

社区和生态系统.

强力赋能
你的 Vue App

一个框架,
多种风格.

使用入门套件
深入研究.

社区
和生态系统.