Retrieve the ReadStream from Firebase Storage and provide it as input to the Openai API

I am struggling to retrieve an image from firebase storage and transmit it to an openai endpoint

Here is my current code snippet:

const fileStorage = await getStorageAdmin(uid, "/sample.png");
  const file = fileStorage.createReadStream();

  const maskStorage = await getStorageAdmin(uid, "/mask.png");
  const mask = maskStorage.createReadStream();

 const res = await openai.createImageEdit(
      file,
      prompt,
      mask,
      1,
      "512x512",
      "url"
  ).catch((e) => {
      console.log("ERROR: " + e)
  })

However, executing this code yields a Bad Request (status code: 400).

Interestingly, when I attempted to read the files from the hard disk, it worked flawlessly

const file = fs.createReadStream("./images/anna.png");
  const mask = fs.createReadStream("./images/mask.png");

  const res = await openai.createImageEdit(
      file,
      prompt,
      mask,
      1,
      "512x512",
      "url"
  ).catch((e) => {
      console.log("ERROR: " + e)
  })

This indicates that the API request is valid but there seems to be an issue with reading from firebase storage since that is the only disparity, yet I am unable to identify my mistake. I'm perplexed as to why using fs.createReadStream() and firebase-admin's file.createReadStream results in different outcomes. I assumed both methods should provide the image contents, however, one works while the other does not.

The getStorageAdmin function simply retrieves the reference to the desired file for download.

export const getStorageAdmin = async (uid:string, imagepath:string) =>{
    return await getStorage().bucket().file(uid+imagepath)
}

Answer №1

In my opinion, the firebase.createReadStream() method functions asynchronously.

Therefore, the code should look like this:

const fileStorage = await getStorageAdmin(uid, "/sample.png");
const file = await fileStorage.createReadStream();

Would you be able to provide the function definition for getStorageAdmin()?

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Selective Circle Appending Techniques

I am having some issues with my bubble chart code. The data file I am working with contains instances where the GDPperCapita and/or LifeExpectancy values are either 0 or NaN, causing problems when appending circles to the chart. I would like to know if th ...

Specialized express Validator for 2 particular fields

I currently have 2 custom validators set up for the fields email and phone. check('phone') .not() .isEmpty() .withMessage('Phone should not be empty') .custom(async phone => { const phoneCheck = await ...

The toggle button for columns is not triggering the callback action

When working with the following JSFiddle, I noticed that the action function does not seem to fire whenever a button to select a column in the column visibility tool is selected. Check out the code snippet below for reference: $(document).ready(function( ...

Strategies for managing events within functional React components without relying on mutative operations

Based on insights from Cam Jackson, the recommendation is to utilize Redux and create small, stateless functional components. For example: const ListView = ({items}) => ( <ul> {items.map(item => <ItemView item={item}/>)} ...

Storing an array of JSON objects in separate rows within an SQL database table

I need help with inserting data from an API post request into a MySQL table using Express JS. The JSON array contains multiple objects that I want to fill out the rows in the table, but I can't seem to get it right. Any assistance would be appreciated ...

Using webGL for rendering drawElements

I am working with face-indices that point to specific points to draw triangles in a loop. Unfortunately, when executing my code, I encountered the following error in the web console: WebGL: drawElements: bound element array buffer is too small for given c ...

Steps to update the toolbar color of Mui DataGrid

Check out this unique custom Toolbar I created specifically for Mui dataGrid function CustomToolbar() { return ( <GridToolbarContainer> <GridToolbarColumnsButton /> <GridToolbarFilterButton /> <GridToolbarDensit ...

When using AngularJS, the templateUrl feature delays the initialization of the controller, causing issues with dependent code

Recently, I began experimenting with AngularJS and so far, everything seems to be going smoothly except for one small issue. Let's consider a scenario where I have two directives, with one directive relying on the other, like this: angular.module(&ap ...

An issue has arisen when trying to fetch and parse data using React and JavaScript

I am currently facing some challenges with fetching data from an API and displaying it using React. I have encountered errors and I am struggling with parsing the JSON response from the API. I believe that converting the response into an array may help res ...

JavaScript and Ajax are functioning properly in Mozilla Firefox, however there seem to be some compatibility issues with Google Chrome

I have a form that serves the dual purpose of registration and login, and I am using JavaScript Ajax to submit it. While it works smoothly in Mozilla Firefox, it fails in Chrome and IE. The goal is to execute an AJAX and PHP script that checks the databa ...

Running tasks in the background with Express.js after responding to the client

Operating as a basic controller, this system receives user requests, executes tasks, and promptly delivers responses. The primary objective is to shorten the response time in order to prevent users from experiencing unnecessary delays. Take a look at the ...

Enhance your VueJs application with Chart.js without having to rely on refs for seamless reactive

Currently, I am delving into the world of VueJs and experimenting with Chart.js (https://github.com/apertureless/vue-chartjs). I attempted to make a doughnut chart reactive, but I achieved this using the ref property which I suspect may not be the best pr ...

Creating an interactive /robots.txt file for a Next.js application

I'm looking for a solution to dynamically respond to the /robots.txt request. To achieve this, I have chosen to utilize getServerSideProps https://nextjs.org/docs/basic-features/data-fetching#getserversideprops-server-side-rendering By exporting a ...

Highlighting the current menu item by comparing the URL and ID

Looking to make my navigation menu items active based on URL and ID, rather than href. None of the suggested solutions (like this one, this one, or this one) have worked for me. This is how my Navigation is designed: <nav id="PageNavigation"& ...

The combination of Framer Motion and Next.js is experiencing issues with the useScroll feature not functioning properly when

I attempted to incorporate a scrolling animation into a component with the following code: "use client"; import { useRef, useMemo } from "react"; import { motion, useScroll } from "framer-motion"; import Image from "next ...

Is there a way for me to programmatically modify a .env file using an npm script?

Currently, I'm managing a project with a .env file that contains confidential information. One of the key elements in this file is 'STATUS'. Just to clarify, this pertains to a Discord bot, The value assigned to the 'STATUS' var ...

What is the best way to create dynamic transparency based on cursor position?

Is there a way to create an animation like the one on https://meetwalter.com, where the transparency changes with the cursor's position? I previously attempted a similar implementation using CSS, but it seems that the website accomplishes this effect ...

Managing the ajax response to showcase a button within datatables

Here is my current datatable structure: <table id="list" class="display" width="100%" > <thead> <tr> <th>Title</th> <th>Description</th> <th>delete</th> ...

Having trouble getting webpack to transpile typescript to ES5?

Despite following official guides and various tutorials, I am still facing an issue with compiling my code to ES5 using TypeScript and webpack. The problem is that the final bundle.js file always contains arrow functions. Here is a snippet from my webpack ...

Executing JavaScript code in the Selenium IDE

I'm having trouble figuring out how to execute JavaScript within the Selenium IDE. The objective is to enter text into an input field, with a backend setup that verifies the current time in the input field for testing purposes: Here's the input f ...