Not uploading photo file to storage, and later on retry limit exceeded error ! (storage/retry-limit-exceeded)

[burakkbilginn]

Issue

Describe your issue here

🔥I am trying to upload an image from library in android emulator. But no response comes from this library, also the code of native firebase method of uploadBytes(storageRef, file). On youtube tutorials and all the docs noone points to such an error. I am using react-native-image-picker to pick the uri of the image file. Then try to upload it to firebase storage. My code is as follows:

const ImagePicker = () => {
    let options = { 
      mediaType: 'photo', 
      maxWidth: 2000,
      maxHeight: 2000
    }
    launchImageLibrary(options, response => {
      if (response.assets) {
        setImage(response.assets[0].uri)
        uploadRNFirebaseStorage(response.assets[0])
        console.log("response.assets[0]",response.assets[0])  // output: response.assets[0] {"fileName": "1000000038.jpg", "fileSize": 9653, "height": 950, "originalPath": "/sdcard/.transforms/synthetic/picker/0/com.android.providers.media.photopicker/media/1000000038.jpg", "type": "image/jpeg", "uri": "file:///data/user/0/com.myapp/cache/rn_image_picker_lib_temp_6f221f87-f2ff-42e2-ba0c-1cbc32574c26.jpg", "width": 800}
      }
    })
  }

const uploadRNFirebaseStorage = async (response) => {
    const reference = storage().ref(response.fileName)
    const pathToFile = `${utils.FilePath.PICTURES_DIRECTORY}/${response.fileName}`;
    // uploads file
    const task = await reference.putFile(pathToFile)
    task.on('state_changed', taskSnapshot => {
      console.log(`${taskSnapshot.bytesTransferred} transferred out of ${taskSnapshot.totalBytes}`);
    });
    
    task.then(() => {
      console.log('Image uploaded to the bucket!');
    });
  }

Project Files

• Android: android/build.gradle contents :

buildscript {
    ext {
        // googlePlayServicesVersion = "+" // default: "+"
        // firebaseMessagingVersion = "21.1.0" // default: "21.1.0"

        buildToolsVersion = "34.0.0"
        minSdkVersion = 21
        compileSdkVersion = 34
        targetSdkVersion = 34
        ndkVersion = "25.1.8937393"
        kotlinVersion = "1.8.0"
    }
    repositories {
        google()
        mavenCentral()
    }
    dependencies {
        classpath("com.android.tools.build:gradle")
        classpath("com.facebook.react:react-native-gradle-plugin")
        classpath("org.jetbrains.kotlin:kotlin-gradle-plugin")
        classpath 'com.google.gms:google-services:4.4.0'
    }
}

apply plugin: "com.facebook.react.rootproject"

• Android: android/app/build.gradle contents:

apply plugin: "com.android.application"
apply plugin: 'com.google.gms.google-services' // <- Add this line
apply plugin: "org.jetbrains.kotlin.android"
apply plugin: "com.facebook.react"
apply from: file("../../node_modules/react-native-vector-icons/fonts.gradle")

react {
}
def enableProguardInReleaseBuilds = false
def jscFlavor = 'org.webkit:android-jsc:+'

android {
    ndkVersion rootProject.ext.ndkVersion
    buildToolsVersion rootProject.ext.buildToolsVersion
    compileSdk rootProject.ext.compileSdkVersion

    namespace "com.myapp"
    defaultConfig {
        applicationId "com.myapp"
        minSdkVersion rootProject.ext.minSdkVersion
        targetSdkVersion rootProject.ext.targetSdkVersion
        versionCode 1
        versionName "1.0"
    }
    signingConfigs {
        debug {
            storeFile file('debug.keystore')
            storePassword 'android'
            keyAlias 'androiddebugkey'
            keyPassword 'android'
        }
    }
    buildTypes {
        debug {
            signingConfig signingConfigs.debug
        }
        release {
            // Caution! In production, you need to generate your own keystore file.
            // see https://reactnative.dev/docs/signed-apk-android.
            signingConfig signingConfigs.debug
            minifyEnabled enableProguardInReleaseBuilds
            proguardFiles getDefaultProguardFile("proguard-android.txt"), "proguard-rules.pro"
        }
    }
}

