uploadBytes fails with retry-limit-exceeded in Vite/React App

[AdanAAC]

Operating System

Windows 11

Environment (if applicable)

Microsoft Edge

Firebase SDK Version

9.23.0 and latest

Firebase SDK Product(s)

Storage

Project Tooling

This is a web application built with the following tools:

• Frontend Framework: React
• Build Tool: Vite
• Backend Platform: Firebase (Authentication, Firestore, Storage, Cloud Functions)
• Package Manager: npm

Detailed Problem Description

Hello Firebase Team,

I am experiencing an issue where file uploads to Firebase Storage consistently fail with storage/retry-limit-exceeded when using the JS SDK from my Vite + React application.

Problem:
The uploadBytes function fails after about 2 minutes with a FirebaseError: Firebase Storage: Max retry time for operation exceeded... error. This happens 100% of the time.

Key Debugging Findings:

The issue occurs even with very small files (28-46kb).

My local firewall has been disabled.

Uploading the exact same file manually through the Firebase Console website works perfectly.

The issue still occurs in a minimal, self-contained React test component (code below) that does nothing but call uploadBytes.

A CORS policy has been correctly set on the bucket to allow my localhost origin.

I have tried the latest Firebase SDK version (firebase@latest) and have downgraded to 9.23.0 with no change in behavior.

Project Configuration:

Plan: Blaze (Pay-as-you-go)

Location: nam7

Storage Rules: allow read, write: if request.auth != null;

Steps and code to reproduce issue

Minimal Reproduction Code (SimpleUploader.jsx):

JavaScript

import React from 'react';
import { storage } from '../firebase';
import { ref, uploadBytes } from 'firebase/storage';

export const SimpleUploader = () => {
const handleFileUpload = async (e) => {
const file = e.target.files[0];
if (!file) return;

    console.log(`Attempting to upload: ${file.name}, Size: ${file.size} bytes`);
    
    try {
        const storageRef = ref(storage, `test-uploads/${file.name}`);
        const snapshot = await uploadBytes(storageRef, file);
        console.log('SUCCESS! File uploaded successfully.', snapshot);
        alert('SUCCESS! The file uploaded correctly.');
    } catch (error) {
        console.error('UPLOAD FAILED:', error);
        alert(`UPLOAD FAILED: ${error.message}`);
    }
};

return (
    <div>
        <input type="file" onChange={handleFileUpload} />
    </div>
);

};

Console Output from Minimal Test:
Attempting to upload: the-home-depot-receipt-6z8m0kd0g27xuylw.jpg, Size: 214173 bytes
UPLOAD FAILED: FirebaseError: Firebase Storage: Max retry time for operation exceeded, please try again. (storage/retry-limit-exceeded)

[google-oss-bot]

I couldn't figure out how to label this issue, so I've labeled it for a human to triage. Hang tight.