Authentication for API in Wordpress - Performance & Optimization

Performance: Authentication for API

MEDIUM IMPACT

This affects the time it takes for the API to respond and the initial page load speed when fetching data from the API.

Securing API requests in WordPress

Wordpress

function call_api_with_jwt() {
  $token = get_transient('jwt_token');
  if (!$token) {
    $response = wp_remote_post('https://example.com/wp-json/jwt-auth/v1/token', array(
      'body' => array('username' => 'user', 'password' => 'password')
    ));
    $body = json_decode(wp_remote_retrieve_body($response));
    $token = $body->token;
    set_transient('jwt_token', $token, 3600);
  }
  $response = wp_remote_get('https://example.com/wp-json/wp/v2/posts', array(
    'headers' => array('Authorization' => 'Bearer ' . $token)
  ));
  return wp_remote_retrieve_body($response);
}

JWT tokens are cached and reused, reducing repeated authentication overhead and speeding up API calls.

📈 Performance GainReduces API response delay by 100-200ms per call due to token reuse and less processing.

Securing API requests in WordPress

Wordpress

function call_api_with_basic_auth() {
  $response = wp_remote_get('https://example.com/wp-json/wp/v2/posts', array(
    'headers' => array('Authorization' => 'Basic ' . base64_encode('user:password'))
  ));
  return wp_remote_retrieve_body($response);
}

Basic authentication sends credentials with every request and can cause slower response times due to repeated encoding and lack of token caching.

📉 Performance CostAdds extra processing on each request, increasing API response time by 100-200ms per call.

Performance Comparison

Pattern	DOM Operations	Reflows	Paint Cost	Verdict
Basic Auth on every request	Minimal	0	Low	[X] Bad
JWT token caching	Minimal	0	Low	[OK] Good

Rendering Pipeline

Authentication affects the network request phase and delays the time before content can be rendered because the browser waits for API responses.

→Network Request

→JavaScript Execution

→Rendering

⚠️ BottleneckNetwork Request latency due to authentication overhead

Core Web Vital Affected

INP

This affects the time it takes for the API to respond and the initial page load speed when fetching data from the API.

Optimization Tips

1Cache authentication tokens to avoid repeated login requests.

2Avoid sending credentials on every API call to reduce network latency.

3Use efficient authentication methods like JWT to improve interaction responsiveness.

Performance Quiz - 3 Questions

Which authentication method typically reduces API response time in WordPress?

A Sending Basic Auth credentials on every request

B No authentication at all

C Using JWT tokens with caching

D Using OAuth without token caching

DevTools: Network

How to check: Open DevTools, go to the Network tab, filter API requests, and inspect the timing details of authentication headers and response times.

What to look for: Look for repeated authentication requests and long waiting times before API responses to identify inefficient authentication.

Practice

1. What is the main purpose of permission_callback in WordPress REST API authentication?

easy

A. To format the API response data

B. To define the URL of the API endpoint

C. To register a new API route

D. To check if the user has permission to access the API endpoint

Solution

1. Step 1: Understand the role of permission_callback

   This callback function is used to verify if the current user has the right permissions to access a specific API route.

2. Step 2: Differentiate from other API registration parts

   Other parts like route URL and response formatting are handled separately; permission_callback specifically controls access.

3. Final Answer:

   To check if the user has permission to access the API endpoint -> Option D

4. Quick Check:

   permission_callback controls access permission [OK]

Hint: Remember permission_callback controls access rights [OK]

Common Mistakes:

• Confusing permission_callback with route registration
• Thinking permission_callback formats data
• Assuming permission_callback sets URL

2. Which of the following is the correct way to register a REST API route with authentication in WordPress?

easy

A. register_rest_route('myplugin/v1', '/data', array('methods' => 'GET', 'callback' => 'get_data', 'permission_callback' => '__return_true'))

B. register_rest_route('myplugin/v1', '/data', array('methods' => 'GET', 'callback' => 'get_data'))

C. register_rest_route('myplugin/v1', '/data', array('methods' => 'GET', 'callback' => 'get_data', 'auth_callback' => '__return_true'))

D. register_rest_route('myplugin/v1', '/data', array('methods' => 'GET', 'callback' => 'get_data', 'permission' => '__return_true'))

Solution

1. Step 1: Identify the correct parameter for authentication

   The correct parameter to control access is permission_callback, which should be set to a callable that returns true or false.

