Skip to main content

Що означає директива "use server"?

Next.jsMiddle~2 хв читання
Запропонувати правку

Директива "use server" - це спеціальна інструкція для Next.js, яка явно каже: «Цей код повинен виконуватися тільки на сервері».

Вона потрібна, щоб Next.js однозначно зрозумів межу між клієнтом і сервером.

Що робить "use server"

Коли Next.js бачить "use server":

  • код ніколи не потрапляє у браузер
  • функція виконується тільки на сервері
  • її можна викликати:
    • з Server Components
    • з Client Components
    • з HTML-форм

Фактично, це маркер:

«Цю функцію не можна запускати на клієнті».

Де можна використовувати "use server"

1. На початку файлу

Якщо директива стоїть першим рядком файлу:

ts
'use server' export async function createUser() { // серверний код }

Усі експортовані функції в цьому файлі вважаються серверними.

2. Перед конкретною функцією

ts
export async function deleteUser() { 'use server' // серверний код }

Тільки ця функція буде Server Action.

Навіщо взагалі потрібна ця директива

1. Явне розділення середовища виконання

У Next.js є:

  • Server Components
  • Client Components
  • спільний код

Без директиви фреймворк не може безпечно вгадати, де саме повинен виконуватися код.

"use server" знімає двозначність.

2. Безпека

З кодом під "use server" можна:

  • звертатися до бази даних
  • використовувати секрети і токени
  • працювати з файловою системою
  • викликати приватні API

І при цьому бути впевненим, що цей код не витече у клієнт.

3. Можливість викликати серверну функцію з UI

Без "use server" функція:

  • або стане звичайною серверною логікою
  • або взагалі не зможе бути викликана з client-компонента

Директива робить функцію доступною як Server Action.

Що "use server" НЕ робить

Важливо не плутати:

  • це не middleware
  • це не захист авторизації
  • це не обмеження доступу саме по собі
  • це не runtime-перевірка

Якщо користувач може викликати дію з UI - ти все одно повинен перевіряти права, дані і стан.

Відмінність від "use client"

"use server""use client"
Код тільки на серверіКод у браузері
Немає доступу до DOMЄ доступ до DOM
Можна використовувати секретиНе можна використовувати секрети
Server ActionsReact hooks, події

Обидві директиви потрібні для чіткого розмежування відповідальності.

Коротко

"use server" - це директива, яка позначає функцію або файл як серверний код, гарантуючи, що він виконається тільки на сервері і може бути використаний як Server Action. Вона потрібна для безпеки, ясності та коректної роботи архітектури Next.js.

Коротка відповідь

Для співбесіди
Premium

Коротка відповідь допоможе вам впевнено відповідати на цю тему під час співбесіди.

Запропонувати правку