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
Copy file name to clipboardExpand all lines: articles/app-service/includes/deploy-intelligent-apps/deploy-intelligent-apps-linux-dotnet-pivot.md
+23-22Lines changed: 23 additions & 22 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -8,19 +8,19 @@ ms.date: 04/10/2024
8
8
ms.author: jefmarti
9
9
---
10
10
11
-
You can create intelligent apps by using Azure App Service with popular AI frameworks like LangChain and Semantic Kernel connected to OpenAI. In the following tutorial, learn to add an Azure OpenAI service using Semantic Kernel to a .NET 8 Blazor web application.
11
+
You can create intelligent apps by using Azure App Service with popular AI frameworks like LangChain and Semantic Kernel connected to OpenAI. In this article, you add an Azure OpenAI service using Semantic Kernel to a .NET 8 Blazor web application.
12
12
13
13
## Prerequisites
14
14
15
15
- An [Azure OpenAI resource](/azure/ai-services/openai/quickstart?pivots=programming-language-csharp&tabs=command-line%2Cpython#set-up) or an [OpenAI account](https://platform.openai.com/overview).
16
-
- A .NET 8 Blazor web app. Create the application with a template [here](https://dotnet.microsoft.com/learn/aspnet/blazor-tutorial/intro).
16
+
- A .NET 8 Blazor web app. Create the application with a [template](https://dotnet.microsoft.com/learn/aspnet/blazor-tutorial/intro).
17
17
18
18
## 1. Set up Blazor web app
19
19
20
-
For this Blazor web application, we're building off the Blazor [template](https://dotnet.microsoft.com/learn/aspnet/blazor-tutorial/intro) to create a new razor page that can send and receive requests to an Azure OpenAI or OpenAI service by using Semantic Kernel.
20
+
For this Blazor web application, you're building off the Blazor [template](https://dotnet.microsoft.com/learn/aspnet/blazor-tutorial/intro) to create a new razor page that can send and receive requests to an Azure OpenAI or OpenAI service by using Semantic Kernel.
21
21
22
-
1. Right-click on the **Pages** folder found under the **Components** folder and add a new item named `OpenAI.razor`.
23
-
1. Add the following code to the `OpenAI.razor` file and select **Save**.
22
+
1. Right-click the **Pages** folder found under the **Components** folder and add a new item named `OpenAI.razor`.
23
+
1. Add the following code to the `OpenAI.razor` file, and then select **Save**.
24
24
25
25
```csharp
26
26
@page"/openai"
@@ -45,9 +45,10 @@ For this Blazor web application, we're building off the Blazor [template](https:
1. Addthefollowing `div` inthe `nav` class, and then select **Save**.
51
52
52
53
```csharp
53
54
@@ -58,27 +59,27 @@ Next, add the new page to the navigation so that you can go to the service.
58
59
</div>
59
60
```
60
61
61
-
After the navigation is updated, we can prepare to build the OpenAI client to handle our requests.
62
+
After the navigation is updated, you can prepare to build the OpenAI client to handle the requests.
62
63
63
64
### API keys and endpoints
64
65
65
-
In order to make calls to OpenAI with your client, you need to first grab the key and endpoint values from Azure OpenAI or OpenAI and add them as secrets that your application uses. Retrieve and save the values for later use.
66
+
To make calls to OpenAI with your client, you need to first get the key and endpoint values from Azure OpenAI or OpenAI and add them as secrets that your application uses. Save the values for later use.
66
67
67
-
To retrieve the key and endpoint values for Azure OpenAI, see [this documentation](/azure/ai-services/openai/quickstart?pivots=programming-language-csharp&tabs=command-line%2Cpython#retrieve-key-and-endpoint). If you're planning to use [managed identity](../../overview-managed-identity.md) to secure your app, you need only the `deploymentName` and `endpoint` values. Otherwise, you need each of the following values:
68
+
To retrieve the key and endpoint values for Azure OpenAI, see [this documentation](/azure/ai-services/openai/quickstart?pivots=programming-language-csharp&tabs=command-line%2Cpython#retrieve-key-and-endpoint). If you're planning to use a [managed identity](../../overview-managed-identity.md) to help secure your app, you need only the `deploymentName` and `endpoint` values. Otherwise, you need each of the following values:
68
69
69
70
- `deploymentName`
70
71
- `endpoint`
71
72
- `apiKey`
72
73
- `modelId`
73
74
74
-
To retrieve the API keys for OpenAI, see this [documentation](https://platform.openai.com/docs/api-reference). For our application, you need the following values:
75
+
To retrieve the API keys for OpenAI, see [this documentation](https://platform.openai.com/docs/api-reference). For this application, you need the following values:
75
76
76
77
- `apiKey`
77
78
- `modelId`
78
79
79
-
Because you're deploying to App Service, you can secure these secrets in Azure Key Vault for protection. Follow the [Quickstart](/azure/key-vault/secrets/quick-create-cli#create-a-key-vault) to set up your key vault and add the secrets that you saved earlier.
80
-
Next, we can use key vault references as app settings in our App Service resource for our application to reference. Follow the instructions in the [documentation](../../app-service-key-vault-references.md?source=recommendations&tabs=azure-cli) to grant your app access to your key vault and to set up key vault references.
81
-
Then, go to the portal **Environment Variables** pane in your resource and add the following app settings:
80
+
Because you're deploying to App Service, you can put these secrets in Azure Key Vault for protection. Follow the [quickstart](/azure/key-vault/secrets/quick-create-cli#create-a-key-vault) to set up your key vault and add the secrets that you saved earlier.
81
+
Next, you can use key vault references as app settings in your App Service resource for your application to reference. Follow the instructions in the [documentation](../../app-service-key-vault-references.md?source=recommendations&tabs=azure-cli) to grant your app access to your key vault and to set up key vault references.
82
+
Then, go to the portal **Environment Variables** pane in your resource and add the following app settings.
82
83
83
84
Use the following settings for Azure OpenAI:
84
85
@@ -130,11 +131,11 @@ For OpenAI:
130
131
131
132
## 2. Semantic Kernel
132
133
133
-
By using SemanticKernel, anopen-sourcesoftwaredevelopmentkit (SDK), youcaneasilydevelopAIagentsthatworkwithyourexistingcode. YoucanuseSemanticKernelwithAzureOpenAIandOpenAImodels.
134
+
By using SemanticKernel, anopen-sourceSDK, youcaneasilydevelopAIagentsthatworkwithyourexistingcode. YoucanuseSemanticKernelwithAzureOpenAIandOpenAImodels.
134
135
135
136
TocreatetheOpenAIclient, installSemanticKernel.
136
137
137
-
ToinstallSemanticKernel, browsetheNuGetpackagemanagerinVisualStudioandinstallthe `Microsoft.SemanticKernel` package. ForNuGetpackagemanagerinstructions, see [here](/nuget/consume-packages/install-use-packages-visual-studio#find-and-install-a-package). ForCLIinstructions, see [here](/nuget/consume-packages/install-use-packages-dotnet-cli).
138
+
ToinstallSemanticKernel, browsetheNuGetpackagemanagerinVisualStudioandinstallthe `Microsoft.SemanticKernel` package. ForNuGetpackagemanagerinstructions, see [thisprocedure](/nuget/consume-packages/install-use-packages-visual-studio#find-and-install-a-package). ForCLIinstructions, see [thisarticle](/nuget/consume-packages/install-use-packages-dotnet-cli).
@@ -157,11 +158,11 @@ To initialize the kernel, add the following code to the `OpenAI.razor` file.
157
158
}
158
159
```
159
160
160
-
In this step, we add the using statement and create the kernel in a method that we can use when we send the request to the service.
161
+
In this step, you add the using statement and create the kernel in a method that you can use when you send the request to the service.
161
162
162
163
## 4. Add your AI service
163
164
164
-
After the kernel is initialized, we can add our chosen AI service to the kernel. We define our model and pass in our key and endpoint information that the chosen model consumes. If you plan to use managed identity with Azure OpenAI, add the service by using the example in the next section.
165
+
After the kernel is initialized, you can add your chosen AI service to the kernel. You define your model and pass in your key and endpoint information that the chosen model consumes. If you plan to use managed identity with Azure OpenAI, add the service by using the example in the next section.
165
166
166
167
Use the following code for Azure OpenAI:
167
168
@@ -227,9 +228,9 @@ Your web app is now added as a cognitive service OpenAI user and can communicate
227
228
228
229
## 5. Configure a prompt and create semantic function
229
230
230
-
Now that our chosen OpenAI service client is created with the correct keys, we can add a function to handle the prompt. With Semantic Kernel, you can handle prompts by using a semantic function, which turns the prompt and the prompt configuration settings into a function the kernel can execute. Learn more on configuring prompts[here](/semantic-kernel/prompts/configure-prompts?tabs=Csharp).
231
+
Now that your chosen OpenAI service client is created with the correct keys, you can add a function to handle the prompt. With Semantic Kernel, you can handle prompts by using a semantic function, which turns the prompt and the prompt configuration settings into a function the kernel can execute. [Learn more about configuring prompts](/semantic-kernel/prompts/configure-prompts?tabs=Csharp).
231
232
232
-
First, we create a variable that holds the user's prompt. Then, add a function with execution settings to handle and configure the prompt. Add the following code to the `OpenAI.razor` file:
233
+
First, create a variable that holds the user's prompt. Then, add a function with execution settings to handle and configure the prompt. Add the following code to the `OpenAI.razor` file:
233
234
234
235
```csharp
235
236
@@ -346,14 +347,14 @@ Here's the example in its completed form. In this example, use the Azure OpenAI
346
347
}
347
348
```
348
349
349
-
Now, save the application and follow the next steps to deploy it to App Service. If you would like to test it locally first, you can swap the config values with the literal string values of your OpenAI service. For example: `string modelId = 'gpt-4-turbo';`.
350
+
Now, save the application and follow the next steps to deploy it to App Service. If you want to test it locally first, you can swap the config values with the literal string values of your OpenAI service. For example: `string modelId = 'gpt-4-turbo';`.
350
351
351
352
## 5. Deploy to App Service
352
353
353
354
You're now ready to deploy to App Service. If you run into any issues, make sure you granted your app access to your key vault and added the app settings with key vault references as your values. App Service resolves the app settings in your application that match what you added in the portal.
354
355
355
356
### Authentication
356
357
357
-
We highly recommend that you also add authentication to your web app when using an Azure OpenAI or OpenAI service. This optional step can add a level of security with no other code. Learn how to enable authentication for your web app[here](../../scenario-secure-app-authentication-app-service.md).
358
+
We highly recommend that you also add authentication to your web app when using an Azure OpenAI or OpenAI service. This optional step can add a level of security with no other code. [Learn how to enable authentication for your web app](../../scenario-secure-app-authentication-app-service.md).
358
359
359
360
After the app is deployed, browse to the web app and go to the OpenAI tab. Enter a query to the service and you should see a populated response from the server.
Copy file name to clipboardExpand all lines: articles/app-service/includes/deploy-intelligent-apps/deploy-intelligent-apps-linux-java-pivot.md
+8-8Lines changed: 8 additions & 8 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -8,16 +8,16 @@ ms.date: 04/10/2024
8
8
ms.author: jefmarti
9
9
---
10
10
11
-
You can use Azure App Service to create applications by using Azure OpenAI and OpenAI. In the following tutorial, we're adding Azure OpenAI Service to a Java 17 Spring Boot application using the Azure software development kit (SDK).
11
+
You can use Azure App Service to create applications by using Azure OpenAI and OpenAI. In this article, you add Azure OpenAI Service to a Java 17 Spring Boot application by using the Azure SDK.
12
12
13
13
#### Prerequisites
14
14
15
15
- An [Azure OpenAI resource](/azure/ai-services/openai/quickstart?pivots=programming-language-csharp&tabs=command-line%2Cpython#set-up) or an [OpenAI account](https://platform.openai.com/overview).
16
-
- A Java Spring Boot application. Create the application by using this[quickstart](../../quickstart-java.md?tabs=springboot&pivots=java-maven-javase).
16
+
- A Java Spring Boot application. Create the application by using the[quickstart](../../quickstart-java.md?tabs=springboot&pivots=java-maven-javase).
17
17
18
18
### Set up web app
19
19
20
-
For this Spring Boot application, we're building off the [quickstart](../../quickstart-java.md?tabs=springboot&pivots=java-javase) app and adding an extra feature to make a request to an Azure OpenAI or OpenAI service. Add the following code to your application:
20
+
For this Spring Boot application, you're building off the [quickstart](../../quickstart-java.md?tabs=springboot&pivots=java-javase) app and adding an extra feature to make a request to an Azure OpenAI or OpenAI service. Add the following code to your application:
21
21
22
22
```java
23
23
@RequestMapping("/")
@@ -39,14 +39,14 @@ For Azure OpenAI, see [this documentation](/azure/ai-services/openai/quickstart?
39
39
-`apiKey`
40
40
-`deploymentName`
41
41
42
-
For OpenAI, see this [documentation](https://platform.openai.com/docs/api-reference) to retrieve the API keys. For our application, you need the following values:
42
+
For OpenAI, see this [documentation](https://platform.openai.com/docs/api-reference) to retrieve the API keys. For this application, you need the following values:
43
43
44
44
-`apiKey`
45
45
-`modelName`
46
46
47
-
Because we're deploying to App Service, we can secure these secrets in Azure Key Vault for protection. Follow the [quickstart](/azure/key-vault/secrets/quick-create-cli#create-a-key-vault) to set up your key vault and add the secrets you saved from earlier.
47
+
Because you're deploying to App Service, you can put these secrets in Azure Key Vault for protection. Follow the [quickstart](/azure/key-vault/secrets/quick-create-cli#create-a-key-vault) to set up your key vault and add the secrets you saved from earlier.
48
48
49
-
Next, we can use key vault references as app settings in our App Service resource to reference in our application. Follow the instructions in the [documentation](../../app-service-key-vault-references.md?source=recommendations&tabs=azure-cli) to grant your app access to your key vault and to set up key vault references.
49
+
Next, you can use key vault references as app settings in your App Service resource to reference in the application. Follow the instructions in the [documentation](../../app-service-key-vault-references.md?source=recommendations&tabs=azure-cli) to grant your app access to your key vault and to set up key vault references.
50
50
51
51
Then, go to the portal **Environment Variables** page in your resource and add the following app settings:
52
52
@@ -106,11 +106,11 @@ Before you can create the client, you first need to add the Azure SDK dependency
106
106
</dependency>
107
107
```
108
108
109
-
After the package is created, we can start working on the client that makes our calls.
109
+
After the package is created, you can start working on the client that makes your calls.
110
110
111
111
### Create OpenAI client
112
112
113
-
After the package and environment variables are set up, we can create the client that enables chat completion calls.
113
+
After the package and environment variables are set up, you can create the client that enables chat completion calls.
114
114
115
115
Add the following code to create the OpenAI client:
Copy file name to clipboardExpand all lines: articles/app-service/includes/deploy-intelligent-apps/deploy-intelligent-apps-linux-node-pivot.md
+4-4Lines changed: 4 additions & 4 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -8,16 +8,16 @@ ms.date: 09/30/2024
8
8
ms.author: jefmarti
9
9
---
10
10
11
-
You can use Azure App Service to create applications by using Azure OpenAI and OpenAI. In the following tutorial, we're adding Azure OpenAI Service to an Express application by using the Azure software development kit (SDK).
11
+
You can use Azure App Service to create applications by using Azure OpenAI and OpenAI. In this article, you add Azure OpenAI Service to an Express application by using the Azure SDK.
12
12
13
13
#### Prerequisites
14
14
15
15
- An [Azure OpenAI resource](/azure/ai-services/openai/quickstart?pivots=programming-language-csharp&tabs=command-line%2Cpython#set-up) or an [OpenAI account](https://platform.openai.com/overview).
16
-
- A Node.js Express application. Create the sample app by using our[quickstart](/azure/app-service/quickstart-nodejs?tabs=linux&pivots=development-environment-vscode).
16
+
- A Node.js Express application. Create the sample app by using the[quickstart](/azure/app-service/quickstart-nodejs?tabs=linux&pivots=development-environment-vscode).
17
17
18
18
### Set up a web app
19
19
20
-
For this application, we're building off the [quickstart](/azure/app-service/quickstart-nodejs?tabs=linux&pivots=development-environment-vscode) Express app and adding an extra feature to make a request to an Azure OpenAI or OpenAI service.
20
+
For this application, you're building off the [quickstart](/azure/app-service/quickstart-nodejs?tabs=linux&pivots=development-environment-vscode) Express app and adding an extra feature to make a request to an Azure OpenAI or OpenAI service.
21
21
22
22
First, copy and replace the `index.ejs` file with the following code:
23
23
@@ -63,7 +63,7 @@ For OpenAI, see this documentation to retrieve the API keys. For our application
63
63
64
64
-`apiKey`
65
65
66
-
Because we're deploying to App Service, we can secure these secrets in Azure Key Vault for protection. Follow the [Quickstart](/azure/key-vault/secrets/quick-create-cli#create-a-key-vault) to set up your key vault and add the secrets that you saved from earlier.
66
+
Because you're deploying to App Service, you can put these secrets in Azure Key Vault for protection. Follow the [Quickstart](/azure/key-vault/secrets/quick-create-cli#create-a-key-vault) to set up your key vault and add the secrets that you saved from earlier.
67
67
68
68
Next, we can use key vault references as app settings in our App Service resource to reference in our application. Follow the instructions in the [documentation](../../app-service-key-vault-references.md?source=recommendations&tabs=azure-cli) to grant your app access to your key vault and to set up key vault references.
0 commit comments