GEMINI API

LOOKY 프로젝트에 새로운 기능을 고민하다가 이미지를 업로드하기 전에 해당 이미지 스타일을 AI에게 평가를 받을 수 있는 기능을 추가하기로 하였다.

 

이미지와 관련된 AI를 제공하는 API가 많지않아서 힘들었지만 그러다가 GEMINI API를 발견했다 !

https://blog.google/technology/google-deepmind/gemini-model-updates-february-2025/?fbclid=IwY2xjawISLy9leHRuA2FlbQIxMQABHbqJ-zu5b84bNx1LkghYdtz5m3bqQCwPhqALJ_zWdPnb6dQiqvqacdiXgA_aem_ghSNBqDFnh8AfLY7QxXqNA

Gemini 2.0 is now available to everyone

 

우선 API키를 가져온다.

Gemini API 키 가져오기  |  Google AI for Developers

 

 

 

 

const GEMINI_VISION_API_URL =
  "https://generativelanguage.googleapis.com/v1beta/models/gemini-2.0-flash-001:generateContent";
const apiKey = process.env.REACT_APP_GEMINI_API_KEY;

 

Gemini Vision API는 바이너리 파일(File 객체, Blob 등)을 직접 전송하는 방식을 지원하지 않는다.
👉 대신, Base64로 변환된 문자열 형태의 이미지 데이터만 처리 가능하기 때문에 FileReader()를 이용 

이후 POST 요청에 이미지 데이터 + 요청 TEXT를 함께 보내 해당 이미지의 스타일과 이유를 반환하게 함!

export async function analyzeImage(imageFile: File): Promise<string> {
     if (!apiKey) {
       throw new Error("API 키가 설정되지 않았습니다.");
     }

  const reader = new FileReader();

  return new Promise((resolve, reject) => {
    reader.onload = async () => {
      try {
        const base64Image = reader.result?.toString().split(",")[1];

        const response = await fetch(`${GEMINI_VISION_API_URL}?key=${apiKey}`, {
          method: "POST",
          headers: {
            "Content-Type": "application/json",
          },
          body: JSON.stringify({
            contents: [
              {
                parts: [
                  {
                    inline_data: {
                      mime_type: imageFile.type,
                      data: base64Image,
                    },
                  },
                  {
                    text: "패션 스타일을 미니멀,캐주얼,아메카지,시티보이,스트릿,스포티,유니크,러블리,레트로 중 하나를 한마디로 말해주고 그 이유를 설명해줘",
                  },
                ],
              },
            ],
          }),
        });

        const data = await response.json();

        // ✅ API 응답 데이터 타입을 명확히 지정
        const result: string =
          data?.candidates?.[0]?.content?.parts?.[0]?.text || "분석 실패";

        resolve(result);
      } catch (error) {
        reject("에러 발생: " + String(error));
      }
    };

    reader.onerror = (error) => reject("파일 읽기 오류: " + String(error));
    reader.readAsDataURL(imageFile);
  });
}