2. Step 2: Check the syntax of the registration function

   register_rest_route('myplugin/v1', '/data', array('methods' => 'GET', 'callback' => 'get_data', 'permission_callback' => '__return_true')) correctly includes permission_callback with a valid callable __return_true allowing access.

3. Final Answer:

   register_rest_route('myplugin/v1', '/data', array('methods' => 'GET', 'callback' => 'get_data', 'permission_callback' => '__return_true')) -> Option A

4. Quick Check:

   Use permission_callback for authentication [OK]

Hint: Use permission_callback, not auth_callback or permission [OK]

Common Mistakes:

• Using 'auth_callback' instead of 'permission_callback'
• Omitting permission_callback entirely
• Using 'permission' instead of 'permission_callback'

3. Given this code snippet, what will be the output when an unauthenticated user tries to access the API?

register_rest_route('myplugin/v1', '/secret', array(
  'methods' => 'GET',
  'callback' => 'get_secret_data',
  'permission_callback' => function() {
    return current_user_can('read');
  }
));

function get_secret_data() {
  return 'Secret Info';
}

medium

A. Returns a 401 Unauthorized error

B. Returns a 404 Not Found error

C. Returns an empty string

D. Returns 'Secret Info' to everyone

Solution

1. Step 1: Understand the permission_callback logic

   The callback checks if the user has the 'read' capability. Unauthenticated users do not have this capability, so it returns false.

2. Step 2: Know WordPress REST API behavior on permission failure

   If permission_callback returns false, the API returns a 401 Unauthorized error to block access.

3. Final Answer:

   Returns a 401 Unauthorized error -> Option A

4. Quick Check:

   Permission denied returns 401 error [OK]

Hint: Permission callback false means 401 error [OK]

Common Mistakes:

• Assuming data is returned without permission
• Confusing 401 Unauthorized with 404 Not Found
• Thinking empty string is returned on failure

4. Identify the error in this WordPress REST API route registration code:

register_rest_route('myplugin/v1', '/info', array(
  'methods' => 'GET',
  'callback' => 'get_info',
  'permission_callback' => 'current_user_can('read')'
));

function get_info() {
  return 'Info';
}

medium

A. The callback function 'get_info' is missing parameters

B. The 'methods' value should be an array, not a string

C. The 'permission_callback' should be a callable, not a function call string

D. The route namespace 'myplugin/v1' is invalid

Solution

1. Step 1: Check the type of permission_callback

   permission_callback must be a callable function, not the result of a function call. Here, 'current_user_can('read')' is a string calling the function immediately, which is incorrect.

2. Step 2: Correct usage of permission_callback

   It should be a callable like a function name or anonymous function that returns a boolean when called by the API.

3. Final Answer:

   The 'permission_callback' should be a callable, not a function call string -> Option C

4. Quick Check:

   permission_callback must be callable, not called [OK]

Hint: permission_callback needs a callable, not a called function [OK]

Common Mistakes:

• Passing function call result instead of callable
• Using string with quotes incorrectly
• Confusing methods string vs array

5. You want to create a WordPress REST API endpoint that only logged-in users with the 'edit_posts' capability can access. Which of these permission_callback implementations correctly enforces this?

hard

A. permission_callback => function() { return is_user_logged_in(); }

B. permission_callback => function() { return is_user_logged_in() && current_user_can('edit_posts'); }

C. permission_callback => function() { return current_user_can('read'); }

D. permission_callback => function() { return true; }

Solution

1. Step 1: Understand the requirement

   The endpoint must allow only logged-in users who have the 'edit_posts' capability.

2. Step 2: Analyze each permission_callback

   permission_callback => function() { return is_user_logged_in() && current_user_can('edit_posts'); } checks both if the user is logged in and if they have the capability, fulfilling the requirement exactly.

3. Step 3: Why other options fail

   A only checks login without the 'edit_posts' capability. B checks current_user_can('read') which many users have but not 'edit_posts'. D allows everyone.

4. Final Answer:

   permission_callback => function() { return is_user_logged_in() && current_user_can('edit_posts'); } -> Option B

5. Quick Check:

   Check login and capability together [OK]

Hint: Check both login and capability for secure access [OK]

Common Mistakes:

• Using wrong capability like 'read' instead of 'edit_posts'
• Checking only login without capability
• Allowing all users by returning true