Cookie Consent by Free Privacy Policy Generator 📌 This firebase error wasted my 161+ hours: make sure it doesn’t yours


✅ This firebase error wasted my 161+ hours: make sure it doesn’t yours


💡 Newskategorie: Programmierung
🔗 Quelle: dev.to

This was my first ever “Big” project created using firebase so i didn’t had much experience with it, but this error wasn’t about experience at all, because even the most professional and experienced developers i knew, which had years and years of experience working with firebase, failed to solve it.

What exactly was this error?

Well, to be specific this error was about CORS policy, which seemed to be quite confusing in itself, but working on this error made all the concepts of CORS policies pretty understandable to me. Since, i had successfully wasted my 161+ Hours working on this single error.

This error simply logged whenever someone tried to upload an image to firebase storage, which should have been quite a simple task, but it turned to be a pretty big mess-

Access to XMLHttpRequest at 'https://firebasestorage.googleapis.com/v0/b/https://yourapp.firebase.app/o?name=collection' from origin '[http://localhost:9000](http://localhost:9000/)' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: It does not have HTTP ok status.

Alright, let me break this down for you. Basically, this error message is saying that whenever someone tries to upload an image to Firebase Storage, it's getting blocked because of something called CORS policy.

Now, CORS policy is like a security measure that determines which web applications are allowed to access resources on a server. In this case, the server is saying, 'Hey, the request to upload this image is coming from a different place than where the image is stored, so I'm not gonna allow it.' It's frustrating because uploading images should be a simple task, but this error turned it into a whole mess.

What DIDN’T i tried?

When reading this error in the console for the first time i thought i just needed to add my domain to the firebase’s storage security rules and i did exactly that but, IT DIDN’T HELP! hmm, so what now? well i tried absolutely everything i possibly could, i rewrote my entire function that was uploading image to firebase, i tried adding CORS.json file to root directory of my project according to a big brained programmer i found on stack overflow, i even tried configuring it from google console, i tried to make it work with Gstuil tool, i tried to make it work with gcloud command line and hundreds of other solution i found online, but nothing seemed to do any good.

At the end of the day, i was so tired and feeling stuck like i never felt before, even the deadline for this project was around the corner, so i decided to get some help from my mentor and i did exactly that, i told him everything about this bug, and he did really well to help me and tried lots of solution on it, but guess that wasn’t it.

💡 Fun fact: even AI (GPT, Bing, and other models) failed to solve it.

Then i gave up! or… did i??

It's already been over 161 hours of me working on this error, but nothing seems to be working at all, i was about to give up, but then i decided to give it another shot, for the last time, But deep down, I felt so demotivated and exhausted that I didn’t know what else to try. I was scrolling through my code, staring at the screen, everything a blur. But then i had that “Wait a minute” feeling when i saw a code snippet in my IDE.

SOLUTION?!?

And then, almost out of desperation, I decided to try a solution that randomly popped into my mind. I took a deep breath and made the leap. It was a moment of truth, staring at my screen while holding my breath as everything depends on it. And to my amazement, it seemed to be working! The code worked perfectly fine, and the error message vanished.

I can't even begin to describe the overwhelming joy and relief I felt at that moment. It was like a weight had been lifted off my shoulders. I was so ecstatic that I almost cried tears of happiness. I've never been this stuck before, so successfully resolving the issue sent my dopamine levels skyrocketing. Against all odds, I did it—somehow.

The snippet i was talking about is the firebaseConfigObject provided by the firebase itself, which if you have every looked carefully you would have noticed that there’s an “authDomain” array inside that object which contains a list of all the domains authorized to access Firebase services. However, when looked in carefully, I didn’t findmy domain, it was missing from this list. And then, I manually added my domain to the 'authDomain' array, like so:

const firebaseConfig = {
  apiKey: "xxxxxxxxxxxxxxxxxxxxxxxxx",
  authDomain: [
    "xxxx.firebaseapp.com",
    "my-domain.com" //this wasn't there!! so added it manually
  ],
  projectId: "xxxx",
  storageBucket: "xxx",
  messagingSenderId: "xxxxx",
  appId: "xxxxxx",
  measurementId: "xxxx",
}

