OpenAI API: URL을 통해 사용자 메시지 전송

이 Tutorial 에서는 사용자 메시지를 처리하는 방법을 보여드립니다. 이전 비디오 에서는 고정 텍스트("hello")를 사용했지만, 이제 사용자가 제공한 텍스트를 URL 을 통해 전달할 수 있는 기능을 도입하려고 합니다. 사용자에게 제공 된 텍스트를 URL의 쿼리 Parameter 로 추출하여 API에 전달하는 기본 원칙을 이해하고 API와의 개인화 된 상호 작용을 가능하게하기 위해 제공해야합니다.

가장 중요한 인사이트

• 사용자 텍스트를 URL의 쿼리 매개 변수로 전달하고 OpenAI API와 통신하는 방법을 배우게됩니다.
• 또한이 기능을 지원하기 위해 프로젝트에서 필요한 구성을 알게됩니다.

단계별 안내

구현을 수행하려면이 단계별 안내를 따르세요.

단계 1: 준비 사항

먼저 OpenAI API를 올바르게 설정했는지 확인해야합니다. 이전 비디오에서는 API를 호출하고 고정 된 문자열을 사용하는 방법을 보여 드렸습니다. 프로젝트의 기본 구성을 이미 완료해야합니다.

단계 2: URL을 통해 사용자 텍스트 전달

이제 동적 텍스트를 전달할 수 있도록 하려고 합니다. 이는 URL을 통해 쿼리 매개 변수로 응용 프로그램에 전달됩니다. URL에 물음표 뒤에 있는 매개 변수는이 방법에 중요합니다.

이 단계에서는 URL에서 예상 메시지 매개 변수를 추출하는 논리를 통합합니다. 사용하려는 매개 변수는 msg이며 url.searchParams.get("msg")에 의해 가져옵니다.

단계 3: 메시지 처리

텍스트를 추출 한 후 API 요청에 사용해야합니다. 전달 된 텍스트가 실제로 API에 보내지도록 해야합니다.

테스트 중에 "잘못된 요청"과 같은 오류를받으면이는 메시지 전달에 문제가 있다는 것을 나타냅니다. 추출 된 매개 변수에 문제가있는지 확인하십시오.

단계 4: 문제 해결

구성에 문제가 있을 수도 있습니다. 응용 프로그램에 필요한 모든 매개 변수를 올바르게 전달하는지 확인하십시오. 테스트에 고정 된 문자열을 사용하여 작동하는 경우 추출 된 매개 변수에 오류가 있음을 확인 할 수 있습니다.

단계 5: Astro 구성 수정

Astro에서 프로젝트를 구성하는 중요한 요소입니다. Output 값을 Server로 설정해야합니다. 이를 통해 서버 측 렌더링을 가능하게하고 URL 매개 변수를 올바르게 읽을 수 있게합니다.

이 변경 사항은 매개 변수를 올바르게 읽고 API에 전달할 수 있도록하여 중요합니다.

단계 6: 애플리케이션 테스트

이제 응용 프로그램을 테스트 해보세요. API에서 어떤 답변을 받았는지 확인하기 위해 URL에 다양한 입력을 시도해 보세요. 예를 들어 요청은 다음과 같을 수 있습니다: ?msg=Hello World.

응답이 브라우저에 표시되어야하며 요청에 올바르게 응답해야합니다. 모든 것이 올바르게 작동하면 여기에서 AI와의 첫 상호 작용을 이미 볼 수 있습니다.

단계 7: 확장 및 결론

마지막 단계에서 시스템을 확장하려고합니다. API에 단일 텍스트 만 보내는 대신 전체 채팅 이력을 유지하도록 할 수 있습니다. 이를 통해 더 자연스러운 대화를 할 수 있습니다.

추후 비디오에서 React 앱을 더 발전시켜 사용자 친화적인 인터페이스를 만드는 방법을 확인할 것입니다.

요약

이 튜토리얼에서는 OpenAI API를 사용하여 URL 매개변수를 통해 사용자 보고를 전달하는 방법을 배웠습니다. 이제 애플리케이션을 준비, 처리 및 테스트하는 중요 단계를 이해하게 되었습니다.