Using the Gemini File API for Prompts with Media

[giscus[bot]]

Using the Gemini File API for Prompts with Media

A look at how the File API can make working with multimodal prompts easier.

https://www.raymondcamden.com/2024/05/21/using-the-gemini-file-api-for-prompts-with-media

[Itzmadukz]

Hello Raymond, thanks for the demo and explanation. I was curious about how this would work in a client centred application where the image is uploaded via an input tag and extracted by handling the event via a const file = event.target.files[0].

I tried building a demo of this and when i pass the 'file' from the user input as a parameter to

    mimeType,
    displayName: path,
  }); ```

The API returns an error '
```TypeError: (0 , import_fs.readFileSync) is not a function
    at GoogleAIFileManager.uploadFile ( ```


Would you say File manager does not work with inputs or there is a workaround. Appreciate any response. 

stack overflow question -- > https://stackoverflow.com/questions/78795207/passing-images-from-browser-input-uploads-to-googleaifilemanager-react-app

[cfjedimaster]

Sorry for the delay - I was on vacation last week. So, a couple of things come to mind.

First, note that the Gemini APIs are probably not something you want to use in a client side application as you would need to embed your keys. Instead, you would want to use server-side functions instead.

I would not try to use the NPM libraries in client-side code, but instead, hit the REST APIs directly. I haven't done that for the Files API, but for the 'regular' stuff (prompt to result), it worked quite well.