dependencies {
    // The version of react-native is set by the React Native Gradle Plugin
    implementation("com.facebook.react:react-android")
    implementation("com.facebook.react:flipper-integration")
    // implementation platform('com.google.firebase:firebase-bom:32.7.2')
    implementation 'com.google.firebase:firebase-analytics'

    if (hermesEnabled.toBoolean()) {
        implementation("com.facebook.react:hermes-android")
    } else {
        implementation jscFlavor
    }
}

apply from: file("../../node_modules/@react-native-community/cli-platform-android/native_modules.gradle"); applyNativeModulesAppBuildGradle(project)

• Android: AndroidManifest.xml contents:

<manifest xmlns:android="http://schemas.android.com/apk/res/android">

    <uses-permission android:name="android.permission.INTERNET" />
    <uses-permission android:name="android.permission.VIBRATE" />
    <uses-permission android:name="android.permission.RECEIVE_BOOT_COMPLETED"/>
    <uses-permission android:name="android.permission.POST_NOTIFICATIONS"/>
    <uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE"/>


    <application
      android:name=".MainApplication"
      android:label="@string/app_name"
      android:icon="@mipmap/ic_launcher"
      android:roundIcon="@mipmap/ic_launcher_round"
      android:allowBackup="false"
      android:theme="@style/AppTheme">
      <activity
        android:name=".MainActivity"
        android:label="@string/app_name"
        android:configChanges="keyboard|keyboardHidden|orientation|screenLayout|screenSize|smallestScreenSize|uiMode"
        android:launchMode="singleTask"
        android:windowSoftInputMode="adjustResize"
        android:exported="true">
        <intent-filter>
            <action android:name="android.intent.action.MAIN" />
            <category android:name="android.intent.category.LAUNCHER" />
        </intent-filter>
      </activity>
    </application>
</manifest>

Javascript

Click To Expand

package.json:

# N/A

firebase.json for react-native-firebase v6:

{
  "name": "tinderclone",
  "version": "0.0.1",
  "private": true,
  "scripts": {
    "android": "react-native run-android",
    "ios": "react-native run-ios",
    "lint": "eslint .",
    "start": "react-native start",
    "start:backend": "nodemon server.js",
    "test": "jest"
  },
  "dependencies": {
    "@react-native-async-storage/async-storage": "^1.23.1",
    "@react-native-community/masked-view": "^0.1.11",
    "@react-native-community/netinfo": "^11.3.1",
    "@react-native-firebase/app": "^18.8.0",
    "@react-native-firebase/messaging": "^18.8.0",
    "@react-native-firebase/storage": "^19.1.2",
    "@react-navigation/bottom-tabs": "^6.5.20",
    "@react-navigation/drawer": "^6.6.15",
    "@react-navigation/native": "^6.1.17",
    "@react-navigation/stack": "^6.3.29",
    "@reduxjs/toolkit": "^2.2.3",
    "@stripe/stripe-react-native": "^0.37.2",
    "email-validator": "^2.0.4",
    "firebase": "^10.8.0",
    "lottie-react-native": "^6.7.0",
    "react": "18.2.0",
    "react-native": "0.73.6",
    "react-native-bouncy-checkbox": "^3.0.7",
    "react-native-deck-swiper": "^2.0.17",
    "react-native-flash-message": "^0.4.2",
    "react-native-gesture-handler": "^2.16.0",
    "react-native-haptic-feedback": "^2.2.0",
    "react-native-image-picker": "^7.1.2",
    "react-native-linear-gradient": "^2.8.3",
    "react-native-reanimated": "^3.7.0",
    "react-native-safe-area-context": "^4.9.0",
    "react-native-screens": "^3.30.1",
    "react-native-svg": "^15.1.0",
    "react-native-toast-message": "^2.2.0",
    "react-native-vector-icons": "^10.0.3",
    "react-redux": "^9.1.0",
    "setup-tailwind-rn": "^1.1.0",
    "tailwind-rn": "^4.2.0",
    "twrnc": "^4.2.0"
  },
  "devDependencies": {
    "@babel/core": "^7.24.4",
    "@babel/preset-env": "^7.24.4",
    "@babel/runtime": "^7.24.4",
    "@react-native/babel-preset": "0.73.21",
    "@react-native/eslint-config": "0.73.2",
    "@react-native/metro-config": "0.73.5",
    "@react-native/typescript-config": "0.74.0",
    "@types/react": "^18.2.74",
    "@types/react-test-renderer": "^18.0.7",
    "babel-jest": "^29.7.0",
    "eslint": "^8.56.0",
    "eslint-plugin-react": "^7.34.1",
    "eslint-plugin-react-hooks": "^4.6.0",
    "jest": "^29.7.0",
    "prettier": "3.2.5",
    "react-native-dotenv": "^3.4.11",
    "react-test-renderer": "18.2.0",
    "typescript": "5.4.4"
  },
  "engines": {
    "node": ">=18"
  }
}

