Skip to main content

Global Replace

By default you import fetch explicitly from react-native-nitro-fetch at each call site. If you prefer a drop-in replacement so that all fetch() calls in your app (and third-party libraries) go through Nitro, you can install it globally.

Setup

Add this at the very top of your entry file (before any other imports):

// index.js or App.tsx — must be the first import
import { fetch, Headers, Request, Response } from 'react-native-nitro-fetch';

globalThis.fetch = fetch;
globalThis.Headers = Headers;
globalThis.Request = Request;
globalThis.Response = Response;

That's it — every fetch() call in the process now uses the Nitro implementation.

WebSocket

The same pattern works for the WebSocket package:

import { NitroWebSocket } from 'react-native-nitro-websockets';

globalThis.WebSocket = NitroWebSocket;
tip

Many WebSocket libraries (Socket.IO, Centrifuge) accept a WebSocket constructor option — passing NitroWebSocket there avoids touching the global entirely:

import { io } from 'socket.io-client';
import { NitroWebSocket } from 'react-native-nitro-websockets';

const socket = io('https://example.com', {
transports: ['websocket'],
WebSocket: NitroWebSocket,
});

Axios

If you use axios, prefer axios's built-in fetch adapter and pass Nitro's fetch explicitly. This keeps the integration at the axios instance boundary instead of relying on global replacement.

tip

Custom env.fetch support requires axios v1.12.0 or newer.

Setting Request and Response to null is the recommended configuration: it tells axios to hand the request straight to Nitro's native client instead of wrapping it in its own JS Request/Response. Nitro performs the transfer natively, so the only trade-off is that axios's JS-level upload/download progress callbacks — which it builds on those constructors — won't fire. If you leave them unset, axios falls back to the global Request/Response, which aren't a 1:1 match for Nitro's native objects.

See the axios fetch adapter docs for more info.

import axios from 'axios';
import { fetch as nitroFetch } from 'react-native-nitro-fetch';

export const api = axios.create({
adapter: 'fetch',
env: {
fetch: nitroFetch,
Request: null!,
Response: null!,
},
});
Nitro Fetch is built with ❤️ by Margelo. We build fast and beautiful apps. Contact us at margelo.com for high-end consultancy services.