Next.js AI SDK Tutorial - 21 - Web Search Sources
- AI 검색 시 정보 출처를 명시하여 사용자의 신뢰도를 높이고 검증 가능성을 제공 🧐
- Next.js AI SDK를 사용하여 웹 검색 결과에 출처를 쉽게 추가 가능 ➕
- route handler에서
sendSources: true
옵션을 설정하여 출처 활성화 ⚙️
- UI에서 메시지 파트를 필터링하여 'source URL' 타입의 출처 추출 🔍
- 추출된 출처 정보를 UI에 표시하여 사용자가 클릭하여 검증 가능하도록 구현 🖱️
- 출처의 title이 존재하면 title을 사용하고, 없을 경우 URL을 대신 표시 ℹ️
- React Fragment를 사용하여 Tool call UI와 출처 목록을 함께 렌더링 ⚛️
- OpenAI 웹 검색의 경우 UI 요구 사항에 따라 출처 표시 위치 조정 가능 🔄
- 사용자는 AI가 제공한 정보의 출처를 직접 확인하고 신뢰성을 판단할 수 있음 ✅
- AI에 대한 맹목적인 신뢰 대신 정보 검증, 심층 탐색, 출처 신뢰도 판단 가능 💡