ChatGPT AI: Enhance ChatGPT with Web Search (Difficulty: 4)

CreatiCode

Introduction

AI tools like ChatGPT learn everything they know from a HUGE pile of information they were “fed” when they were created. This is called their training data. Think of it like all the books they’ve ever read.

But here’s the catch: once their training is done, they don’t automatically learn new things that happen in the world. There’s a “knowledge cutoff date,” meaning they won’t know about stuff that happened after that date.

For example, if we asked ChatGPT, “What is Google’s stock price today?” It won’t be able to answer. Why? Because ChatGPT’s cutoff date is usually a few months before today.

You’d see something like this:

Giving ChatGPT a Helping Hand!

So, how can we fix this? We can teach ChatGPT to ask for help when it’s stumped! The idea is very similar to how we teach ChatGPT to ask for help with math calculations.

Imagine our program, you (the user), and ChatGPT are like three friends chatting. The conversation might go something like this:

You (to our Program): What is Google’s stock price today?
Our Program (to ChatGPT): Hey ChatGPT, can you try to answer this: What is Google’s stock price today? By the way, if you need to look something up online, I can help you with that!
ChatGPT (to our Program): Hmm, that’s too new for me. My knowledge does not include that information. Could you please search online for “What is Google’s stock price today?”
Our Program (to ChatGPT): Okay, Here are some web search results for that question: …
ChatGPT (to our Program): Thanks! Based on what you found, the answer for the user is: 166.9
Our Program (to You): Google’s stock price for today is 166.9

Now let’s build this cool helper program step-by-step using CreatiCode!

Step 1 - Remix the Helpful Assistant Project

Remix this template project. We will add new logic to it.

play.creaticode.com/projects/6531b7e60fdce080a4481c1d

Step 2 - Update the Initial System Prompt

When the program starts, we need to give ChatGPT some initial instructions on its role, and especially how to ask for help with web searches.

Here is an example prompt:

You are a friendly assistant, and I am an agent who can help you. Make sure your response is concise and simple to understand. Do not say anything inappropriate.

When you are asked about anything you do not know, instead of responding to the user, ask me to help you search the web. Use a special tag “WEB:” to start your response, followed by the query to search the web for. I will provide the web search results to you, and then you can generate a response for the user.

Now say “hi”.

This prompt contains 3 parts:

It first introduces the context, where ChatGPT is playing the role of a friendly assistant, and we (our program) are an agent that’s helping it.
Then, special instructions are given to ChatGPT to ask for a web search when it needs to get some new information online, using the special syntax “WEB:” + query.
Lastly, we ask ChatGPT to say “hi” and wait for user input.

Now let’s test with the same question again, and we will get a “WEB:” response from ChatGPT:

Awesome! Look at that! ChatGPT now knows it needs to search the web to help answer the question.

Step 3 - Enforce the Output Format

ChatGPT may not always strictly use the specified format. For example, it might respond with some explanations like this:

The problem with this response is that our program will have a hard time extracting the exact query to be used for web search. To force ChatGPT to use the correct format, we can make 2 changes to our prompt:

Add a note, which emphasizes the exact format we expect.
Give an example, which demonstrates how to respond with a mini conversation.

Here is the updated prompt:

You are a friendly assistant, and I am an agent who can help you. Make sure your response is concise and simple to understand. Do not say anything inappropriate.

When you are asked about anything you do not know, instead of responding to the user, ask me to help you search the web. Use a special tag “WEB:” to start your response, followed by the query to search the web for. I will provide the web search results to you, and then you can generate a response for the user. Note that when you need a web search, you have to start with “WEB:”, and say nothing else except for the query. Avoid asking user if you should do a web search since the user does not know about the web search tool.

For example:
user: Who won the 2024 Olympics 100m sprint for men?
you: WEB: winner of 2024 Olympics 100m sprint for men
system: At the 2024 Olympics in Paris, American sprinter Noah Lyles triumphed in the men’s 100m final
you: American sprinter Noah Lyles

Now say “hi”.

Now, please copy this new prompt into the system request block. This will help ensure ChatGPT follows our format.

Step 4 - Check if the response starts with “WEB:”

Next, we will handle ChatGPT’s response differently depending on whether it starts with the special tag of “WEB:”.

We’ll use an “if/else” block. If the answer starts with “WEB:” we’ll take some special action. If not, we’ll just show the answer like before.

Step 5 - Time to Search the Web!

When we find ChatGPT is asking us to do a web search, we can extract the exact query sentence from ChatGPT’s response, then run a web search using that query sentence.

The logic is the following:

The response from ChatGPT starts with “WEB:”, and we only need the query that comes after that. So, we can use the “substring” block to get the substring of the response starting from the 5th letter.
For example, if the response variable is “WEB: winner of 2024 Olympics 100m sprint for men”, then the substring will be " winner of 2024 Olympics 100m sprint for men".
We can use the “web search” block from the AI category to search the web and store the top 3 results in the “result_table”.

Now, let’s get some web search results. Run the program, and ask the question “What is Google’s stock price today?” again. ChatGPT will request our program to do a web search on that, and the search results will be stored in the “result_table”.

To view the “result_table”, we have to remove the chat window from the stage. We can run the “remove all widgets” block by itself – just click that single block in your code editor.

After that, find your result_table variable and click the little checkbox next to it. This will make the table show up on your stage.

You will see that the result_table contains three columns:

title: The title of the web page.
link: The web address (URL) of the page.
snippet: A short summary or a little peek of what’s on that web page.

Step 6 - Putting the Search Results Together

To return the search result to ChatGPT, we first have to aggregate the content in the result_table into one piece of text. We’ll create a new variable, let’s call it “answer”, to hold all this combined information.

For example, we can compose the answer using a few join blocks like this to include the title and snippet from the top search result:

Note that “\n” represents a line return, which helps format the answer text better. As a result, the “answer” variable will become this:

We can use the same code to join the second and third search results. And at the end, we will add an instruction to ask ChatGPT to generate the response for the user again:

Step 7 - Give ChatGPT the Search Result

Time to give ChatGPT the information our program found on the web!
We’ll send our combined answer (which has all the search result snippets) back to ChatGPT.

Super important: We need to use the “system request” block again. This tells ChatGPT, “Hey, this information is from your helper program (the system), not from the human user.” This helps ChatGPT understand the flow of conversation. We’ll tell it to store its new response (which should be the final answer for the user) back into our response variable. This will replace the old “WEB:…” message that was in there.

After this step, the “response” variable contains the new response based on the web search result, and we can continue to append that to the chat history.

If you test with the same request again, ChatGPT will no longer say it can’t answer the question. Instead, it will provide a new answer based on the search result:

Of course, this is still not the final answer the user is looking for. What should we do now?

Step 8 - Fetch the Top Web Page Content

As shown above, ChatGPT still doesn’t answer with the stock price. The reason is simple: In the search result, we only provide a snippet (preview) of each web page, which does not contain all the information we need.

Therefore, we need to actually fetch the content of the web pages to get more information. For example, find the “fetch web page” block, and fill in the webpage URL from the top search result. When you run this block by itself, you will get the full content of that page, which includes the exact price of the stock:

We can plug in this new information as part of the “answer” we provide ChatGPT: insert “More details”, which is the content we fetch from the first web page in the search result.

Now ChatGPT will finally answer with the actual stock price:

Additional Challenges

In this tutorial, you have learned how to enhance ChatGPT with a web search tool. What can you do to make it better? Here are some ideas worth trying:

Improve the Prompt: If you test the program more, you may still find that sometimes it would fail to run the web search. It would help if you could add another example conversation to the prompt. You can also try to refine the instructions in the prompt to tell ChatGPT what the expected behavior is.
Multiple web searches: Sometimes, a user asks more than one question at the same time. One search isn’t always enough. For example, if someone asks, “What’s the current weather in New York and Tokyo?”, ChatGPT can’t get both answers with just one search. It might need to do two separate searches—one for each city. We need to give ChatGPT a way to handle this. One idea is to create a new kind of command or syntax that tells our code: “Do multiple searches” or “Here’s a list of things to search for.” This way, ChatGPT can ask our program to search more than once and get all the answers the user needs.
Fetch the Page Content On Demand: The current program always fetch the full content from the first web page in the search result. This may not be necessary if the snippets already contain the answer to the user’s question. A further enhancement is to give ChatGPT another tool: fetch web page. To do that, you need to modify the prompt with a few changes:
- Give ChatGPT the link URL for each search result
- Tell ChatGPT if it needs the full content of any page, it can issue another special command “FETCH: URL of the page”.
- When we receive the FETCH request, fetch the content of that page using the “fetch web page as markdown” block from the Cloud extension, then send the content back to ChatGPT.
Search a table: Imagine we have a big table of information — like a full list of everything sold at a grocery store. Now suppose someone asks ChatGPT: “How much does a pound of steak cost?” To answer that, ChatGPT needs a way to ask us for help to search through the table and find the right price. So, we have to give ChatGPT a method or a tool to tell our program: “Look inside the table for this information.”. You can load this csv file into a table variable: grocery_products.csv