Playing with PVA's HTTP Requests: An Introductory Tic-Tac-Toe Duel with OpenAI's GPT-4

Prompt (Expand to see prompt used)

When exploring the capabilities of PVA's new Send HTTP request feature, we decided to embark on a playful, yet instructional venture: integrating a game of Tic-Tac-Toe with OpenAI's GPT-4. While it's unlikely you'd actually deploy a game of Tic-Tac-Toe via a chatbot, this exercise offers invaluable insights into harnessing some of PVA's advanced features.

1. Setting Up AI Conversation Structure

System Prompt: Every interaction with GPT-4 starts with a system prompt that sets the context. For our game, the system prompt might be something like "You are an AI assistant helping the user play a game of Tic-Tac-Toe."

Initial User Prompt: This is the user's entry into the game. A simple "Let's Play" triggers the topic and sets the game in motion.

Continuing the Conversation: As the game progresses, user and assistant messages build upon each other. We employ PVA's "Modify items in a list" feature, which, for now, is exclusively accessible via YAML.

Prompt Example after first round

# If you're not familiar with generative AI interaction, GPT-4 doesn't have a memory or idea of "state" during a chat so you need to send the entire chat history of the system, assistant, and user messages with each API call you make. You can see in the screenshot above this history being built from within PVA. It's important to note that you pay for OpenAI usage by the number of tokens you use. Different AI models have different prices per tokens as well, so GPT-4 is more expensive than GPT-3.5-turbo for example, but GPT-4 is more capable.

2. Configuring HTTP Requests

To make our chatbot interact with GPT-4, we utilize the Send HTTP request node:

• URL: Direct the request to OpenAI's GPT-4 endpoint.
• HTTP Action: Use POST.
• Headers: Insert the necessary authentication headers, including your API key (always ensure you handle API keys securely! More on this later).
• Body: Construct the JSON body, which includes the conversation context and user messages.

PVA - HTTP Request Node

PVA - HTTP Request Properties

Configuring Response Data Type in PVA's Send HTTP Request Node

Handling response data accurately and efficiently is crucial to ensure your bot's interactions are relevant and meaningful. PVA's Send HTTP request node comes equipped with powerful features that simplify this process, especially when dealing with structured data like JSON. Here's how to set up the "Response data type" and "Save response as" options for optimal data management:

Setting up "Response data type"

1. Select Data Type: In the Send HTTP request node, you'll find the "Response data type" option. This defines the format of the data you expect from the endpoint. For structured data, such as from RESTful APIs, "JSON" is commonly used.

2. Use "From sample data" Feature: One of PVA's standout features is its ability to derive the schema directly from a sample response. Click on "From sample data", and a field will appear where you can paste a sample JSON response from your endpoint.

PVA - Get Schema from sample JSON

PVA - Schema from sample JSON

By providing a sample, PVA auto-generates a schema, streamlining the data extraction process for future responses. This is especially beneficial for endpoints that return complex or nested JSON structures, as it saves significant time and minimizes errors.

Configuring "Save response as"

1. Set Response Variable Name: After defining the data type and schema, you'll need to specify where this data will be stored for future use in the bot's flow. The "Save response as" option allows you to assign a variable name to the response.

For example, if your bot is querying an endpoint for product details, you might name this variable "ProductDetails".

1. Accessing Data: Once the data is stored in the defined variable, you can access specific attributes in subsequent nodes. For instance, if your JSON response has an attribute named "productName", you can reference it in your bot as ProductDetails.productName.

By efficiently setting up the response data type and storage variable, you're ensuring your bot can process, reference, and utilize the returned data seamlessly. Leveraging the "From sample data" feature further ensures accuracy, making your bot's interactions more dynamic and contextually relevant.

Handling Errors with PVA's Send HTTP Request Node

In any real-world application, error handling is essential, ensuring that your bot continues to function smoothly even when unforeseen issues arise. The Send HTTP request node in PVA provides built-in error handling capabilities. Here's how you can set up and handle potential errors when communicating with external services.

Setting Up Error Handling in the Node

1. Configure "Continue on error": Within the Send HTTP request node, you'll find an option for error handling. Instead of "Raise on error", which halts the bot's operation upon encountering an error, select "Continue on error". This allows the bot to continue its process, giving you control over the subsequent actions based on the nature of the error.

2. Set Variables for Status Code and Error Response: In addition to the response data, it's important to capture potential error details. Assign variable names for the Status Code and Error Response Body. These variables will store the HTTP status code and any error message returned by the endpoint, respectively.

PVA - HTTP Request Error Handling Properties

Implementing Conditional Error Messages

With the error details captured in variables, you can add conditions to check for errors and then decide on the subsequent actions.

1. Add a Condition: After the Send HTTP request node, insert a "Condition" node to evaluate the status of the request.

2. Check the Status Code Variable: Set the condition to evaluate whether the Status Code variable is not equal to Blank(). This checks if there's a value (typically an error code) present.

3. Provide Feedback to the User: If the condition evaluates to true (indicating an error), you can route the conversation flow to display a friendly message to the user. This message can be a generic error message or, for more advanced implementations, tailored responses based on specific status codes or error messages.

Sample error handling flow in our Topic

Example error message output (could be prettier) 

Incorporating such error handling mechanisms ensures a better user experience. It gives clarity when issues arise and offers users guidance on the next steps, rather than leaving them puzzled with abrupt bot failures.

3. Displaying GPT-4's Output and Capturing User Input

In our game play, once GPT-4 responds, we're taking the message from the AI and displaying it using a Question node in PVA. This allows the user to enter their choice, which is then sent back to the AI for the next turn.

PVA - Question Node

PVA - Question Example

4. Iterative Game Loop

After each move, the chatbot loops back to the Send HTTP request node, perpetuating the game cycle until a conclusion (win, lose, or draw) is reached.

Example flow in our Topic that goes back to HTTP Request step

YAML for adding messages to the prompt

PVA - Modify items in a list properties

5. Best Practices

• Secure Your API Key: Never hard-code API keys directly in scripts or workflows. Consider using Azure Key Vault or other secure mechanisms to store and retrieve sensitive information.
• Manage HTTP Requests Efficiently: To avoid unnecessary API costs, ensure that your HTTP requests are efficient. Design the conversation flow in a way that minimizes redundant calls to GPT-4.
• Error Handling: Always be prepared for potential API errors or unexpected responses. Incorporate robust error handling into your chatbot's workflow.

Demo and Conclusion

Tic-Tac-Toe demo

While playing Tic-Tac-Toe with a PVA bot isn't the most productive use of your time, it showcases the depth and versatility of PVA's toolset. Remember, the Send HTTP request feature is still in preview, so always be ready for potential shifts in its behavior or capabilities. Embrace the learning curve, and enjoy the game!

Complete YAML for the Topic