플렉스튜디오 시나리오에서 OpenAI API 호출하기
이전 강의를 통해 OpenAI API 키 발급과 플렉스튜디오에서 API를 연동하는 방법을 살펴봤어요. 이제 실제 시나리오에서 API를 호출해 앱에서 데이터를 활용하는 과정을 소개할게요.
이번 예시는 사용자의 요리 실력을 고려해 맞춤형 레시피를 추천해 주는 앱을 만드는 과정을 담았어요. 사용자가 선택한 정보(요리 실력, 음식명 등)는 카테고리(Category)에 담겨 있어요. 앱의 마지막 단계에서 이 데이터를 조합해 API를 호출하고 결과를 사용자에게 보여줍니다.
플렉스튜디오 유튜브에서 영상 강의 보러 가기▼
1단계 : 이벤트 연결
1. 시나리오의 마지막 스텝 선택
2. 스텝 이벤트 사용 활성화 - 이벤트 발생 시점 : 최초 시작전 (Init) / 이벤트명 : API호출
3. 연결한 이벤트로 이동
2단계 : OpenAI API 호출
1. API 호출에 필요한 데이터 확인
- 워크스페이스 - 좌측 데이터 메뉴 - API 연동 버튼 - 호출하려는 모듈 클릭 - Script 탭 클릭
- 전처리 스크립트에서는 role과 content 값을 설정
- role: user
- content: 요리 실력 + 음식명을 결합한 메시지
2. Script 추가
_c.activeSector.role = "user"
_c.activeSector.content = "요리 " + _c.activeSector.level + "인 사람에게 " + _c.activeSector.name + " 레시피를 알려줘."
3. API 추가
4. 생성한 API명을 지정하고 모듈명은 chatGPTChating으로 변경 (API명 : My OpenAI)
5. 보내는 데이터 : 사용자 정보를 담은 카테고리를 지정 (카테고리명 : menu)
6. 받는 데이터 : 카테고리를 지정하고 덮어쓰기로 설정 (카테고리명 : result)
3단계 : 디버거 실행
1. 시나리오 우측 상단의 화살표( ▶ ) 클릭
2. 마지막 스텝 시작 전 이벤트 실행 → 사용자가 입력한 정보를 기반으로 답변 생성
API를 호출하는 또 다른 방법
1. 다시 구현하기 위해 스크립트 스킵 처리
-
- 시나리오 - Dev 모드 - Event 탭 - Script의 SKIP 버튼 활성화
2. 워크스페이스 - 좌측 데이터 메뉴 - API 연동 버튼 - 호출하려는 모듈 - Script 탭 클릭
3. 전처리 스크립트 작성
const item = paramBlocks[0][0]
let params = [{
"role": "user",
"content" : "요리 " + item.level + "인 사람에게 " + item.name + " 레시피를 알려줘."
}];
return params;
4. 변경한 설정을 반영하기 위해 반드시 우측 하단의 배포 버튼 클릭
이제 시나리오에서 API 호출까지 완료했어요. OpenAI API를 활용하면 복잡한 AI 모델을 기반으로 한 기능도 간단히 구현할 수 있습니다.
플렉스튜디오에서 직접 AI 기능을 결합해 나만의 멋진 앱을 만들어 보세요!