Connecting Your Windows and Uno Platform App to ChatGPT with Azure.AI.OpenAI

In today’s digital world, integrating AI into your applications has become increasingly important. One powerful AI model that you can leverage is OpenAI’s GPT, known for its natural language processing capabilities. In this blog post, we’ll guide you through the process of connecting your Windows app to ChatGPT using the Microsoft Azure.AI.OpenAI library, allowing you to enhance user interactions with intelligent responses.

Prerequisite – OpenAI API Key

If you want to follow along, you’ll need to head to https://platform.openai.com/api-keys and generate or retrieve your API key. If you don’t already have an OpenAI account, you’ll need to create one and sign in, in order to access your API key.

Step 1: Create your Windows and Uno Platform App

For this post we’re going to create a cross platform, or multi-platform, application using the Uno Platform template wizard (if you’re not using Visual Studio, you can grab the uno.templates dotnet new templates package and use the unoapp template). I’m going to pick the Recommended option (use “-preset recommended” if running dotnet new unoapp) and proceed without customizing it.

Step 2: Install the Azure.AI.OpenAI Library

In the main project of your application, install the Azure.AI.OpenAI library using NuGet Package Manager or the Package Manager Console. Use the following command:

Install-Package Microsoft.Azure.AI.OpenAI -IncludePrerelease

Step 3: Connect to ChatGPT

Now, let’s integrate ChatGPT into the app. Create a method to interact with ChatGPT. Here’s an example method that sends a user query to ChatGPT and retrieves a response:

private async Task<string> GetChatGPTResponseAsync(string query)
{
    var client = new OpenAIClient("OpenAI API Key");

    var completionOptions = new ChatCompletionsOptions
    {
        DeploymentName = "gpt-4-1106-preview",
    };

    completionOptions.Messages.Add(new ChatRequestUserMessage(query));

    var resp = await client.GetChatCompletionsAsync(completionOptions);

    if (resp?.Value?.Choices.FirstOrDefault() is { } response &&
        response.Message?.Content is { } responseMessage)
    {
        return responseMessage;
    }
    return "No response";
}

Replace "OpenAI API Key" with your OpenAI API Key.

Step 4: Integrate with Your App

In the UI for the app, add a text box for user input (data bound to the Query property) and a text block (data bound to the Response property) to display the ChatGPT response. Use the following code to handle user input and display the response:

public IState<string> Query => State<string>.Value(this, () => string.Empty);

public IState<string> Response => State<string>.Value(this, () => string.Empty);

public async Task Send(string query)
{
    var response = await GetChatGPTResponseAsync(query);
    await Response.SetAsync(response);
}

Step 6: Test Your App

Build and run your app. Enter a query into the text box and submit it. Your app should display a response from ChatGPT based on the user’s query.

Conclusion

By following these steps, you’ve successfully connected your Windows and Uno Platform app to ChatGPT using the Microsoft Azure.AI.OpenAI library. This integration opens up a world of possibilities for enhancing user interactions with intelligent responses. Experiment with different queries and see how ChatGPT can enrich your app’s functionality.