Skip to content

Commit ee5a710

Browse files
committed
Merge branch 'main' of https://github.com/MicrosoftDocs/azure-docs-pr into dhcp-vnet
2 parents 607b279 + ebb656c commit ee5a710

File tree

189 files changed

+2825
-1529
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

189 files changed

+2825
-1529
lines changed

articles/ai-services/immersive-reader/includes/quickstarts/immersive-reader-client-library-csharp.md

Lines changed: 37 additions & 40 deletions
Original file line numberDiff line numberDiff line change
@@ -1,42 +1,38 @@
11
---
22
title: Immersive Reader C# client library quickstart
33
titleSuffix: Azure AI services
4-
description: In this quickstart, you build a web app from scratch and add the Immersive Reader API functionality.
4+
description: Learn how to build a web app using C#, and add the Immersive Reader API functionality.
55
#services: cognitive-services
6-
author: rwallerms
6+
author: sharmas
77
manager: nitinme
88
ms.service: azure-ai-immersive-reader
99
ms.topic: include
10-
ms.date: 09/14/2020
11-
ms.author: rwaller
10+
ms.date: 02/14/2024
11+
ms.author: sharmas
1212
ms.custom: "devx-track-js, devx-track-csharp"
1313
---
1414

15-
[Immersive Reader](https://www.onenote.com/learningtools) is an inclusively designed tool that implements proven techniques to improve reading comprehension for new readers, language learners, and people with learning differences such as dyslexia. You can use Immersive Reader in your applications to isolate text to improve focus, display pictures for commonly used words, highlight parts of speech, read selected text out loud, translate words and phrases in real-time, and more.
16-
17-
In this quickstart, you build a web app from scratch and integrate Immersive Reader using the Immersive Reader client library. A full working sample of this quickstart is available [on GitHub](https://github.com/microsoft/immersive-reader-sdk/tree/master/js/samples/quickstart-csharp).
15+
In this quickstart guide, you build a web app from scratch using C#, and integrate Immersive Reader using the client library. A full working sample of this quickstart is [available on GitHub](https://github.com/microsoft/immersive-reader-sdk/tree/master/js/samples/quickstart-csharp).
1816

1917
## Prerequisites
2018

21-
* Azure subscription - [Create one for free](https://azure.microsoft.com/free/cognitive-services)
22-
* [Visual Studio 2022](https://visualstudio.microsoft.com/downloads)
23-
* An Immersive Reader resource configured for Microsoft Entra authentication. Follow [these instructions](../../how-to-create-immersive-reader.md) to get set up. You will need some of the values created here when configuring the sample project properties. Save the output of your session into a text file for future reference.
19+
* An Azure subscription. You can [create one for free](https://azure.microsoft.com/free/ai-services).
20+
* An Immersive Reader resource configured for Microsoft Entra authentication. Follow [these instructions](../../how-to-create-immersive-reader.md) to get set up. Save the output of your session into a text file so you can configure the environment properties.
21+
* [Visual Studio 2022](https://visualstudio.microsoft.com/downloads).
2422

2523
## Create a web app project
2624

27-
Create a new project in Visual Studio, using the ASP.NET Core Web Application template with built-in Model-View-Controller, and ASP.NET Core 6. Name the project "QuickstartSampleWebApp".
25+
Create a new project in Visual Studio, using the ASP.NET Core Web Application template with built-in Model-View-Controller, and ASP.NET Core 6. Name the project *QuickstartSampleWebApp*.
2826

29-
![New project - C#](../../media/quickstart-csharp/1-createproject.png)
27+
:::image type="content" source="../../media/quickstart-csharp/1-create-project.png" alt-text="Screenshot of Visual Studio screen to create new project.":::
3028

31-
![Configure new project - C#](../../media/quickstart-csharp/2-configureproject.png)
29+
:::image type="content" source="../../media/quickstart-csharp/2-configure-project.png" alt-text="Screenshot of Visual Studio screen to configure project.":::
3230

33-
![New ASP.NET Core web application - C#](../../media/quickstart-csharp/3-createmvc.png)
31+
:::image type="content" source="../../media/quickstart-csharp/3-create-mvc.png" alt-text="Screenshot of Aspnet core web app screen.":::
3432

3533
## Set up authentication
3634

37-
### Configure authentication values
38-
39-
Right-click on the project in the _Solution Explorer_ and choose **Manage User Secrets**. This will open a file called _secrets.json_. This file isn't checked into source control. Learn more [here](/aspnet/core/security/app-secrets?tabs=windows). Replace the contents of _secrets.json_ with the following, supplying the values given when you created your Immersive Reader resource.
35+
Right-click on the project in the **Solution Explorer** and choose **Manage User Secrets**. This opens a file called *secrets.json*. This file isn't checked into source control. To learn more, see [Safe storage of app secrets](/aspnet/core/security/app-secrets?tabs=windows). Replace the contents of *secrets.json* with the following, supplying the values given when you created your Immersive Reader resource.
4036

4137
> [!IMPORTANT]
4238
> Remember to never post secrets publicly. For production, use a secure way of storing and accessing your credentials like [Azure Key Vault](../../../../key-vault/general/overview.md).
@@ -52,31 +48,31 @@ Right-click on the project in the _Solution Explorer_ and choose **Manage User S
5248

5349
### Install Identity Client NuGet package
5450

55-
The following code uses objects from the **Microsoft.Identity.Client** NuGet package so you'll need to add a reference to that package in your project.
51+
The following code uses objects from the `Microsoft.Identity.Client` NuGet package so you need to add a reference to that package in your project.
5652

5753
> [!IMPORTANT]
58-
> The [Microsoft.IdentityModel.Clients.ActiveDirectory](https://www.nuget.org/packages/Microsoft.IdentityModel.Clients.ActiveDirectory) NuGet package and Azure AD Authentication Library (ADAL) have been deprecated. No new features have been added since June 30, 2020. We strongly encourage you to upgrade, see the [migration guide](../../../../active-directory/develop/msal-migration.md) for more details.
54+
> The [Microsoft.IdentityModel.Clients.ActiveDirectory](https://www.nuget.org/packages/Microsoft.IdentityModel.Clients.ActiveDirectory) NuGet package and Azure AD Authentication Library (ADAL) have been deprecated. No new features have been added since June 30, 2020. We strongly encourage you to upgrade. For more information, see the [migration guide](/entra/identity-platform/msal-migration).
5955
60-
Open the NuGet Package Manager Console from **Tools -> NuGet Package Manager -> Package Manager Console** and run the following command:
56+
Open the NuGet Package Manager Console from **Tools** -> **NuGet Package Manager** -> **Package Manager Console** and run the following command:
6157

62-
```powershell
63-
Install-Package Microsoft.Identity.Client -Version 4.42.0
58+
```console
59+
Install-Package Microsoft.Identity.Client -Version 4.59.0
6460
```
6561

66-
### Update the controller to acquire the token
62+
### Update the controller to acquire the token
6763

68-
Open _Controllers\HomeController.cs_, and add the following code after the _using_ statements at the top of the file.
64+
Open *Controllers\HomeController.cs*, and add the following code after the `using` statements at the top of the file.
6965

7066
```csharp
7167
using Microsoft.Identity.Client;
7268
```
7369

74-
Now, we'll configure the controller to obtain the Microsoft Entra ID values from _secrets.json_. At the top of the _HomeController_ class, after ```public class HomeController : Controller {```, add the following code.
70+
Configure the controller to obtain the Microsoft Entra ID values from *secrets.json*. At the top of the `HomeController` class, after ```public class HomeController : Controller {```, add the following code.
7571

7672
```csharp
7773
private readonly string TenantId; // Azure subscription TenantId
78-
private readonly string ClientId; // Azure AD ApplicationId
79-
private readonly string ClientSecret; // Azure AD Application Service Principal password
74+
private readonly string ClientId; // Microsoft Entra ApplicationId
75+
private readonly string ClientSecret; // Microsoft Entra Application Service Principal password
8076
private readonly string Subdomain; // Immersive Reader resource subdomain (resource 'Name' if the resource was created in the Azure portal, or 'CustomSubDomain' option if the resource was created with Azure CLI PowerShell. Check the Azure portal for the subdomain on the Endpoint in the resource Overview page, for example, 'https://[SUBDOMAIN].cognitiveservices.azure.com/')
8177
8278
private IConfidentialClientApplication _confidentialClientApplication;
@@ -123,7 +119,7 @@ public HomeController(Microsoft.Extensions.Configuration.IConfiguration configur
123119
}
124120

125121
/// <summary>
126-
/// Get an Azure AD authentication token
122+
/// Get a Microsoft Entra ID authentication token
127123
/// </summary>
128124
public async Task<string> GetTokenAsync()
129125
{
@@ -148,21 +144,22 @@ public async Task<JsonResult> GetTokenAndSubdomain()
148144
}
149145
catch (Exception e)
150146
{
151-
string message = "Unable to acquire Azure AD token. Check the console for more information.";
147+
string message = "Unable to acquire Microsoft Entra token. Check the console for more information.";
152148
Debug.WriteLine(message, e);
153149
return new JsonResult(new { error = message });
154150
}
155151
}
156152
```
157153

158154
## Add sample content
159-
First, open _Views\Shared\Layout.cshtml_. Before the line ```</head>```, add the following code:
155+
156+
First, open *Views\Shared\Layout.cshtml*. Before the line ```</head>```, add the following code:
160157

161158
```html
162159
@RenderSection("Styles", required: false)
163160
```
164161

165-
Now, we'll add sample content to this web app. Open _Views\Home\Index.cshtml_ and replace all automatically generated code with this sample:
162+
Now add sample content to this web app. Open *Views\Home\Index.cshtml* and replace all automatically generated code with this sample:
166163

167164
```html
168165
@{
@@ -228,13 +225,13 @@ Now, we'll add sample content to this web app. Open _Views\Home\Index.cshtml_ an
228225
</div>
229226
```
230227

231-
Notice that all of the text has a **lang** attribute, which describes the languages of the text. This attribute helps the Immersive Reader provide relevant language and grammar features.
228+
Notice that all of the text has a `lang` attribute, which describes the languages of the text. This attribute helps the Immersive Reader provide relevant language and grammar features.
232229

233230
## Add JavaScript to handle launching Immersive Reader
234231

235-
The Immersive Reader library provides functionality such as launching the Immersive Reader, and rendering Immersive Reader buttons. Learn more [here](../../reference.md).
232+
The Immersive Reader library provides functionality such as launching the Immersive Reader, and rendering Immersive Reader buttons. To learn more, see the [JavaScript SDK reference](../../reference.md).
236233

237-
At the bottom of _Views\Home\Index.cshtml_, add the following code:
234+
At the bottom of *Views\Home\Index.cshtml*, add the following code:
238235

239236
```html
240237
@section Scripts
@@ -310,15 +307,15 @@ From the menu bar, select **Debug > Start Debugging**, or press **F5** to start
310307

311308
In your browser, you should see:
312309

313-
![Sample app - C#](../../media/quickstart-csharp/4-buildapp.png)
310+
:::image type="content" source="../../media/quickstart-csharp/4-build-app.png" alt-text="Screenshot of the app running in the browser.":::
314311

315-
## Launch the Immersive Reader
312+
### Launch the Immersive Reader
316313

317-
When you select the "Immersive Reader" button, you'll see the Immersive Reader launched with the content on the page.
314+
When you select the **Immersive Reader** button, the Immersive Reader launches with the content on the page.
318315

319-
![Immersive Reader - C#](../../media/quickstart-csharp/5-viewimmersivereader.png)
316+
:::image type="content" source="../../media/quickstart-csharp/5-view-immersive-reader.png" alt-text="Screenshot of the Immersive Reader app.":::
320317

321-
## Next steps
318+
## Next step
322319

323320
> [!div class="nextstepaction"]
324-
> [Create a resource and configure Microsoft Entra ID](../../how-to-create-immersive-reader.md)
321+
> [Explore the Immersive Reader SDK reference](../../reference.md)

0 commit comments

Comments
 (0)