rn-fetch-blob

library0.12.0jsnpmunverified

A React Native module for file transfer (download/upload) and file system access, supporting large file streaming with ArrayBuffer and Blob. Version 0.12.0 is the latest stable release; development is sporadic with few recent updates. Differentiators include streaming for large files and direct file system access, though it is superseded by react-native-blob-util (actively maintained fork) and react-native-fs for simpler needs.

storage

npm install rn-fetch-blob

github ↗package ↗homepage ↗

INSTALL

IMPORT

SIG · RN-FETCH-BLOB

rn-fetch-blob

storagejavascriptv0.12.0

harness data pending

Install & Compatibility

Where this runs

No compatibility data collected yet for this library.

Code

Verified usage

Verified import paths — ran on the pinned version, not inferred.

ReactNativeBlobUtil

✓ import ReactNativeBlobUtil from 'rn-fetch-blob'

✗ import { ReactNativeBlobUtil } from 'rn-fetch-blob'

Default import; named import is incorrect.

RNFetchBlob

✓ const RNFetchBlob = require('rn-fetch-blob')

✗ import { RNFetchBlob } from 'rn-fetch-blob'

CommonJS require returns the default export; named import does not work.

✓ import ReactNativeBlobUtil from 'rn-fetch-blob'; const fs = ReactNativeBlobUtil.fs;

✗ import { fs } from 'rn-fetch-blob';

fs is a property on the default export, not a named export.

Shows basic file download and upload using rn-fetch-blob with file caching.

import ReactNativeBlobUtil from 'rn-fetch-blob'; // Download a file ReactNativeBlobUtil .config({ path: ReactNativeBlobUtil.fs.dirs.DocumentDir + '/image.png', fileCache: true, }) .fetch('GET', 'https://example.com/image.png', {}) .then(res => { console.log('File downloaded to', res.path()); }) .catch(err => console.error(err)); // Upload a file const uploadData = [ { name: 'file', filename: 'test.png', data: ReactNativeBlobUtil.wrap(ReactNativeBlobUtil.fs.dirs.DocumentDir + '/test.png') } ]; ReactNativeBlobUtil.fetch('POST', 'https://example.com/upload', { 'Content-Type': 'multipart/form-data' }, uploadData) .then(res => console.log('Upload response:', res.text())) .catch(err => console.error(err));

Debug

Known issues

deprecatedrn-fetch-blob is unmaintained; prefer react-native-blob-util (active fork).

fix

Replace rn-fetch-blob with react-native-blob-util and update imports accordingly.

affects: >=0.10.0

gotchaAndroid: file:// URI causes failures; use content:// or absolute paths.

fix

Avoid 'file://' prefix; use ReactNativeBlobUtil.fs.dirs paths or content URIs.

affects: >=0.10.0

gotchaiOS: NSAppTransportSecurity may block HTTP; set NSAllowsArbitraryLoads in Info.plist.

fix

Add NSAppTransportSecurity dictionary with NSAllowsArbitraryLoads: true to Info.plist.

affects: >=0.10.0

breakingBreaking change in 0.7.0: fetch API now returns Promise instead of using callbacks.

fix

Update code to use .then()/catch() or async/await instead of callbacks.

affects: <=0.7.0

Errors

Common errors & fixes

Error: Cannot find module 'rn-fetch-blob'

Module not linked properly after installation; missing pod install for iOS or old arch.

fix

Run 'react-native link rn-fetch-blob' or in new autolinking: 'cd ios && pod install'.

Invariant Violation: Native module cannot be null

Native module not properly linked; often after upgrading RN version.

fix

Ensure rn-fetch-blob is linked: react-native link rn-fetch-blob, then rebuild.

TypeError: Network request failed

Android: Cleartext HTTP traffic blocked (target SDK >= 28).

fix

Add android:usesCleartextTraffic="true" in AndroidManifest.xml or use HTTPS.

Upgrade

Version history

0.12.0latest on npm

Audit

Dependencies

react-nativerequiredPeer dependency for React Native app

Agent activity

22 hits · last 30 days

node

Amazon

OpenAI (training)

Resources

githubhttps://github.com/joltup/rn-fetch-blob ↗

packagern-fetch-blob ↗

homepagehttps://github.com/joltup/rn-fetch-blob#readme ↗