Don't forget to bookmark this page so you can easily revisit this solution whenever you encounter a CORS-related issue with Firebase, whether it's with Firebase Storage or any other Firebase service.

Your support means the world to me, so if you've found my writings helpful, consider showing your love at buymeacoffee.com/lemme.code.

And if you're interested in collaborating on a project, feel free to reach out to me at [email protected].

Thank you from the bottom of my heart for your time and support. 💗

...

✅ This firebase error wasted my 161+ hours: make sure it doesn’t yours


📈 121.6 Punkte

✅ Installing Steam through 'App Center' has caused hours of wasted time.


📈 35.16 Punkte

✅ Firebase After Hours #3: Genkit More than Meets the AI!


📈 23.69 Punkte

✅ Firebase After Hours #2: Go get Gemini


📈 23.69 Punkte

✅ Want to make better food at home? Get 12 hours of expert lessons for just $30


📈 16.94 Punkte

✅ How to Make WhatsApp Status Always Online, Exist 24 Hours!


📈 16.94 Punkte

✅ Learn How to Make Money on Amazon With 40 Hours of Dropship Training


📈 16.94 Punkte

✅ How the UX Lab and Customer Interviews Make Visual Studio Better - Visual Studio Office Hours, 5/14


📈 16.94 Punkte

✅ How to Make WhatsApp Status Always Online, Exist 24 Hours!


📈 16.94 Punkte

✅ English Man Spends 11 Hours Trying To Make Cup of Tea With Wi-Fi Kettle


📈 16.94 Punkte

✅ English Man Spends 11 Hours Trying To Make Cup of Tea With Wi-Fi Kettle


📈 16.94 Punkte

✅ This Excel trick I saw on Instagram will save me HOURS each month and make tracking attendance a breeze


📈 16.94 Punkte

✅ Make your portfolio in just 4 hours? It's possible.


📈 16.94 Punkte

✅ How Fire Extinguishers Took Down Microsoft Services for Nearly 7 Hours


📈 10.53 Punkte

✅ Nokia 6 Hits 250,000 Registrations in 24 Hours, but Only 100,000 Pre-Orders


📈 10.53 Punkte

✅ I tried to give Firefox a second chance, it lasted less than 24 hours.


📈 10.53 Punkte

✅ Hours of Darkness: Erster DLC für Far Cry 5 erscheint am 5. Juni [Notiz]


📈 10.53 Punkte

✅ English Google Webmaster Central office-hours from Nov 12, 2019


📈 10.53 Punkte

✅ English Google Webmaster Central office-hours hangout from July 26, 2019


📈 10.53 Punkte

✅ China’s BGP rerouting leaves European mobile carriers stranded for 2 hours


📈 10.53 Punkte

✅ 'Satisfactory' is a relaxing building sim for PC you can play for hours


📈 10.53 Punkte

✅ Master TikTok marketing with 24 hours of training for $30


📈 10.53 Punkte

✅ 24/7 mom love is the holiday gift we all deserve. Even if it’s during business hours. 🙉 #Shorts


📈 10.53 Punkte

✅ Visual Studio Remote Office Hours - Deep dive into the Visual Studio profiler tools


📈 10.53 Punkte

✅ The Toll of Long Hours on Developers’ Health


📈 10.53 Punkte

✅ Japanese Google Search Office Hours(Google 検索オフィスアワー 2023 年 09 月 28 日)


📈 10.53 Punkte

✅ Microsoft says more than 1 million people joined waitlist in 48 hours to try the new Bing


📈 10.53 Punkte

✅ Learn to Code RPG Version 1.5 is Now Playable with Hours of New Gameplay


📈 10.53 Punkte

✅ Japanese Google Policy Office Hours(Google ポリシー オフィスアワー 2022 年 09 月 29 日)


📈 10.53 Punkte

✅ Pakistan cut off Facebook, Twitter, WhatsApp, and Telegram – for just four hours


📈 10.53 Punkte

✅ Visual Studio Codespaces - Visual Studio Remote Office Hours, July 9


📈 10.53 Punkte

✅ 🎉 Celebrating 90 Hours of Coding! 🚀


📈 10.53 Punkte











matomo

Datei nicht gefunden!