iOS

Click To Expand

ios/Podfile:

• [ ] I'm not using Pods
• [x] I'm using Pods and my Podfile looks like:

# N/A

AppDelegate.m:

// N/A

---

Android

Click To Expand

Have you converted to AndroidX?

• [ ] my application is an AndroidX application?
• [ ] I am using android/gradle.settings jetifier=true for Android compatibility?
• [ ] I am using the NPM package jetifier for react-native compatibility?

android/build.gradle:

// N/A

android/app/build.gradle:

// N/A

android/settings.gradle:

// N/A

MainApplication.java:

// N/A

AndroidManifest.xml:

<!-- N/A -->

---

Environment

Click To Expand

react-native info output:

 System:
  OS: Windows 10 10.0.19045
  CPU: (12) x64 12th Gen Intel(R) Core(TM) i7-1255U
  Memory: 16.41 GB / 31.75 GB
Binaries:
  Node:
    version: 20.10.0
    path: C:\Program Files\nodejs\node.EXE
  Yarn:
    version: 1.22.21
    path: ~\AppData\Roaming\npm\yarn.CMD
  npm:
    version: 10.2.3
    path: C:\Program Files\nodejs\npm.CMD
  Watchman: Not Found
SDKs:
  Android SDK: Not Found
  Windows SDK: Not Found
IDEs:
  Android Studio: AI-231.9392.1.2311.11255304
  Visual Studio: Not Found
Languages:
  Java: 17.0.9
  Ruby: Not Found
npmPackages:
  "@react-native-community/cli": Not Found
  react:
    installed: 18.2.0
    wanted: 18.2.0
  react-native:
    installed: 0.73.6
    wanted: 0.73.6
  react-native-windows: Not Found
npmGlobalPackages:
  "*react-native*": Not Found
Android:
  hermesEnabled: true
  newArchEnabled: true
iOS:
  hermesEnabled: Not found
  newArchEnabled: Not found

• Platform that you're experiencing the issue on:
  • [ ] iOS
  • [ ] Android
  • [ ] iOS but have not tested behavior on Android
  • [ x] Android but have not tested behavior on iOS
  • [ ] Both
• react-native-firebase version you're using that has this issue:
  • "^18.8.0"
• Firebase module(s) you're using that has the issue:
  • "@react-native-firebase/app": "^18.8.0", "@react-native-firebase/messaging": "^18.8.0", "@react-native-firebase/storage": "^19.1.2", "firebase": "^10.8.0",
• Are you using TypeScript?
  • No & VERSION

---

• 👉 Check out React Native Firebase and Invertase on Twitter for updates on the library.

[mikehardy]

Hi there!

You must not do this:

    "@react-native-firebase/app": "^18.8.0",
    "@react-native-firebase/messaging": "^18.8.0",
    "@react-native-firebase/storage": "^19.1.2",

https://invertase.io/blog/react-native-firebase-versioning

All versions, same version

You might look at our e2e tests to see how we do uploads - it may offer insight:

https://github.com/invertase/react-native-firebase/blob/main/packages/storage/e2e/StorageTask.e2e.js

Can reopen if this continues to happen after lining things up

[github-actions[bot]]

Hello 👋, to help manage issues we automatically close stale issues.

This issue has been automatically marked as stale because it has not had activity for quite some time.Has this issue been fixed, or does it still require attention?

This issue will be closed in 15 days if no further activity occurs.

Thank you for your contributions.