Uploading Image/Video Function is Not Working

General
,
1

***
I decided to build this app again from scratch. The link might not work properly.**
*

Hi everyone, I am having a reoccuring problem with a personal app I wanted to create in Firebase. It’s basically a tracker for everything I wanted to track + a calendar. I am having difficulty uploading images/gifs/videos on the trackers where I wanted this feature added (Movies, Series, Daily, Social Media, & Grocery). It’s a bit frustrating knowing that this uploading function actually worked during the early development of this app which I just started yesterday.

image
image937×506 106 KB

I was able to upload without any problem not until I started fixing the errors that occur after publishing the app. If you would like to look more into it, feel free to access the app via ‘Sign In Anonymoulsy’:

I have already tried the solutions suggested in this doc and also the doc about authentication.

I have also tried running the AI on the browser console, and copy-paste the suggested fix to Firebase Prototyper. I am also thinking of reaching out to support if this cannot be resolved on my end.

Hope someone would be able to shed some light on this.

Thank you!

2

I get the Firebase: Photo URL too long (auth/invalid-profile-attribute) error when I try to change the user photo.

This error appears when you try to set a user’s photoURL in Firebase Auth using a link that exceeds the allowed maximum length.

You will usually trigger this error if:

  • Using a Base64 Data URL as the photoURL: data:image/png;base64,iVBOR…

  • The image URL is extremely long

For the rest off the app you need to set CORS rules for your Storage bucket so your domain is allowed.

(index):1 Access to XMLHttpRequest at ‘https://firebasestorage.googleapis.com/v0/b/studio-4917876957-6590f.appspot.com/o?name=users%2FC368leyiQ4ghAC0OD81ZgH82QUg2%2Fmovie-posters%2F1762421340156-1411fe48-78b0-492f-9d8b-322ad62480ec.png’ from origin ‘https://studio--studio-4917876957-6590f.us-central1.hosted.app’ has been blocked by CORS policy: Response to preflight request doesn’t pass access control check: It does not have HTTP ok status.
903-a94c704d4de2e4dd.js:2 POST https://firebasestorage.googleapis.com/v0/b/studio-4917876957-6590f.appspot.com/o?name=users%2FC368leyiQ4ghAC0OD81ZgH82QUg2%2Fmovie-posters%2F1762421340156-1411fe48-78b0-492f-9d8b-322ad62480ec.png net::ERR_FAILED

1 Like