react-native-fetch-client logo
react-native-fetch-client

Authentication & 401 Single-Flight Mutex

Attach credentials before requests and let concurrent 401 responses share a single token refresh mutex without race conditions.

Concurrent refreshes
If your authentication server rotates refresh tokens, overlapping refresh attempts may need coordination. This client shares an in-flight refreshToken() call when configured.

1. Single-Flight Mutex Solution

When an eligible response arrives and refreshToken() is configured, concurrent requests share the same in-flight refresh operation. After it resolves, each request retries and obtains its token through getToken():

auth-mutex.ts
typescript
import { createClient } from 'react-native-fetch-client';

export const api = createClient({
  baseURL: 'https://api.example.com',
  auth: {
    getToken: async () => {
      return secureStorage.get('accessToken');
    },
    refreshToken: async () => {
      const refresh = await secureStorage.get('refreshToken');
      const tokens = await authService.rotateToken(refresh);
      await secureStorage.set('accessToken', tokens.accessToken);
      return tokens.accessToken;
    },
  },
});

2. Proactive Token Refresh (isExpired)

If your application tracks token expiry timestamps, provide an isExpired() callback to refresh before sending the request over the wire:

typescript
let accessTokenExpiresAt = 0;

const api = createClient({
  auth: {
    getToken: () => getAccessToken(),
    refreshToken: async () => {
      const session = await refreshSession();
      accessTokenExpiresAt = session.expiresAt;
      return session.accessToken;
    },
    // Proactively refresh 30 seconds before expiration:
    isExpired: () => Date.now() >= accessTokenExpiresAt - 30_000,
  },
});

3. Bearer Token Shorthand (bearerToken)

If you don't need complex 401 refresh logic, use the bearerToken option directly:

typescript
// For static tokens or simple dynamic getter:
const api = createClient({
  baseURL: 'https://api.example.com',
  bearerToken: async () => {
    return await secureStore.getItem('token');
  },
});

4. Network Security & VAPT Guidance

Essential security best practices for production mobile apps, audit compliance, and protecting sensitive API endpoints against interception.

Production Release Security

In production builds (__DEV__ === false), React Native and Hermes completely strip out and disable Chrome DevTools Protocol (CDP) debugging and network inspection. End-users cannot attach developer tools to production release IPAs or APKs.

Header & Credential Redaction

The client automatically redacts Authorization tokens to '[REDACTED]' before exposing resolved configurations on response and error objects, preventing token leaks into monitoring tools and console output (OWASP Mobile M1).

Enterprise VAPT & Network Proxy Defense
To protect against external Man-in-the-Middle network proxies (Burp Suite, Charles Proxy, Proxyman) where an auditor or attacker installs a custom root CA on a test device, implement SSL Pinning (using libraries such as react-native-ssl-pinning or native TLS certificate pinning).
PreviousSafe Requests (Go/Rust Tuples)Core ConceptsNextCaching, SWR & Persistent StorageFeatures