Server action security considerations in NextJS - Cheat Sheet & Quick Revision

Recall & Review

beginner

What is the main purpose of server actions in Next.js?

Server actions allow you to run code securely on the server, such as handling form submissions or database updates, without exposing sensitive logic to the client.

beginner

Why should you validate all inputs in server actions?

Validating inputs prevents malicious data from causing harm, such as SQL injection or unexpected errors, ensuring only safe and expected data is processed.

intermediate

How does Next.js server actions help protect against Cross-Site Request Forgery (CSRF)?

Server actions run on the server and can check user sessions or tokens, making it harder for attackers to trick users into unwanted actions because the server verifies authenticity.

intermediate

What is a common mistake that can expose server actions to security risks?

Exposing server action URLs publicly without proper authentication or authorization checks can allow unauthorized users to perform sensitive operations.

beginner

How can you ensure sensitive data is not leaked in server action responses?

Only return necessary data to the client and avoid sending secrets, passwords, or internal server details in the response.

What should you always do before processing data in a Next.js server action?

A Send data directly to the client

B Ignore user authentication

C Validate and sanitize the input data

D Run client-side scripts

Validating and sanitizing input data helps prevent security issues like injection attacks.

Which of the following helps protect server actions from unauthorized use?

A Skipping input validation

B Authentication and authorization checks

C Exposing server action URLs publicly

D Using client-side only code

Authentication and authorization ensure only allowed users can perform server actions.

Why should server actions avoid returning sensitive information in responses?

A To prevent leaking secrets or internal details

B To make the response larger

C To confuse the client

D To speed up the server

Returning sensitive info can expose your app to security risks.

How do server actions in Next.js differ from client-side code in terms of security?

A Server actions do not handle data

B Server actions run on the client browser

C Server actions expose all code to users

D Server actions run securely on the server, hidden from the client

Server actions run on the server, so sensitive logic is not exposed to users.

What is a good practice to prevent CSRF attacks in server actions?

A Verify user sessions or tokens before processing

B Allow all requests without checks

C Use only GET requests

D Disable authentication

Verifying sessions or tokens ensures requests are legitimate and not forged.

Explain how input validation and authentication improve security in Next.js server actions.

Think about stopping bad data and unauthorized users.

Describe common security risks if server actions are not properly secured.

Consider what happens if anyone can call server actions.

Practice

1. Why should server actions in Next.js always check user authentication before proceeding?

easy

A. To allow client-side code to run faster

B. To speed up the server response time

C. To ensure only authorized users can perform sensitive operations

D. To reduce the size of the JavaScript bundle sent to the client

Solution

1. Step 1: Understand server action purpose

   Server actions run on the server to handle sensitive logic securely.

2. Step 2: Importance of authentication check

   Checking user authentication ensures only authorized users can access or modify protected data.

3. Final Answer:

   To ensure only authorized users can perform sensitive operations -> Option C

4. Quick Check:

   Authentication check = To ensure only authorized users can perform sensitive operations [OK]

Hint: Server actions protect sensitive logic by verifying users [OK]

Common Mistakes:

• Thinking authentication speeds up server response
• Confusing client-side speed with server security
• Believing authentication reduces bundle size

2. Which of the following is the correct way to define a server action in Next.js 14+?

easy

A. export async function actionName() { /* server code */ }

B. function actionName() { return Client }

C. const actionName = () => { console.log('client') }

D. export default function actionName() { return 'client' }

Solution

1. Step 1: Recognize server action syntax

   Server actions are async functions exported to run on the server.

2. Step 2: Identify correct export and async usage

   export async function actionName() { /* server code */ } correctly exports an async function for server action.

3. Final Answer:

   export async function actionName() { /* server code */ } -> Option A

4. Quick Check:

   Async export function = export async function actionName() { /* server code */ } [OK]

Hint: Server actions are async exported functions [OK]

Common Mistakes:

• Using client component syntax for server actions
• Missing async keyword in server action
• Not exporting the function

3. Given this server action code snippet, what will happen if the input is not validated?

export async function updateUser(data) {
  // No input validation
  await db.user.update({ where: { id: data.id }, data });
  return { success: true };
}

medium

A. The database may receive invalid or malicious data causing errors or security issues

B. The server will automatically reject invalid data

C. The client will validate data before sending, so no issues occur

D. The function will throw a syntax error

Solution

1. Step 1: Understand missing input validation

   Without validation, any data sent by client is accepted as-is.

2. Step 2: Consequences of no validation

   Invalid or malicious data can corrupt database or cause security vulnerabilities.

3. Final Answer:

   The database may receive invalid or malicious data causing errors or security issues -> Option A

4. Quick Check:

   Missing validation = risk of bad data [OK]

Hint: No validation risks bad data in database [OK]

Common Mistakes:

• Assuming server rejects invalid data automatically
• Believing client validation is enough
• Expecting syntax errors from bad input

4. Identify the security issue in this server action code and how to fix it:

export async function deletePost(postId) {
  await db.post.delete({ where: { id: postId } });
  return { deleted: true };
}

medium

A. Missing async keyword; fix by adding async to function

B. No return statement; fix by returning a success message

C. Incorrect database method; fix by using update instead of delete

D. Missing user authentication check; fix by verifying user identity before deleting

Solution

1. Step 1: Check for authentication or permission validation

   The code deletes a post without verifying if the user is allowed to do so.

2. Step 2: Fix by adding user identity check

   Before deleting, confirm the user is authenticated and authorized to delete the post.

3. Final Answer:

   Missing user authentication check; fix by verifying user identity before deleting -> Option D

4. Quick Check:

   Authentication missing = Missing user authentication check; fix by verifying user identity before deleting [OK]

Hint: Always check user permissions before data deletion [OK]

Common Mistakes:

• Ignoring authentication importance
• Confusing async keyword necessity
• Misunderstanding database method usage

5. You want to create a server action that updates user profile data only if the user is authenticated and the input is valid. Which approach best secures this action?

export async function updateProfile(user, data) {
  // What should you do here?
}

hard

A. Update database directly without checks for speed

B. Check if user is authenticated, validate data fields, then update database

C. Validate data on client only, then update database

D. Return success immediately and update database later asynchronously

Solution

1. Step 1: Verify user authentication inside server action

   Ensure the user object is valid and authenticated before proceeding.

2. Step 2: Validate all input data carefully

   Check each data field to prevent invalid or malicious input before updating the database.

3. Step 3: Update database only after passing checks

   Perform the update securely after authentication and validation.

4. Final Answer:

   Check if user is authenticated, validate data fields, then update database -> Option B

5. Quick Check:

   Authentication + validation = secure update [OK]

Hint: Authenticate user and validate input before DB update [OK]

Common Mistakes:

• Skipping server-side validation
• Relying only on client validation
• Updating DB without authentication