ChatGPT로 이미지 해석하기 - 스프링부트에서 Vision API 사용하기

들어가기 앞서 아직 이 기능은 GPT 홈페이지에서는 제공하지 않는다.

 

아직은 API로만 사용 가능한 것으로 확인된다.(GPT-Turbo를 개발자에게 우선 제공한다고 하긴 했다)

 

 

11월 6일부터 GPT-4 Turbo를 사용할 수 있게 되었다.

 

가장 눈에 띄는건 토큰 수가 12만 8천개 까지 증가했다는 것이다.

 

11월 6일 샘 알트먼의 발표에 따르면, 토큰 활용 개수를 증가시키고 가격도 인하했다고 한다. 

 

또한, 23년 4월까지 학습시킨 데이터를 기반으로 응답을 주기 때문에 기존 22년 1월까지의 데이터에 비해 비교적 최신 데이터로 갱신 되었다고 한다.

 

그리고 몇 가지 기능이 추가 되었는데, 그 중 하나가 

 

모델들을 살펴보면, gpt-4-vision-preview가 추가 되었는데 이 모델을 통해 이미지 인식을 해볼 수 있다.

 

바로 사용해보자.

Vision API

openAI에서는 이 기능을 Vision이라고 소개했다. 

https://platform.openai.com/docs/guides/vision

 

특이한 점은 이미지를 파일로 받지 않고 url, base64로 받는다는 점이다.

(음성 인식 API도 나와서 확인하고 있는데, 요청 파일 형식이 안맞아서 고생하고 있다...이부분이 꽤나 편했다.)

 

멀티모달이라고 해서 이미지를 여러개 넣는 방식도 있는데, 이번 예제에서는 이미지 하나만 다뤘다.

구현

요청 객체는 따로 만들지 않았고, 데이터 전송을 위한 Dto와 Vo는 포스팅이 너무 길어져서 남기진 않을 것 같다.

(추후에 GitHub에 추가하고 공유할 예정)

 

FeignClient

@FeignClient(name = "OpenAIClient", url = "${openAi.url}", configuration = {OpenAIHeaderConfig.class})
public interface OpenAIFeignClient {
    @RequestMapping(method = RequestMethod.POST, value = "/chat/completions")
    Object chatCompletionVision(@RequestBody RequestVisionDto requestVisionDto);

}

 

Service

일단 테스트 용도기 때문에 별도의 요청으로 처리하진 않았고, 질문인 text와 image_url은 하드코딩으로 처리했다.

@Service
@RequiredArgsConstructor
public class OpenAiService {
    private String visionModel = "gpt-4-vision-preview";
    private final OpenAIFeignClient openAIFeignClient;
    
    public Object getVisionResult() {
        List<VisionMessageVo> visionMessageVos = new ArrayList<>();
        List<Object> content = new ArrayList<>();
        content.add(new ChatContentTextVo("text", "What’s in this image?"));
        content.add(new ChatContentImageVo("image_url","https://upload.wikimedia.org/wikipedia/commons/thumb/d/dd/Gfp-wisconsin-madison-the-nature-boardwalk.jpg/2560px-Gfp-wisconsin-madison-the-nature-boardwalk.jpg"));
        visionMessageVos.add(new VisionMessageVo("system", "You must answer to Korean. and make summary to three sentences."));
        visionMessageVos.add(new VisionMessageVo("user", content));

        return openAIFeignClient.chatCompletionVision(RequestVisionDto.builder()
                                                                      .model(visionModel)
                                                                      .messages(visionMessageVos)
                                                                      .maxTokens(300)
                                                                      .build());
    }
}

 

그냥 사용하기엔 재미 없으니, 한글로 세줄 요약을 해달라는 프롬프트를 추가 작성했다.

 

Controller

@GetMapping("/vision")
public ResponseEntity<Object> getVisionResult() {
    Object response = openAiService.getVisionResult();
    return new ResponseEntity<>(response, HttpStatus.OK);
}

 

예제에 사용한 이미지

 

결과

생각보다 잘 해석해준다.

 

조금 더 어려운 이미지를 해보자.

 

 

사람이 보기에도 모르는 동물들이 많아서 답변이 쉽지 않은데, 답변을 잘 생성해준다.

 

기린, 얼룩말은 없는데 사바나 동물들이 모여있는 건 맞는 것 같으니 이 정도 해석이면 충분히 잘해낸 것 같다.

 

그리고 OCR(Optical character recognition, 광학 문자 인식) 을 상당히 잘해준다. 

 

한글로 생성된 것도 잘 인식하고 변환해주니 한번 사용해보길 권장한다.

 

가격

이전까진 가격에 대해선 따로 언급하진 않았다.(Chat, Embedding은 비용이 굉장히 저렴하다).

 

그런데, 이번에는 비용이 꽤 청구될 수 있어서 정리해본다.

 

비용은 이미지 크기와 상세 옵션에 따라 결정된다.

 

디테일이 적은 이미지는 무조건 85토큰으로 책정.

 

디테일이 많은 이미지는 2048 x 2048 정사각형에 맞춰 크기를 조정 후,

 

512픽셀 정사각형으로 구성된 개수에 따라 170 토큰이 추가된다. 항상 최종 합계에는 85토큰이 추가 된다.

1024 x 1024 이미지의 경우, 초기 크기 조정 없기 때문에 765 토큰

2048 x 4096 이미지의 경우, 1024 x 2048 로 축소하고 1105 토큰

입력 크기에 관계 없이 디테일이 낮은 이미지(low resolution) 는 고정 비용으로 85 토큰 

 

가격에 대한 디테일한 정보는 Pricing에서 확인

 

Github

요청 URL을 받을 수 있게, 별도의 레포로 추후 추가 예정

마치며

이 내용은 2017년 대학원을 졸업할 때, 내 인공지능 연구 분야와 거의 일치한다...

 

그때는 단순 이미지를 사과, 컵, 그릇과 같이 간단한 사물만 분류했었고 성공률이 97% 이상이라

 

이 분야에 대한 연구가 거의 끝났다고 생각했다.

 

그래서 Vision API처럼 이미지 전체를 해석하는 방법에 초점을 맞췄는데 5년만에 이렇게까지 진행된걸 보니

 

기술의 발전이 정말 상상이상으로 빠르다는걸 느낀다.

 

어쩌면 지금 서비스 개발 쪽으로 빠르게 넘어온 게 다행이지 않을까란 생각이 든다.