Skip to content

[PREVIEW] Sample code for a simple web chat experience targeting chatGPT through AOAI.

License

Notifications You must be signed in to change notification settings

greenjerry/sample-app-aoai-chatGPT

 
 

Repository files navigation

[Preview] Sample Chat App with AOAI

This repo contains sample code for a simple chat webapp that integrates with Azure OpenAI. Note: some portions of the app use preview APIs.

Prerequisites

  • An existing Azure OpenAI resource and model deployment of a chat model (e.g. gpt-35-turbo, gpt-4)
  • To use Azure OpenAI on your data: an existing Azure Cognitive Search resource and index.

Deploy the app

Deploy with Azure Developer CLI

Please see README_azd.md for detailed instructions.

One click Azure deployment

Deploy to Azure

Click on the Deploy to Azure button and configure your settings in the Azure Portal as described in the Environment variables section.

Please see the section below for important information about adding authentication to your app.

Deploy from your local machine

Local Setup: Basic Chat Experience

  1. Update the environment variables listed in app.py as described in the Environment variables section.

    These variables are required:

    • AZURE_OPENAI_RESOURCE
    • AZURE_OPENAI_MODEL
    • AZURE_OPENAI_KEY

    These variables are optional:

    • AZURE_OPENAI_TEMPERATURE
    • AZURE_OPENAI_TOP_P
    • AZURE_OPENAI_MAX_TOKENS
    • AZURE_OPENAI_STOP_SEQUENCE
    • AZURE_OPENAI_SYSTEM_MESSAGE

    See the documentation for more information on these parameters.

  2. Start the app with start.cmd. This will build the frontend, install backend dependencies, and then start the app.

  3. You can see the local running app at http://127.0.0.1:5000.

Local Setup: Chat with your data (Preview)

More information about Azure OpenAI on your data

  1. Update the AZURE_OPENAI_* environment variables as described above.

  2. To connect to your data, you need to specify an Azure Cognitive Search index to use. You can create this index yourself or use the Azure AI Studio to create the index for you.

    These variables are required when adding your data:

    • AZURE_SEARCH_SERVICE
    • AZURE_SEARCH_INDEX
    • AZURE_SEARCH_KEY

    These variables are optional:

    • AZURE_SEARCH_USE_SEMANTIC_SEARCH
    • AZURE_SEARCH_SEMANTIC_SEARCH_CONFIG
    • AZURE_SEARCH_INDEX_TOP_K
    • AZURE_SEARCH_ENABLE_IN_DOMAIN
    • AZURE_SEARCH_CONTENT_COLUMNS
    • AZURE_SEARCH_FILENAME_COLUMN
    • AZURE_SEARCH_TITLE_COLUMN
    • AZURE_SEARCH_URL_COLUMN
  3. Start the app with start.cmd. This will build the frontend, install backend dependencies, and then start the app.

  4. You can see the local running app at http://127.0.0.1:5000.

Deploy with the Azure CLI

You can use the Azure CLI to deploy the app from your local machine. Make sure you have version 2.48.1 or later.

If this is your first time deploying the app, you can use az webapp up. Run the following command from the root folder of the repo, updating the placeholder values to your desired app name, resource group, location, and subscription. You can also change the SKU if desired.

az webapp up --runtime PYTHON:3.10 --sku B1 --name <new-app-name> --resource-group <resource-group-name> --location <azure-region> --subscription <subscription-name>

If you've deployed the app previously from the AOAI studio, first run this command to update the appsettings to allow local code deployment:

az webapp config appsettings set -g <resource-group-name> -n <existing-app-name> --settings WEBSITE_WEBDEPLOY_USE_SCM=false

Then, use the az webapp up command to deploy your local code to the existing app:

az webapp up --runtime PYTHON:3.10 --sku B1 --name <existing-app-name> --resource-group <resource-group-name>

Make sure that the app name and resource group match exactly for the app that was previously deployed.

Deployment will take several minutes. When it completes, you should be able to navigate to your app at {app-name}.azurewebsites.net.

Add an identity provider

After deployment, you will need to add an identity provider to provide authentication support in your app. See this tutorial for more information.

If you don't add an identity provider, the chat functionality of your app will be blocked to prevent unauthorized access to your resources and data. To remove this restriction, or add further access controls, update the logic in getUserInfoList in frontend/src/pages/chat/Chat.tsx.

Best Practices

