Loading pattern preview
PatternsTools & Utilities
Web Search Tool
Web Search Tool
Search the web using OpenAI's tool with real-time results. Includes source verification, citation tracking, and contextual answers.
Loading pattern preview
Problems solved
Technical challenges this implementation handles out of the box.
- Force OpenAI web_search_preview on every query
- Return AI-synthesized answers grounded in web search
- Configure search context size and optional user location
Use cases
Products and workflows this pattern is designed to support.
- Web search answer boxes
- Research lookup tools
- Local-aware search demos
- OpenAI web search integration samples
Setup
Requirements, wiring steps, and what this pattern adds to your project.
Getting started
Pick how you want to pull this pattern in. Then wire env vars and routes the same way.
- 1
Install from the preview toolbar
Copy the install command above and run it in your project — Pro patterns include a short-lived token.
- 2
Add environment variables to .env.local
OPENAI_API_KEY
- 3
Customize the agent and tool files
Adapt prompts, tools, and stop conditions for your product — Copy for AI in the toolbar helps seed that work.
- 4
Run your dev server and open the pattern route
Install dependencies if needed, then start the app and verify responses.
Environment variables
OPENAI_API_KEYGet key
Capabilities
AI SDK APIs
generateTexttoolProviders
OpenAI
Files added
3 filesapp/page.tsxapp/layout.tsxREADME.md
Dependencies
13 totalnpm packages
9AISDK@hookform/resolversUpstashlucide-reactmotionNext.jsReactreact-hook-formZod
Registry components
buttonforminputskeleton
Critical files
lib/actions.tsCore AI web search pipeline: uses OpenAI responses model with the webSearchPreview tool and forced toolChoice to always perform web search. Configures search context size and extracts normalized sources.
Requirements
- Complexity
- Beginner
- Setup time
- ~5 minutes
- Node
- >=18.0.0
