Tindakan Pelayan dalam React 19 dan Next.js

Tindakan Pelayan ialah fungsi tak segerak yang dilaksanakan pada pelayan, bukannya dalam pelayar. Fungsi ini ditandai dengan arahan 'use server' yang diletakkan di bahagian atas fail atau di bahagian atas badan fungsi, untuk memberitahu rangka kerja bahawa fungsi ini tidak boleh dijalankan pada bahagian klien.

Oleh sebab Tindakan Pelayan dijalankan pada pelayan, tindakan tersebut mempunyai akses kepada konteks pelayan sepenuhnya: sambungan pangkalan data, rahsia persekitaran, data sesi dan sumber sistem fail. Hal ini berbeza secara asas daripada komponen klien, yang hanya boleh mengakses perkara yang didedahkan oleh pelayar.

Apabila komponen klien memanggil Tindakan Pelayan, Next.js secara automatik membuat permintaan HTTP POST ke titik akhir RSC khas. Rangka kerja mengendalikan semua pensirian argumen dan lapisan pengangkutan, jadi Anda tidak perlu menulis panggilan fetch() secara manual untuk mutasi ini.

Tindakan Pelayan menggantikan keperluan terhadap laluan API dalam banyak senario mutasi. Tindakan itu sendiri ialah titik akhir — Anda mentakrifkan logik sekali sahaja sebagai fungsi pelayan dan memanggilnya terus daripada komponen klien seolah-olah ia fungsi setempat.

Tindakan Pelayan pada asalnya ialah konsep khusus Next.js, tetapi React 19 menjadikannya ciri React kelas pertama. Ini bermakna penggabung dan rangka kerja selain Next.js boleh melaksanakan corak yang sama mengikut spesifikasi React.

Tindakan Pelayan masih dalam peringkat percubaan dalam React 19 RC, tetapi telah stabil dalam Penghala Aplikasi Next.js 14+ sejak diperkenalkan. Jika Anda sedang membina aplikasi produksi hari ini dengan Penghala Aplikasi Next.js, Tindakan Pelayan ialah corak yang disokong sepenuhnya dan disyorkan.

Salah satu sifat keselamatan Tindakan Pelayan yang paling penting ialah rahsia tidak pernah sampai ke pelayar. Pemboleh ubah persekitaran seperti kata laluan pangkalan data dan kunci API yang digunakan dalam Tindakan Pelayan tidak pernah disertakan dalam pakej klien, kerana isi fungsi tersebut tidak pernah dihantar ke pelayar.

Elemen borang HTML menerima Tindakan Pelayan secara terus melalui atribut action: <form action={myServerAction}>. React memintas penghantaran borang dan memanggil Tindakan Pelayan dengan data borang, sekali gus membolehkan mutasi pada sisi pelayan tanpa perlu menulis kod penyambung JavaScript pada sisi klien.

Apabila Tindakan Pelayan dicetuskan, React mensirikan argumen tindakan ke dalam isi permintaan POST. Pelayan menyahsirikan argumen tersebut, melaksanakan fungsi, mensirikan nilai pulangan dan menghantarnya kembali. Hanya nilai yang boleh disiri (rentetan, nombor, tatasusunan dan objek biasa) boleh merentasi sempadan ini.

Anda boleh mentakrifkan Tindakan Pelayan pada peringkat modul dalam fail yang mempunyai 'use server' pada bahagian atas, atau secara sebaris dalam Komponen Pelayan dengan meletakkan 'use server' pada bahagian atas fungsi tak segerak. Kedua-dua pendekatan menghasilkan keputusan yang sama: fungsi boleh dipanggil yang hanya berjalan pada pelayan.

Komponen klien mengimport dan memanggil Tindakan Pelayan sama seperti fungsi tak segerak biasa. Sintaks panggilan adalah sama seperti panggilan fungsi tak segerak setempat, tetapi pelaksanaannya berlaku sepenuhnya pada pelayan. Abstraksi ini memastikan komponen klien kekal kemas dan bebas daripada kod asas fetch.

Tindakan Pelayan ialah fungsi tak segerak pada sisi pelayan yang ditandai dengan 'use server'. Tindakan ini menggunakan konteks pelayan seperti sambungan pangkalan data dan rahsia persekitaran. Next.js mengendalikan pengangkutan HTTP secara automatik, manakala React 19 menjadikannya ciri yang tidak bergantung pada rangka kerja. Borang boleh menggunakannya secara terus melalui atribut tindakan, dan rahsia di dalamnya tidak pernah sampai ke pelayar.