[top] Download Base64 React Native May 2026
npm install react-native-blob-util # or yarn add react-native-blob-util Use code with caution. Step 2: Implementing the Download Logic
import ReactNativeBlobUtil from 'react-native-blob-util'; import { Platform, Alert } from 'react-native'; const downloadBase64File = async (base64Data, fileName, fileType) => { // 1. Remove the header (e.g., "data:application/pdf;base64,") const base64Code = base64Data.split('data:application/pdf;base64,').pop(); // 2. Define the path const dirs = ReactNativeBlobUtil.fs.dirs; const path = Platform.select({ ios: `${dirs.DocumentDir}/${fileName}`, android: `${dirs.DownloadDir}/${fileName}`, }); try { await ReactNativeBlobUtil.fs.writeFile(path, base64Code, 'base64'); if (Platform.OS === 'android') { // Scan the file so it shows up in the gallery/downloads app immediately ReactNativeBlobUtil.fs.scanFile([{ path, mime: fileType }]); } Alert.alert("Success", `File downloaded to: ${path}`); } catch (error) { console.error("Download Error:", error); Alert.alert("Error", "Failed to save file."); } }; Use code with caution. Step 3: Handling Permissions Modern mobile OSs are strict about file access. You must add these to your AndroidManifest.xml : download base64 react native
Sometimes "downloading" isn't enough—users want to send the file via WhatsApp or Email. You can combine your Base64 logic with react-native-share . javascript Define the path const dirs = ReactNativeBlobUtil
Note: For Android 10+, you may also need android:requestLegacyExternalStorage="true" in the tag if targeting older API levels. You can combine your Base64 logic with react-native-share



