Firebase uploadBytes call returning 403 despite user authorized

by

This is my current code:

async newCollectionRequest({ commit }, data) {
  try {
    console.log(data);
    const location = `/pending-images/${data.collectionName}/${data.image.name}`;
    console.log(location);

    const storage = getStorage();
    const storageRef = ref(storage, location);

    // 'file' comes from the Blob or File API
    await uploadBytes(storageRef, data.image);
    console.log('Uploaded a blob or file!');
    return true;
  } catch (error) {
    throw error.message;
  }
},

It seems to be working, but only in that I’m getting a 403 response when attempting to upload the image. I’m unsure why I’m getting a 403 in the first place though as I’ve implemented authentication on the app, and I’ve confirmed the user is logged in when trying to take this action. This is my firebase rule:

rules_version = '2';

service cloud.firestore {
  match /databases/{database}/documents {
    match /{document=**} {
      allow read, write: if request.auth != null;
    }
  }
}

I’m not sure why this is resulting in a 403 error

  • Since you are writing an async function, don’t you want to await the result of uploadBytes instead of using then?

    – 

  • honestly, i didn’t think it mattered yet. this is technically a rough draft, i usually go back and correct for junk writing like that afterwards. will clean that up right away though

    – 

  • Using await will have a very different effect on this function than using then. Right now, your function will return true before the upload is complete.

    – 

  • it didn’t solve the 403, unfortunately. effectively it is the same behavior – except i see now what you mean. you’re totally right about that bug, i hadn’t noticed it yet since the function’s return isn’t hooked up to anything yet

    – 




Leave a Comment