You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Follow the instructions in the terminal to authenticate.
22
+
1. Sign in to your Azure account.
29
23
30
-
1. Set environment variables for your resource group name, Azure OpenAI service name, and location:
24
+
```azurecli
25
+
az login
26
+
```
31
27
32
-
```azurecli
33
-
export RESOURCE_GROUP="<group-name>"
34
-
export OPENAI_SERVICE_NAME="<azure-openai-name>"
35
-
export APPSERVICE_NAME="<app-name>"
36
-
export LOCATION="eastus2"
37
-
```
28
+
Follow the instructions in the terminal to authenticate.
38
29
39
-
> [!IMPORTANT]
40
-
> The region is critical as it's tied to the regional availability of the chosen model. Model availability and [deployment type availability](/azure/ai-foundry/foundry-models/concepts/deployment-types) vary from region to region. This tutorial uses `gpt-4o-mini`, which is available in `eastus2` under the Standard deployment type. If you deploy to a different region, this model might not be available or might require a different tier. Before changing regions, consult the [Model summary table and region availability](/azure/ai-services/openai/concepts/models#model-summary-table-and-region-availability) to verify model support in your preferred region.
41
-
>
30
+
1. Set environment variables by providing names for your resource group and Azure OpenAI service and setting an appropriate Azure region as your location.
42
31
43
-
1. Create a resource group and an Azure OpenAI resource with a custom domain, then add a gpt-4o-mini model:
32
+
```azurecli
33
+
export RESOURCE_GROUP="<group-name>"
34
+
export OPENAI_SERVICE_NAME="<azure-openai-name>"
35
+
export APPSERVICE_NAME="<app-name>"
36
+
export LOCATION="<azure-region>"
37
+
```
44
38
45
-
```azurecli
46
-
# Resource group
47
-
az group create --name $RESOURCE_GROUP --location $LOCATION
48
-
# Azure OpenAI resource
49
-
az cognitiveservices account create \
50
-
--name $OPENAI_SERVICE_NAME \
51
-
--resource-group $RESOURCE_GROUP \
52
-
--location $LOCATION \
53
-
--custom-domain $OPENAI_SERVICE_NAME \
54
-
--kind OpenAI \
55
-
--sku s0
56
-
# gpt-4o-mini model
57
-
az cognitiveservices account deployment create \
58
-
--name $OPENAI_SERVICE_NAME \
59
-
--resource-group $RESOURCE_GROUP \
60
-
--deployment-name gpt-4o-mini \
61
-
--model-name gpt-4o-mini \
62
-
--model-version 2024-07-18 \
63
-
--model-format OpenAI \
64
-
--sku-name Standard \
65
-
--sku-capacity 1
66
-
# Cognitive Services OpenAI User role that lets the signed in Azure user to read models from Azure OpenAI
67
-
az role assignment create \
68
-
--assignee $(az ad signed-in-user show --query id -o tsv) \
69
-
--role "Cognitive Services OpenAI User" \
70
-
--scope /subscriptions/$(az account show --query id -o tsv)/resourceGroups/$RESOURCE_GROUP/providers/Microsoft.CognitiveServices/accounts/$OPENAI_SERVICE_NAME
71
-
```
39
+
> [!IMPORTANT]
40
+
> The location is tied to the regional availability of the chosen model. Model and [deployment type](/azure/ai-foundry/foundry-models/concepts/deployment-types) availability vary among Azure regions and billing tiers. This tutorial uses `gpt-4o-mini`, which is available in several regions under the Standard deployment type.
41
+
>
42
+
> Before selecting a location, consult the [Model summary and region availability table](/azure/ai-services/openai/concepts/models#model-summary-table-and-region-availability) to verify model support in your preferred region.
72
43
73
-
Now that you have an Azure OpenAI resource, you'll create a web application to interact with it.
44
+
1. Create a resource group and an Azure OpenAI resource with a custom domain, and then add a `gpt-4o-mini` model:
45
+
46
+
```azurecli
47
+
# Resource group
48
+
az group create --name $RESOURCE_GROUP --location $LOCATION
49
+
# Azure OpenAI resource
50
+
az cognitiveservices account create \
51
+
--name $OPENAI_SERVICE_NAME \
52
+
--resource-group $RESOURCE_GROUP \
53
+
--location $LOCATION \
54
+
--custom-domain $OPENAI_SERVICE_NAME \
55
+
--kind OpenAI \
56
+
--sku s0
57
+
# gpt-4o-mini model
58
+
az cognitiveservices account deployment create \
59
+
--name $OPENAI_SERVICE_NAME \
60
+
--resource-group $RESOURCE_GROUP \
61
+
--deployment-name gpt-4o-mini \
62
+
--model-name gpt-4o-mini \
63
+
--model-version 2024-07-18 \
64
+
--model-format OpenAI \
65
+
--sku-name Standard \
66
+
--sku-capacity 1
67
+
# Cognitive Services OpenAI User role that lets the signed in Azure user read models from Azure OpenAI
68
+
az role assignment create \
69
+
--assignee $(az ad signed-in-user show --query id -o tsv) \
70
+
--role "Cognitive Services OpenAI User" \
71
+
--scope /subscriptions/$(az account show --query id -o tsv)/resourceGroups/$RESOURCE_GROUP/providers/Microsoft.CognitiveServices/accounts/$OPENAI_SERVICE_NAME
72
+
```
73
+
74
+
Now that you have an Azure OpenAI resource, you can create a web application to interact with it.
Copy file name to clipboardExpand all lines: articles/app-service/tutorial-ai-openai-chatbot-python.md
+49-49Lines changed: 49 additions & 49 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -1,9 +1,9 @@
1
1
---
2
-
title: Intelligent app with Azure OpenAI (Flask)
3
-
description: Learn how to build and deploy a Python web app to Azure App Service that connects to Azure OpenAI using managed identity.
2
+
title: Build and deploy an Azure OpenAI (Flask) chatbot
3
+
description: Learn how to build a Python web app that connects to Azure OpenAI and deploy it to Azure App Service using managed identity.
4
4
author: jefmarti
5
5
ms.author: jefmarti
6
-
ms.date: 05/19/2025
6
+
ms.date: 03/03/2026
7
7
ms.update-cycle: 180-days
8
8
ms.topic: tutorial
9
9
ms.custom:
@@ -12,21 +12,23 @@ ms.custom:
12
12
- build-2025
13
13
ms.collection: ce-skilling-ai-copilot
14
14
ms.service: azure-app-service
15
+
#customer intent: As a Python web app developer, I want to build an intelligent AI application that uses Azure OpenAI and deploy it to Azure App Service so I can offer a cloud chatbot app to my users.
16
+
15
17
---
16
18
17
19
# Tutorial: Build a chatbot with Azure App Service and Azure OpenAI (Flask)
18
20
19
-
In this tutorial, you'll build an intelligent AI application by integrating Azure OpenAI with a Python web application and deploying it to Azure App Service. You'll create a Flask app that sends chat completion requests to a model in Azure OpenAI.
In this tutorial, you build an intelligent AI application by integrating Azure OpenAI with a Python web application and deploy it to Azure App Service. You create a Flask app that sends chat completion requests to a model in Azure OpenAI, and connect to the service using a managed identity.
22
22
23
-
In this tutorial, you learn how to:
23
+
You learn how to:
24
24
25
25
> [!div class="checklist"]
26
26
> * Create an Azure OpenAI resource and deploy a language model.
27
27
> * Build a Flask application that connects to Azure OpenAI.
28
28
> * Deploy the application to Azure App Service.
29
-
> * Implement passwordless secure authentication both in the development environment and in Azure.
29
+
> * Implement passwordless secure authentication in the development environment and in Azure.
30
+
31
+
:::image type="content" source="media/tutorial-ai-openai-chatbot-python/chat-in-browser.png" alt-text="Screenshot showing a chatbot running in Azure App Service.":::
30
32
31
33
## Prerequisites
32
34
@@ -48,7 +50,7 @@ In this tutorial, you learn how to:
48
50
pip freeze > requirements.txt
49
51
```
50
52
51
-
1. In the workspace root, create an *app.py*and copy the following code into it,for a simple chat completion call with Azure OpenAI.
53
+
1. In the workspace root, create a file named *app.py*containing the following code for a simple chat completion call with Azure OpenAI.
52
54
53
55
```python
54
56
import os
@@ -90,7 +92,7 @@ In this tutorial, you learn how to:
90
92
app.run()
91
93
```
92
94
93
-
1. Create a *templates* directory and an *index.html* file in it. Copy the following code into it for a simple chat interface:
95
+
1. Create a *templates* directory and an *index.html* file in it. Paste inthe following code forcreating a simple chat interface.
94
96
95
97
```html
96
98
<!doctype html>
@@ -128,19 +130,20 @@ In this tutorial, you learn how to:
128
130
--output tsv
129
131
```
130
132
131
-
1. Run the app by adding `AZURE_OPENAI_ENDPOINT` with its value from the CLI output:
133
+
1. Run the app by adding `AZURE_OPENAI_ENDPOINT` with the value from the preceding CLI output.
132
134
133
135
```bash
134
136
AZURE_OPENAI_ENDPOINT=<output-from-previous-cli-command> flask run
135
137
```
136
138
137
-
1. Select **Open in browser** to launch the app in a new browser tab. Submit a question and seeif you get a response message.
139
+
1. Select **Open in browser** to launch the app in a new browser tab. Submit a question to see a response message.
138
140
139
141
## 3. Deploy to Azure App Service and configure OpenAI connection
140
142
141
-
Now that your app works locally, let's deploy it to Azure App Service and set up a service connection to Azure OpenAI using managed identity.
143
+
Now that your app works locally, deploy it to Azure App Service and set up a service connection to Azure OpenAI using managed identity.
144
+
145
+
1. First, deploy your app to Azure App Service using the Azure CLI command`az webapp up`. This command creates a new web app in the same resource group as your OpenAI resource and deploys your code to it. The command might take a few minutes to complete.
142
146
143
-
1. First, deploy your app to Azure App Service using the Azure CLI command `az webapp up`. This command creates a new web app and deploys your code to it:
144
147
145
148
```azurecli
146
149
az webapp up \
@@ -153,49 +156,46 @@ Now that your app works locally, let's deploy it to Azure App Service and set up
153
156
--track-status false
154
157
```
155
158
156
-
This command might take a few minutes to complete. It creates a new web app in the same resource group as your OpenAI resource.
157
159
158
-
1. After the app is deployed, create a service connection between your web app and the Azure OpenAI resource using managed identity:
160
+
1. After the app is deployed, create a service connection between your web app and the Azure OpenAI resource using managed identity. The following command creates a connection between your web app and the Azure OpenAI resource by:
161
+
162
+
- Generating a system-assigned managed identity for the web app.
163
+
- Adding the **Cognitive Services OpenAI Contributor** role to the managed identity for the Azure OpenAI resource.
164
+
- Adding the `AZURE_OPENAI_ENDPOINT` app setting to your web app.
159
165
160
166
```azurecli
161
167
az webapp connection create cognitiveservices \
162
168
--resource-group $RESOURCE_GROUP \
163
169
--name $APPSERVICE_NAME \
164
170
--target-resource-group $RESOURCE_GROUP \
165
171
--account $OPENAI_SERVICE_NAME \
166
-
--connection azure-openai \
172
+
--connection azure_openai \
167
173
--system-identity
168
174
```
169
175
170
-
This command creates a connection between your web app and the Azure OpenAI resource by:
176
+
1. Find the URL of your deployed app in the terminal output from the `az webapp up` command, and navigate to the app in your web browser.
171
177
172
-
- Generating system-assigned managed identity for the web app.
173
-
- Adding the Cognitive Services OpenAI Contributor role to the managed identity for the Azure OpenAI resource.
174
-
- Adding the `AZURE_OPENAI_ENDPOINT` app setting to your web app.
175
-
176
-
1. Open the deployed web app in the browser. Find the URL of the deployed web app in the terminal output. Open your web browser and navigate to it.
177
-
178
-
```azurecli
179
-
az webapp browse
180
-
```
178
+
```azurecli
179
+
az webapp browse
180
+
```
181
181
182
-
1. Type a message in the textbox and select **Send**, and give the app a few seconds to reply with the message from Azure OpenAI.
182
+
1. In your web app, enter a message in the textbox and select**Send**. Give the app a few seconds to reply with the message from Azure OpenAI.
Your app is now deployed and connected to Azure OpenAI with managed identity.
187
187
188
188
## Frequently asked questions
189
189
190
-
- [What if I want to connect to OpenAI instead of Azure OpenAI?](#what-if-i-want-to-connect-to-openai-instead-of-azure-openai)
191
-
- [Can I connect to Azure OpenAI with an API key instead?](#can-i-connect-to-azure-openai-with-an-api-key-instead)
192
-
- [How does DefaultAzureCredential work in this tutorial?](#how-does-defaultazurecredential-work-in-this-tutorial)
190
+
- [How can I connect to OpenAI instead of Azure OpenAI?](#how-can-i-connect-to-openai-instead-of-azure-openai)
191
+
- [Can I connect to Azure OpenAI with an API key instead of managed identity?](#can-i-connect-to-azure-openai-with-an-api-key-instead-of-managed-identity)
192
+
- [How does the DefaultAzureCredential work?](#how-does-the-defaultazurecredential-work)
193
193
194
194
---
195
195
196
-
### What if I want to connect to OpenAI instead of Azure OpenAI?
196
+
### How can I connect to OpenAI instead of Azure OpenAI?
197
197
198
-
To connect to OpenAI instead, use the following code:
198
+
To connect to OpenAI instead of Azure OpenAI, use the following code:
199
199
200
200
```python
201
201
from openai import OpenAI
@@ -207,34 +207,34 @@ client = OpenAI(
207
207
208
208
For more information, see [How to switch between OpenAI and Azure OpenAI endpoints with Python](/azure/ai-services/openai/how-to/switching-endpoints).
209
209
210
-
When working with connection secrets in App Service, you should use [Key Vault references](app-service-key-vault-references.md) instead of storing secrets directly in your codebase. This ensures that sensitive information remains secure and is managed centrally.
210
+
>[!IMPORTANT]
211
+
>When working with connection secrets like API keys in App Service, you should [use Azure Key Vault references](app-service-key-vault-references.md) instead of storing secrets directly in your code. This practice ensures that sensitive information remains secure and is managed centrally.
211
212
212
213
---
213
214
214
-
### Can I connect to Azure OpenAI with an API key instead?
215
+
### Can I connect to Azure OpenAI with an API key instead of managed identity?
215
216
216
-
Yes, you can connect to Azure OpenAI using an API key instead of managed identity. This approach is supported by the Azure OpenAI SDKs and Semantic Kernel.
217
+
Yes, you can connect to Azure OpenAI by using an API key instead of managed identity. The Azure OpenAI SDK and Semantic Kernel support this approach.
217
218
218
-
- For details on using API keys with Semantic Kernel: [Semantic Kernel C# Quickstart](/semantic-kernel/get-started/quick-start-guide?pivots=programming-language-python).
219
-
- For details on using API keys with the Azure OpenAI client library: [Quickstart: Get started using chat completions with Azure OpenAI Service](/azure/ai-services/openai/chatgpt-quickstart?pivots=programming-language-python).
219
+
- For details on using API keys with Semantic Kernel, see [Get started with Semantic Kernel](/semantic-kernel/get-started/quick-start-guide?pivots=programming-language-python).
220
+
- For details on using API keys with the Azure OpenAI client library, see [Use the Azure OpenAI Responses API](/azure/ai-services/openai/chatgpt-quickstart?pivots=programming-language-python).
220
221
221
-
When working with connection secrets in App Service, you should use [Key Vault references](app-service-key-vault-references.md) instead of storing secrets directly in your codebase. This ensures that sensitive information remains secure and is managed centrally.
222
+
>[!IMPORTANT]
223
+
>When working with connection secrets like API keys in App Service, you should [use Key Vault references](app-service-key-vault-references.md) instead of storing secrets directly in your code. This practice ensures that sensitive information remains secure and is managed centrally.
222
224
223
225
---
224
226
225
-
### How does DefaultAzureCredential work in this tutorial?
227
+
### How does the DefaultAzureCredential work?
226
228
227
-
The `DefaultAzureCredential` simplifies authentication by automatically selecting the best available authentication method:
229
+
The `DefaultAzureCredential` simplifies authentication by automatically selecting the best available authentication method.
228
230
229
-
- **During local development**: After you run `az login`, it uses your local Azure CLI credentials.
230
-
- **When deployed to Azure App Service**: It uses the app's managed identity for secure, passwordless authentication.
231
+
- During local development, after you run `az login`, the `DefaultAzureCredential` uses your local Azure CLI credentials.
232
+
- For Azure App Service deployments, the `DefaultAzureCredential` uses the app's managed identity for secure, passwordless authentication.
231
233
232
234
This approach lets your code run securely and seamlessly in both local and cloud environments without modification.
233
235
234
-
## Next steps
236
+
## Related content
235
237
236
-
- [Tutorial: Build a Retrieval Augmented Generation with Azure OpenAI and Azure AI Search (FastAPI)](tutorial-ai-openai-search-nodejs.md)
237
-
- [Tutorial: Run chatbot in App Service with a Phi-4 sidecar extension (FastAPI)](tutorial-ai-slm-fastapi.md)
238
+
- [Tutorial: Run a chatbot in App Service with a Phi-4 sidecar extension (FastAPI)](tutorial-ai-slm-fastapi.md)
238
239
- [Create and deploy an Azure OpenAI Service resource](/azure/ai-services/openai/how-to/create-resource)
0 commit comments