Feel free to fork this repository and make your own modifications to the UX or backend logic. For example, you may want to expose some of the settings in app.py in the UI for users to try out different behaviors. We recommend keeping these best practices in mind:

  • Reset the chat session (clear chat) if the user changes any settings. Notify the user that their chat history will be lost.
  • Clearly communicate to the user what impact each setting will have on their experience.
  • When you rotate API keys for your AOAI or ACS resource, be sure to update the app settings for each of your deployed apps to use the new key.
  • Pull in changes from main frequently to ensure you have the latest bug fixes and improvements, especially when using Azure OpenAI on your data.

Environment variables

Note: settings starting with AZURE_SEARCH are only needed when using Azure OpenAI on your data. If not connecting to your data, you only need to specify AZURE_OPENAI settings.

App Setting Value Note
AZURE_SEARCH_SERVICE The name of your Azure Cognitive Search resource
AZURE_SEARCH_INDEX The name of your Azure Cognitive Search Index
AZURE_SEARCH_KEY An admin key for your Azure Cognitive Search resource
AZURE_SEARCH_USE_SEMANTIC_SEARCH False Whether or not to use semantic search
AZURE_SEARCH_SEMANTIC_SEARCH_CONFIG The name of the semantic search configuration to use if using semantic search.
AZURE_SEARCH_TOP_K 5 The number of documents to retrieve from Azure Cognitive Search.
AZURE_SEARCH_ENABLE_IN_DOMAIN True Limits responses to only queries relating to your data.
AZURE_SEARCH_CONTENT_COLUMNS List of fields in your Azure Cognitive Search index that contains the text content of your documents to use when formulating a bot response. Represent these as a string joined with "
AZURE_SEARCH_FILENAME_COLUMN AZURE_SEARCH_FILENAME_COLUMN: Field from your Azure Cognitive Search index that gives a unique idenitfier of the source of your data to display in the UI.
AZURE_SEARCH_TITLE_COLUMN Field from your Azure Cognitive Search index that gives a relevant title or header for your data content to display in the UI.
AZURE_SEARCH_URL_COLUMN Field from your Azure Cognitive Search index that contains a URL for the document, e.g. an Azure Blob Storage URI. This value is not currently used.
AZURE_OPENAI_RESOURCE the name of your Azure OpenAI resource
AZURE_OPENAI_MODEL The name of your model deployment
AZURE_OPENAI_MODEL_NAME gpt-35-turbo The name of the model
AZURE_OPENAI_KEY One of the API keys of your Azure OpenAI resource
AZURE_OPENAI_TEMPERATURE 0 What sampling temperature to use, between 0 and 2. Higher values like 0.8 will make the output more random, while lower values like 0.2 will make it more focused and deterministic. A value of 0 is recommended when using your data.
AZURE_OPENAI_TOP_P 1.0 An alternative to sampling with temperature, called nucleus sampling, where the model considers the results of the tokens with top_p probability mass. We recommend setting this to 1.0 when using your data.
AZURE_OPENAI_MAX_TOKENS 1000 The maximum number of tokens allowed for the generated answer.
AZURE_OPENAI_STOP_SEQUENCE Up to 4 sequences where the API will stop generating further tokens. Represent these as a string joined with "
AZURE_OPENAI_SYSTEM_MESSAGE You are an AI assistant that helps people find information. A brief description of the role and tone the model should use
AZURE_OPENAI_PREVIEW_API_VERSION 2023-06-01-preview API version when using Azure OpenAI on your data
AZURE_OPENAI_STREAM True Whether or not to use streaming for the response

Contributing

This project welcomes contributions and suggestions. Most contributions require you to agree to a Contributor License Agreement (CLA) declaring that you have the right to, and actually do, grant us the rights to use your contribution. For details, visit https://cla.opensource.microsoft.com.

When you submit a pull request, a CLA bot will automatically determine whether you need to provide a CLA and decorate the PR appropriately (e.g., status check, comment). Simply follow the instructions provided by the bot. You will only need to do this once across all repos using our CLA.

This project has adopted the Microsoft Open Source Code of Conduct. For more information see the Code of Conduct FAQ or contact opencode@microsoft.com with any additional questions or comments.

Trademarks

This project may contain trademarks or logos for projects, products, or services. Authorized use of Microsoft trademarks or logos is subject to and must follow Microsoft's Trademark & Brand Guidelines. Use of Microsoft trademarks or logos in modified versions of this project must not cause confusion or imply Microsoft sponsorship. Any use of third-party trademarks or logos are subject to those third-party's policies.

About

[PREVIEW] Sample code for a simple web chat experience targeting chatGPT through AOAI.

Resources

License

Code of conduct

Security policy

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages

  • Python 48.4%
  • TypeScript 21.8%
  • Bicep 15.7%
  • CSS 8.8%
  • PowerShell 1.9%
  • Shell 1.4%
  • Other 2.0%