Firebase storage file type is 'octet-stream' instead of 'png/jpg'

user_9565790 0
Viewed 2735

I'm trying to upload images to the firebase storage. When I upload them to the storage, I see them with a type: application/octet-stream instead of image/jpeg or image/png.

This is the code I use:

<input
  type="file"
  id="img"
  name="filename"
  accept="image/*"
  onChange={(e) => {
    handleChange(e);
  }}
/>

const handleChange = async (e) => {
  const imgRef = await firebase.storage().ref('images/' + image.name);
  await imgRef.put(img);
 };

The file gets uploaded to the storage, but with the wrong file type. The documentation of firebase storage tells us that when you upload a file without a file extension it automatically gets the application/octet-stream type. If no contentType metadata is specified and the file doesn't have a file extension, Cloud Storage defaults to the type application/octet-stream. This is really strange because they are uploaded to the firebase storage with the right file extension.

enter image description here

firebase-storage firebase reactjs file-type javascript
2 Answers

I think this solution will apply to your case:

https://stackoverflow.com/a/54303172

You need to either specify the file extension using .child() or add content type metadata to your upload file.

user_116238920

Can add meta data like that:

storageRef.put(file, {
    contentType: 'image/png',
})
user_42673410
Related