Thiết lập phía máy chủ

Đây là tài liệu Inertia.js v1, phiên bản không còn được duy trì tích cực. Vui lòng tham khảo tài liệu v3.

Bước đầu tiên khi cài Inertia là cấu hình framework phía máy chủ. Inertia duy trì một adapter phía máy chủ chính thức cho Laravel. Với các framework khác, hãy xem community adapter. Inertia được tối ưu chặt chẽ cho Laravel, vì vậy các ví dụ trong tài liệu trên website này sử dụng Laravel. Với ví dụ sử dụng Inertia cùng framework phía máy chủ khác, hãy tham khảo tài liệu riêng của framework do adapter tương ứng duy trì.

Laravel Starter Kit

Các starter kit của Laravel, Breeze và Jetstream, cung cấp sẵn scaffold cho ứng dụng Inertia mới. Đây là cách nhanh nhất để bắt đầu xây dựng dự án Inertia mới bằng Laravel cùng Vue hoặc React. Tuy nhiên, nếu muốn cài Inertia thủ công vào ứng dụng, hãy xem tài liệu bên dưới.

Cài đặt dependency

Trước tiên, hãy cài adapter phía máy chủ của Inertia bằng Composer package manager.

composer require inertiajs/inertia-laravel

Root template

Tiếp theo, thiết lập root template sẽ được tải trong lần truy cập trang đầu tiên của ứng dụng. Template này được dùng để tải các asset của website (CSS và JavaScript), đồng thời chứa root <div> để khởi động ứng dụng JavaScript.

<html>
    <head>
        <meta charset="utf-8" />
        <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0" />
        @vite('resources/js/app.js')
        @inertiaHead
    </head>
    <body>
        @inertia
    </body>
</html>

Template này cần bao gồm các asset cùng các directive @inertia và @inertiaHead. Mặc định, adapter Laravel của Inertia giả định root template có tên app.blade.php. Nếu muốn dùng root view khác, bạn có thể thay đổi bằng phương thức Inertia::setRootView().

Middleware

Tiếp theo, chúng ta cần thiết lập middleware Inertia. Bạn có thể thực hiện bằng cách publish middleware HandleInertiaRequests vào ứng dụng thông qua Artisan command sau.

php artisan inertia:middleware

Sau khi middleware được publish, hãy thêm middleware HandleInertiaRequests vào group middleware web trong file bootstrap/app.php của ứng dụng.

use App\Http\Middleware\HandleInertiaRequests;

->withMiddleware(function (Middleware $middleware) {
    $middleware->web(append: [
        HandleInertiaRequests::class,
    ]);
})

Middleware này cung cấp phương thức version() để thiết lập phiên bản asset, cùng phương thức share() để định nghĩa dữ liệu dùng chung.

Tạo response

Vậy là phần phía máy chủ đã sẵn sàng. Giờ bạn có thể bắt đầu tạo các trang Inertia và render chúng thông qua response.

use Inertia\Inertia;

class EventsController extends Controller
{
    public function show(Event $event)
    {
        return Inertia::render('Event/Show', [
            'event' => $event->only(
                'id',
                'title',
                'start_date',
                'description'
            ),
        ]);
    }
}

Tài liệu chính thức

Bài dịch này được đối chiếu từ tài liệu Inertia.js v1 chính thức. Nếu có khác biệt do phiên bản hoặc cập nhật mới, hãy ưu tiên tài liệu chính thức làm nguồn tham chiếu.

Bắt đầu

Cài đặt

Khái niệm cốt lõi

Kiến thức cơ bản

Nâng cao

Laravel Starter Kit

Cài đặt dependency

Root template

Middleware

Tạo response

Tài liệu chính thức

​Laravel Starter Kit

​Cài đặt dependency

​Root template

​Middleware

​Tạo response

​Tài liệu chính thức

Laravel Starter Kit

Cài đặt dependency

Root template

Middleware

Tạo response

Tài liệu chính thức