Questions tagged [firebase-storage]

Firebase Storage (formerly known as Cloud Storage for Firebase) offers developers a reliable and secure solution for transferring data via the Firebase SDKs. It efficiently manages network disruptions and ensures seamless authorization. With support from Google Cloud Storage, it empowers you to seamlessly transition from initial concepts to full-scale production environments.

The image source failed to load the image using the function

Initially, I set up a sandbox to work on this issue: https://codesandbox.io/s/naughty-almeida-u66mlt?file=/src/App.js The main problem arises when the requested image fails to display after the function is called and the URL is returned. Here are my atte ...

Experiencing difficulties with arrays in JavaScript while using React Native

Programming Challenge let allURL = [] const [toReadURL, setToReadURL] = useState([]) useEffect(() => { const listReference = sReference(storage, parameterKey) // Retrieve all the prefixes and items. listAll(listReference) .then((res ...

Loading a Vue.js template dynamically post fetching data from Firebase storage

Currently, I am facing an issue with retrieving links for PDFs from my Firebase storage and binding them to specific lists. The problem arises because the template is loaded before the links are fetched, resulting in the href attribute of the list remainin ...

Unable to change the Content-Disposition to 'inline' in Firebase Storage using the Admin SDK for Node.js

Is there a way to change the default content-disposition: attachment HTTP header in Firebase Storage to content-disposition: inline for displaying public images directly in the browser (via <a href="..."> links) instead of forcing them to download? ...

After successfully uploading to AngularFireStore, I encountered difficulty in retrieving the variable from within the getDownloadUrl() function

After successfully uploading images into my firebase storage, I encountered an issue when trying to retrieve the download URL and add it to my firestore database. When logging "URL", I get the desired link but faced difficulty using it. Initially, I attem ...

Removing data from firestore/storage does not follow the expected pathway

I have created an image gallery for users using Firebase Storage and React, allowing them to upload and delete images. However, I am facing an issue where the deletion process is taking longer than expected. Expected flow: User clicks on the trashcan ico ...

Fetching an image from Firebase Storage for integration into a Vue application

I am encountering an issue while trying to fetch an image from my firebase storage to display it in my Vue application. The upload process from the app to firebase storage runs smoothly, but there is an error during retrieval. My setup involves using the F ...

Is there a way to verify if the data_URL is specifically delivering a video or image file? - Utilizing Firebase with Next.js/React

After uploading the image to Firebase, it is returned as a unique data URL format: https://firebasestorage.googleapis.com/v0/b/app_name/o/posts%2postId?alt=media&token=token The challenge lies in determining whether the file type is a video or an imag ...

Steps to obtain the download URL from AngularFireStorage after uploading the file using the getDownloadUrl() method

After successfully uploading images into my firebase storage, I want to retrieve the downloadURL and add it to my firestore database. When console logging "url", I am able to see the desired link. However, I am facing difficulties in using it. When attemp ...

Troubleshooting Problem with Uploading Several Photos to Firebase Storage

I need assistance with uploading multiple photos to Firebase Storage. Despite my efforts, it seems that the original upload keeps getting overwritten and the folder with the venueID property is not being created. Can someone provide some guidance on this i ...

I need guidance on how to successfully upload an image to Firebase storage with the Firebase Admin SDK

While working with Next.js, I encountered an issue when trying to upload an image to Firebase storage. Despite my efforts, I encountered just one error along the way. Initialization of Firebase Admin SDK // firebase.js import * as admin from "firebas ...

Images stored in Firebase Storage are not appearing on my Next.js application

I've been using the Next.js template from Vercel and attempting to switch out the logo image at the bottom with one stored in Firebase storage. Although I have configured the next.config.js file without any errors, the image does not appear on the pag ...

Vue.js - The prop "src" is invalid as the type check has failed. The expected type should be either a string or an object, but a

I am currently working on integrating an image into my Firebase's Firestore and Storage, and then displaying it on a v-card component. Here is the code for my v-card: <v-row> <v-col cols="3" v-for="massage in massages" ...

Getting content from a URL and storing it using Firebase Storage and Cloud Functions: a complete guide!

I have a real-time database where users can input the URL of an image. After triggering a cloud function upon creation/update, I am able to read the image's URL from the real-time database. Now, my goal is to download the image from the web (not uplo ...

What is the best way to transfer an image from Firebase storage to the Facebook Marketing API?

Could someone assist me in understanding how to download an image from Node/Express/Cloud Functions for Firebase? Currently, I'm only able to retrieve an object containing information about my image in Firebase storage (using getMetadata();) let ima ...

Firebase: Troubleshooting the issue of photoURL returning null in web applications

My website includes user account creation functionality using Firebase authentication with email and password. However, newly registered users do not have a displayName or photoURL initially. A problem arises when a user uploads an image on the account da ...

Tips for uploading numerous images to Firebase using React Native Fetch Blob

I have a collection of images stored in an array (image paths are stored in the array). I am trying to upload each image using a for loop, but only the last image gets uploaded. My approach involves using React Native Fetch Blob and Firebase for this task. ...

Download files from Firebase storage to a user's device

I have a variety of files such as images, videos, and audio stored in my firebase storage. My goal is to provide users with the ability to download these files to their computers by clicking on a download button. After reviewing the firebase documentation ...

Delaying the activation of the code until the image upload is complete

I'm having trouble synchronizing code to upload an image using a vue composable, wait for the upload to finish, and then store the Firebase storage URL into a database. Despite getting the URL, the success code fires before the upload is complete. My atte ...

Exploring the connection between a handful of documents using NextJs and Firebase

Wishing you a fantastic day! I'm a beginner with NextJs and I'm encountering an issue when trying to map my Firebase documents. I want to display 5 cards on my website, but I'm having trouble limiting the posts displayed. Here is my referen ...

Angular 5 Image Upload - Transfer your images with ease

I am having trouble saving a simple post in firebase, especially with the image included. This is my current service implementation: uploadAndSave(item: any) { let post = { $key: item.key, title: item.title, description: item.description, url: '', full ...

There appears to be an issue with the error handling function within React

I am facing an issue with my error function while checking the browser error, and I am unsure why adding a console.log with the error is causing trouble. I need some assistance in troubleshooting this problem which seems to be occurring at line 29 of my im ...

Error in Firebase Emulator: The refFromUrl() function requires a complete and valid URL to run properly

Could it be that refFromURL() is not functioning properly when used locally? function deleteImage(imageUrl: string) { let urlRef = firebase.storage().refFromURL(imageUrl) return urlRef.delete().catch((error) => console.error(error)) } Upon ...

How can I efficiently fetch data from Firebase, manipulate it through computations, and present it using React Hooks?

I am currently working on retrieving multiple "game" objects from Firebase Storage, performing statistical calculations on them, and then presenting the game statistics in a table. Here is an overview of my code structure: function calculateTeamStatistics( ...

The process of efficiently uploading a batch of images to Firebase storage while also obtaining all the respective

I have been using firebase storage to upload images and save their respective URLs in the firebase database. However, I recently encountered an issue with my code. In firebase v8, everything was working fine, but after updating to version 9, the following ...

Strategies for securing Firebase storage in Next.js without relying on Firebase authentication

Utilizing firebase storage for file uploads on my next.js page. Users complete a form and the files are uploaded to firebase storage (using a different database). I am seeking a way to restrict file uploads only within this post request. import React, { u ...

The picturepath is causing a hindrance in posting form data to MongoDB

I am currently facing challenges while attempting to send form data, including file uploads, to MongoDB through Multer and Express. Although the files are successfully uploaded to Firebase Storage, I am unable to post the form data to MongoDB. Moreover, my ...

Deleting a file directory in Pyrebase storage without using a token: a step-by-step guide

I am currently developing an app that utilizes Firebase and Pyrebase as a wrapper. In the documentation, I noticed that the delete function requires a userIdToken parameter like this: storage.delete("images/example.jpg", user["idToken"]) Since my app does ...

Encountered a delay during the transfer of a file from storage to an FTP server via a cloud-based function

I'm currently facing an issue while attempting to transfer a file from storage to an FTP server using a triggered Node.js function. Every time a specific file is uploaded to Firebase storage, it should automatically be transferred to the FTP server. To ac ...

Node encountering an ENOENT error while invoking the Ffmpeg binary through the Fluent-Ffmpeg API

Scenario I am currently developing a Firebase function in Node.js. The main goal is to trim an incoming audio clip to a specific length using FFmpeg and Fluent-FFmpeg. Challenge However, I encountered an issue when the function is triggered in Firebase. ...

Encountering an endless loop while attempting to retrieve data from Firebase in Next.js through the use of useEffect

Currently, I am in the process of setting up a video section for a project using NextJS. The videos are stored in firebase storage. I have implemented a dynamic route that retrieves all videos from a specific reference within the bucket. For instance, if ...

Guide to displaying all files from firebase storage on a screen

I'm struggling to display all the files from my firebase storage. I've tried pushing them into an array, but I can only get one file name. Any ideas on how to push all the files into the fileName array? function Home() { const [fileURL, setFileURL] = u ...

What is the process for loading a model using tf.loadModel from firebase storage?

I'm currently working on an app using the ionic3 framework that recognizes hand-drawn characters. However, I am encountering difficulties with importing the model into my project. The model was initially imported from Keras and converted using tensorf ...

What is the process for uploading files using AngularFire on Firebase Storage?

Despite watching multiple videos and tutorials, I am encountering a 403 error while working with Angular 1. To solve the issue of ng-model not supporting files, I created an Angular directive named file-model: app.directive('fileModel',['$ ...

How can one easily retrieve the download URL from Firebase Storage paths within Angular templates?

In some instances, I've come across cases where individuals store the actual download path in firestore and then use that image later on in templates. However, I'm not entirely convinced that this is the best approach for saving file locations. The issue ...