Vertex AI SDK for Web returns [503 ] The service is currently unavailable.

[shangyilim]

Operating System

Mac OS X: 14.1.0

Browser Version

Chrome/124.0.0.0

Firebase SDK Version

10.11.0-vertexai-preview.1aadc47e

Firebase SDK Product:

VertexAI

Describe your project's tooling

React app with webpack

Describe the problem

When trying out Generate text from multimodal prompts using the Gemini API , when calling await model.generateContent([prompt, imagePart]);, an error is returned

App.tsx:54 Uncaught (in promise) Error: [503 ] The service is currently unavailable.
    at makeRequest (firebase_vertexai.js?v=2ea05d22:148:13)
    at async generateContent (firebase_vertexai.js?v=2ea05d22:468:20)
    at async generateResponse (App.tsx:47:18)

However, when using generateContentStream it works as expected.

Steps and code to reproduce issue

simple run the following code from the code sample provided in Generate text from multimodal prompts using the Gemini API , , particularly this line:

  // To generate text output, call generateContent with the text and image
  const result = await model.generateContent([prompt, imagePart]);

When using short prompts, this works as expected. However longer prompts causes the above error to occur. Prompt used:

Click me

You are a nutritionist bot. You analyze the meal for a healthy and Balanced Diet. In order to do so you must refer to the following information: ---- Building a Healthy and Balanced Diet Make most of your meal vegetables and fruits which consist of half of your plate. Aim for color and variety, and remember that potatoes don’t count as vegetables on the Healthy Eating Plate because of their negative impact on blood sugar. Go for whole grains which is quarter of your plate. Whole and intact grains i.e. whole wheat, barley, wheat berries, quinoa, oats, brown rice, and foods made with them, such as whole wheat pasta have a milder effect on blood sugar and insulin than white bread, white rice, and other refined grains. Protein powder which is quarter of your plate. Fish, poultry, beans, and nuts are all healthy, versatile protein sources, they can be mixed into salads, and pair well with vegetables on a plate. Limit red meat, and avoid processed meats such as bacon and sausage. Consume Healthy plant oils in moderation. Choose healthy vegetable oils like olive, canola, soy, corn, sunflower, peanut, and others, and avoid partially hydrogenated oils, which contain unhealthy trans fats. Remember that low-fat does not mean “healthy.” Drink water, coffee, or tea. Skip sugary drinks, limit milk and dairy products to one to two servings per day, and limit juice to a small glass per day. Stay active. The red figure running across the Healthy Eating Plate’s placemat is a reminder that staying active is also important in weight control. The main message of the Healthy Eating Plate is to focus on diet quality: The type of carbohydrate in the diet is more important than the amount of carbohydrate in the diet, because some sources of carbohydrate such as vegetables (other than potatoes), fruits, whole grains, and beans are healthier than others. The Healthy Eating Plate also advises consumers to avoid sugary beverages, a major source of calories, usually with little nutritional value in the American diet. The Healthy Eating Plate encourages consumers to use healthy oils, and it does not set a maximum on the percentage of calories people should get each day from healthy sources of fat. In this way, the Healthy Eating Plate recommends the opposite of the low-fat message promoted for decades by the USDA. --- Based on the information given above, look at the picture below. Identify the name of the meal and the calorie count. From the meal, breakdown the ingredients as granular as possible but categorize them between "carbohydrates", "vegetables and fruit", "protein" and "other". For nutrition info, identify the percentage of each type of ingredient is in the picture, and the recommended percentage (in whole number) represented in of each type of ingredient. There recommended percentage should not be a range and must be a whole number. Identify potential allergens in the ingredients. In the conclusion, explain why it is recommended or not recommended, and helpful suggestions to make the meal healthy with some examples based on the information given at the top. RecommenOutput the answer only in valid JSON that can be used in another application or system:{ "meal": [string], "calorie_count": [decimal], "ingredients": [ { "name": [string], "type": [string], "allergen": [boolean] }, ], "nutrition_info": [ { "type": [string], "percentage": [decimal], "recommended_percentage": [decimal] } ], "conclusion": "[string]", "meets_recommendation": [boolean] 

[google-oss-bot]

I couldn't figure out how to label this issue, so I've labeled it for a human to triage. Hang tight.

[jbalidiong]

Hi @shangyilim, thanks for bringing this to our attention. I’m currently checking this with our engineering team. I’ll update this thread if I have any information to share.

[bonarjs]

I'm in a similar situation, but sometimes it works and most of the time it doesn't work (with the same prompt); I couldn't understand the circumstances!

[dlarocque]

Hi @bonarjs @shangyilim , thanks for reporting the issue! We believe this is caused by requests to the backend taking too long and being timed out. The fix for this will be going in soon, but in the meantime you can use generateContentStream since the initial response should be faster and therefore less likely to be timed out.

I will send an update here when this issue is fixed.

[dlarocque]

Hi @bonarjs @shangyilim, the timeouts for generateContent requests have been extended, so this issue should be fixed.
I will close this, but if you continue to run into issues please let me know and I will open it again.