GraphQL Image Upload Issue

[simon8889]

I'm working on a mini-project to learn GraphQL, using GraphQL, Strawberry, and FastAPI. I'm trying to upload an image using a mutation, but I'm getting the following error:

{
  "detail": "Missing boundary in multipart."
}

I searched for solutions, and ChatGPT suggested replacing the Content-Type header with:

multipart/form-data; boundary=----WebKitFormBoundary7MA4YWxkTrZu0gW

However, when I try that, I get another error:

Unable to parse the multipart body

I'm using Altair as my GraphQL client because GraphiQL does not support file uploads.

Here is my main.py:

from fastapi import FastAPI, status
from contextlib import asynccontextmanager
from fastapi.responses import JSONResponse
from app.database import init_db
from app.config import settings
from app.graphql.schema import schema
from strawberry.fastapi import GraphQLRouter
from app.graphql.query import Query
from app.graphql.mutation import Mutation

@asynccontextmanager
async def lifespan(app: FastAPI):
    init_db()
    yield

app: FastAPI = FastAPI(
    debug=settings.DEBUG,
    lifespan=lifespan
)

schema = strawberry.Schema(query=Query, mutation=Mutation)

graphql_app = GraphQLRouter(schema, multipart_uploads_enabled=True)

app.include_router(graphql_app, prefix="/graphql")

@app.get("/")
def health_check():
    return JSONResponse({"running": True}, status_code=status.HTTP_200_OK)

Here is my graphql/mutation.py:

import strawberry
from app.services.AnimalService import AnimalService
from app.services.ZooService import ZooService
from app.graphql.types import Zoo, Animal, ZooInput, AnimalInput
from app.models.animal import Animal as AnimalModel
from app.models.zoo import Zoo as ZooModel
from typing import Optional
from strawberry.file_uploads import Upload
from fastapi import HTTPException, status

@strawberry.type
class Mutation:
    @strawberry.mutation
    def add_zoo(self, zoo: ZooInput) -> Zoo:
        new_zoo: ZooModel = ZooModel(**zoo.__dict__)
        try:
            return ZooService.add_zoo(new_zoo)
        except:
            raise HTTPException(status_code=status.HTTP_500_INTERNAL_SERVER_ERROR)

    @strawberry.mutation
    def add_animal(self, animal: AnimalInput, file: Optional[Upload] = None) -> Animal:
        new_animal: AnimalModel = AnimalModel(**animal.__dict__)
        try:
            return AnimalService.add_animal(new_animal, file)
        except:
            raise HTTPException(status_code=status.HTTP_500_INTERNAL_SERVER_ERROR)

    delete_zoo: bool = strawberry.mutation(resolver=ZooService.delete_zoo)
    delete_animal: bool = strawberry.mutation(resolver=AnimalService.delete_animal)

I would really appreciate any help in understanding why the multipart upload isn't working. Any insights or fixes would be greatly appreciated!