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/search/samples-rest.md
+9-9Lines changed: 9 additions & 9 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -9,16 +9,16 @@ ms.service: azure-ai-search
9
9
ms.custom:
10
10
- ignite-2023
11
11
ms.topic: concept-article
12
-
ms.date: 05/30/2025
12
+
ms.date: 09/17/2025
13
13
---
14
14
15
15
# REST samples for Azure AI Search
16
16
17
-
Learn about the REST API samples that demonstrate the functionality and workflow of an Azure AI Search solution. These samples use the [**Search REST APIs**](/rest/api/searchservice).
17
+
Learn about the REST API samples that demonstrate the functionality and workflow of an Azure AI Search solution. These samples use the [**Search Service REST APIs**](/rest/api/searchservice).
18
18
19
-
REST is the definitive programming interface for Azure AI Search. All operations that can be invoked programmatically are available first in REST and then in SDKs. For this reason, most examples in the documentation use the REST APIs to demonstrate or explain important concepts.
19
+
REST is the definitive programming interface for Azure AI Search. All operations that can be invoked programmatically are first available in REST, followed by the SDKs. For this reason, most examples in our documentation use the REST APIs to demonstrate and explain important concepts.
20
20
21
-
You can use any client that supports HTTP calls. To learn how to formulate the HTTP request using Visual Studio Code with a REST client, see [Quickstart: Full-text search using REST](search-get-started-text.md).
21
+
You can use any client that supports HTTP calls. To learn how to formulate the HTTP request using Visual Studio Code with the REST Client extension, see the REST portion of [Quickstart: Full-text search](search-get-started-text.md).
22
22
23
23
## Doc samples
24
24
@@ -27,15 +27,15 @@ Code samples from the Azure AI Search team demonstrate features and workflows. M
27
27
| Samples | Description |
28
28
|---------|---------|
29
29
|[quickstart](https://github.com/Azure-Samples/azure-search-rest-samples/tree/main/Quickstart)| Source code for the REST portion of [Quickstart: Full-text search](search-get-started-text.md). This sample covers the basic workflow for creating, loading, and querying a search index using sample data. |
30
-
|[quickstart-vectors](https://github.com/Azure-Samples/azure-search-rest-samples/tree/main/Quickstart-vectors)| Source code for [Quickstart: Vector search using REST APIs](search-get-started-vector.md). This sample covers the basic workflow for indexing and querying vector data. |
31
-
|[quickstart-agentic-retrieval](https://github.com/Azure-Samples/azure-search-rest-samples/tree/main/Quickstart-agentic-retrieval)| Source code for the REST portion of [Quickstart: Run agentic retrieval in Azure AI Search](search-get-started-agentic-retrieval.md). This sample creates a retrieval pipeline that integrates semantic ranking in Azure AI Search with LLM-powered query planning and answer generation. |
32
-
|[skillset-tutorial](https://github.com/Azure-Samples/azure-search-rest-samples/tree/main/skillset-tutorial)| Source code for [Tutorial: Use REST and AI to generate searchable content from Azure blobs](tutorial-skillset.md). This sample shows you how to create a skillset that iterates over Azure blobs to extract information and infer structure.|
30
+
|[quickstart-vectors](https://github.com/Azure-Samples/azure-search-rest-samples/tree/main/Quickstart-vectors)| Source code for the REST portion of [Quickstart: Vector search](search-get-started-vector.md). This sample covers the basic workflow for indexing and querying vector data. |
31
+
|[quickstart-agentic-retrieval](https://github.com/Azure-Samples/azure-search-rest-samples/tree/main/Quickstart-agentic-retrieval)| Source code for the REST portion of [Quickstart: Use agentic retrieval in Azure AI Search](search-get-started-agentic-retrieval.md). This sample creates a retrieval pipeline that integrates semantic ranking in Azure AI Search with LLM-powered query planning and answer generation. |
32
+
|[skillset-tutorial](https://github.com/Azure-Samples/azure-search-rest-samples/tree/main/skillset-tutorial)| Source code for [Tutorial: Skillsets in Azure AI Search](tutorial-skillset.md). This sample shows you how to create a skillset that iterates over Azure blobs to extract information and infer structure.|
33
33
|[skill examples](https://github.com/Azure-Samples/azure-search-rest-samples/tree/main/skill-examples)| Skillset examples in indexer pipelines that include indexes and indexers so that you can follow field mappings, output field mappings, and source paths. |
34
-
|[debug-sessions](https://github.com/Azure-Samples/azure-search-rest-samples/tree/main/Debug-sessions)| Source code for [Tutorial: Diagnose, repair, and commit changes to your skillset](cognitive-search-tutorial-debug-sessions.md). This sample shows you how to use a skillset debug session in the Azure portal. REST is used to create the objects used during debug.|
34
+
|[debug-sessions](https://github.com/Azure-Samples/azure-search-rest-samples/tree/main/Debug-sessions)| Source code for [Tutorial: Fix a skillset using Debug Sessions](cognitive-search-tutorial-debug-sessions.md). This sample shows you how to use a skillset debug session in the Azure portal. REST is used to create the objects used during debug.|
35
35
|[custom-analyzers](https://github.com/Azure-Samples/azure-search-rest-samples/tree/main/custom-analyzers)| Source code for [Tutorial: Create a custom analyzer for phone numbers](tutorial-create-custom-analyzer.md). This sample explains how to use analyzers to preserve patterns and special characters in searchable content.|
36
36
|[index-json-blobs](https://github.com/Azure-Samples/azure-search-rest-samples/tree/main/index-json-blobs)| Create an indexer, data source, and index for nested JSON within a JSON array. This sample demonstrates the jsonArray parsing model and documentRoot parameters. |
37
37
|[knowledge-store](https://github.com/Azure-Samples/azure-search-rest-samples/tree/main/knowledge-store)| Source code for [Create a knowledge store using REST](knowledge-store-create-rest.md). This sample explains the necessary steps for populating a knowledge store used for knowledge mining workflows. |
38
38
|[projections](https://github.com/Azure-Samples/azure-search-rest-samples/tree/main/projections)| Source code for [Define projections in a knowledge store](knowledge-store-projections-examples.md). This sample explains how to specify the physical data structures in a knowledge store.|
39
39
40
40
> [!TIP]
41
-
> Try the [Samples browser](/samples/browse/?expanded=azure&languages=http&products=azure-cognitive-search) to search for Microsoft code samples in GitHub, filtered by product, service, and language.
41
+
> Use the [samples browser](/samples/browse/?expanded=azure&languages=http&products=azure-cognitive-search) to search for Microsoft code samples on GitHub. You can filter your search by product, service, and language.
title: "Quickstart: Create a Demo App in the Azure Portal"
2
+
title: "Quickstart: Create a Demo App in the Azure portal"
3
3
titleSuffix: Azure AI Search
4
-
description: Run the Create demo app wizard to generate HTML pages and script for an operational web app. The page includes a search bar, results area, sidebar, and typeahead support.
4
+
description: Run the Create demo app wizard to generate HTML pages and script for an operational web app. The page includes a search box, results area, sidebar, and typeahead support.
5
5
manager: nitinme
6
6
author: haileytap
7
7
ms.author: haileytapia
8
8
ms.service: azure-ai-search
9
9
ms.topic: quickstart
10
-
ms.date: 03/04/2025
10
+
ms.date: 09/17/2025
11
11
ms.update-cycle: 180-days
12
12
ms.custom:
13
13
- mode-ui
@@ -16,98 +16,117 @@ ms.custom:
16
16
17
17
# Quickstart: Create a demo search app in the Azure portal
18
18
19
-
In this quickstart, you use the **Create demo app** wizard in the Azure portal to generate a downloadable, "localhost"-style web app that runs in a browser. Depending on how you configure it, the generated app is operational on first use, with a live read-only connection to an index on your search service. A default app can include a search bar, results area, sidebar filters, and typeahead support.
19
+
In this quickstart, you use the **Create demo app** wizard in the Azure portal to generate a downloadable, "localhost"-style web app that runs in a browser. Depending on how you configure it, the generated app is operational on first use, with a live read-only connection to an index on your search service. A default app can include a search box, results area, sidebar filters, and typeahead support.
20
20
21
-
A demo app can help you visualize how an index will function in a client app, but it isn't intended for production scenarios. Production apps should include security, error handling, and hosting logic that the demo app doesn't provide.
21
+
A demo app can help you visualize how an index functions in a client app, but it isn't intended for production scenarios. Production apps should include security, error handling, and hosting logic that the demo app doesn't provide.
22
22
23
23
## Prerequisites
24
24
25
25
+ An Azure account with an active subscription. [Create an account for free](https://azure.microsoft.com/free/).
26
26
27
27
+ An Azure AI Search service. [Create a service](search-create-service-portal.md) or [find an existing service](https://portal.azure.com/#blade/HubsExtension/BrowseResourceBlade/resourceType/Microsoft.Search%2FsearchServices) in your current subscription. For this quickstart, you can use a free service.
28
28
29
-
+[Microsoft Edge (latest version)](https://www.microsoft.com/edge) or Google Chrome.
30
-
31
29
+ A [search index](search-what-is-an-index.md) to use as the basis of your generated application.
32
30
33
-
This quickstart uses the hotels-sample index. To create the index, run the [**Import data wizard**](search-import-data-portal.md), select the built-in sample data, and step through the wizard using all the default values.
31
+
This quickstart uses the hotels-sample index. To create the index, run the [**Import data**](search-import-data-portal.md) wizard, select the built-in sample data, and step through the wizard using all the default values.
34
32
35
33
:::image type="content" source="media/search-create-app-portal/import-data-hotels.png" alt-text="Screenshot of the data source page for sample data.":::
36
34
37
-
When the index is ready to use, move on to the next step.
38
-
39
35
## Start the wizard
40
36
41
-
1. Sign in to the [Azure portal](https://portal.azure.com/) with your Azure account and [find your search service](https://portal.azure.com/#blade/HubsExtension/BrowseResourceBlade/resourceType/Microsoft.Search%2FsearchServices).
37
+
To start the wizard for this quickstart:
42
38
43
-
1.Under **Search Management** > **Indexes**
39
+
1.Sign in to the [Azure portal](https://portal.azure.com/) and select your search service.
44
40
45
-
1.Select *hotels-sample-index*.
41
+
1.From the left pane, select **Search management** > **Indexes**.
46
42
47
-
1.On the index page, at the top, select **Create demo app**to start the wizard.
43
+
1.Select **hotels-sample-index**from the list.
48
44
49
-
1.On the first wizard page, select **Enable Cross Origin Resource Sharing (CORS)** to add CORS support to your index definition. This step is optional, but your local web app won't connect to the remote index without it.
45
+
1.At the top of the index page, select **Create demo app**.
50
46
51
-
:::image type="content" source="media/search-create-app-portal/enable-cors.png" alt-text="Screenshot of the enable CORS action.":::
47
+
1. Select **Enable CORS and continue** to add CORS support to your index definition.
48
+
49
+
:::image type="content" source="media/search-create-app-portal/enable-cors.png" alt-text="Screenshot of the enable CORS action.":::
52
50
53
51
## Configure search results
54
52
55
-
The wizard provides a basic layout for rendered search results that includes space for a thumbnail image, a title, and description. Backing each of these elements is a field in your index that provides the data.
53
+
The wizard provides a basic layout for the rendered search results, including space for a thumbnail image, title, and description. Each element is backed by a field in your index that provides the necessary data.
54
+
55
+
To configure the search results:
56
56
57
-
1. Skip **Thumbnail** because this index doesn't have images, but if you have an index field that's populated with URLs resolving to publicly available images, you should specify that field for the thumbnail area. If your index doesn't have image URLs, leave this field blank.
57
+
1. Skip **Thumbnail** because the index doesn't have image URLs.
58
58
59
-
1. In Title, choose a field that conveys the uniqueness of each document. In this sample, the Hotel Name is a reasonable selection.
59
+
However, if your index contains a field populated with URLs that resolve to publicly available images, you should specify that field for the thumbnail.
60
60
61
-
1. In Description, choose a field that provides details that might help someone decide whether to drill down to that particular document. In this sample, the Description is a good candidate.
61
+
1. For **Title**, choose a field that conveys the uniqueness of each document. Our example uses **HotelName**.
62
+
63
+
1. For **Description**, choose a field that might help someone decide whether to drill down to that particular document. Our example uses **Description**.
64
+
65
+
1. Select **Next**.
62
66
63
67
:::image type="content" source="media/search-create-app-portal/configure-results.png" lightbox="media/search-create-app-portal/configure-results.png" alt-text="Screenshot of the search results configuration page." :::
64
68
65
69
## Add a sidebar
66
70
67
-
The search service supports faceted navigation, which is often rendered as a sidebar. Facets are based on filterable and facetable fields, as expressed in the index schema.
68
-
69
-
In Azure AI Search, faceted navigation is a cumulative filtering experience. Within a category, selecting multiple filters expands the results (for example, selecting Seattle and Bellevue within City). Across categories, selecting multiple filters narrows results.
71
+
The search service supports faceted navigation, which is often rendered as a sidebar. Facets are based on fields attributed as filterable and facetable in your index schema.
70
72
71
73
> [!TIP]
72
-
> You can view fields attributes on the **Fields** tab of the index in the Azure portal. Fields marked as filterable and facetable can be used in the sidebar
74
+
> To view field attributes, select the **Fields** tab on the index page in the Azure portal. Only fields marked as filterable and facetable can be used in the sidebar.
75
+
76
+
In Azure AI Search, faceted navigation is a cumulative filtering experience. Within a category, selecting multiple filters expands the results, such as selecting both `Seattle` and `Bellevue` within the `City` filter. Across categories, selecting multiple filters narrows the results.
73
77
74
-
1. In the wizard, select the **Sidebar** tab at the top of the page. You should see a list of all fields that are attributed as filterable and facetable in the index.
78
+
To customize the sidebar:
75
79
76
-
1. Remove some of the fields to shorten the sidebar so that you don't have scroll in the finished app.
80
+
1. Review the list of filterable and facetable fields in the index.
81
+
82
+
1. To shorten the sidebar and prevent scrolling in the finished app, delete some fields.
83
+
84
+
1. Select **Next**.
85
+
86
+
:::image type="content" source="media/search-create-app-portal/customize-sidebar.png" lightbox="media/search-create-app-portal/customize-sidebar.png" alt-text="Screenshot of the sidebar customization page." :::
77
87
78
88
## Add suggestions
79
89
80
-
Suggestions refer to automated query prompts that are attached to the search box. The demo app supports *suggestions* that provide a dropdown list of potential matching documents based on partial text inputs.
90
+
Suggestions are automated query prompts that appear in the search box. The demo app supports suggestions that provide a dropdown list of potential matching documents based on partial text inputs.
91
+
92
+
To customize the suggestions:
81
93
82
-
In this page, select fields for which suggested queries are provided. You should choose shorter string fields. Avoid verbose fields such as descriptions.
94
+
1. Choose the fields you want to display as suggested queries. Use shorter string fields instead of verbose fields, such as descriptions.
83
95
84
-
The following screenshot shows the suggestions page, juxtaposed with a rendered page in the app. You can see how field selections are used, and how "Show Field Name" is used to include or exclude labeling within the suggestion.
96
+
1. Use the **Show Field Name** checkbox to include or exclude labels for the suggestions.
85
97
86
-
:::image type="content" source="media/search-create-app-portal/suggestions.png" lightbox="media/search-create-app-portal/suggestions.png" alt-text="Screenshot of the suggestion configuration page.":::
98
+
:::image type="content" source="media/search-create-app-portal/suggestions.png" lightbox="media/search-create-app-portal/suggestions.png" alt-text="Screenshot of the suggestion configuration page.":::
87
99
88
100
## Create, download, and execute
89
101
90
-
1. Select **Create demo app** at the bottom of the page to generate the HTML file.
102
+
To finish the wizard and use the demo app:
103
+
104
+
1. Select **Create demo app** to generate the HTML file.
105
+
106
+
1. When prompted, select **Download** to download the file.
107
+
108
+
1. Open the file in a browser.
91
109
92
-
1.When prompted, select **Download your app** to download the file.
110
+
1.Select the search button to run an empty query (`*`) that returns an arbitrary result set.
93
111
94
-
1.Open the file and select the **Search** button. This action executes a query, which can be an empty query (`*`) that returns an arbitrary result set. The page should look similar to the following screenshot.
112
+
1.Enter a term in the search box and use the sidebar filters to narrow the results.
95
113
96
-
1. Enter a term and use filters to narrow results. If you don't see suggested queries, check browser settings or try a different browser.
114
+
:::image type="content" source="media/search-create-app-portal/run-app.png" lightbox="media/search-create-app-portal/run-app.png" alt-text="Screenshot of the search application in a browser window.":::
97
115
98
-
:::image type="content" source="media/search-create-app-portal/run-app.png" lightbox="media/search-create-app-portal/run-app.png" alt-text="Screenshot of the search application in a browser window.":::
116
+
> [!TIP]
117
+
> If you don't see suggested queries, check your browser settings or try a different browser.
99
118
100
119
## Clean up resources
101
120
102
-
When you're working in your own subscription, it's a good idea at the end of a project to identify whether you still need the resources you created. Resources left running can cost you money. You can delete resources individually or delete the resource group to delete the entire set of resources.
121
+
When you work in your own subscription, it's a good idea at the end of a project to identify whether you still need the resources you created. Resources left running can cost you money. You can delete resources individually or delete the resource group to delete the entire set of resources.
103
122
104
-
You can find and manage resources in the Azure portal, using the **All resources** or **Resource groups**link in the left-navigation pane.
123
+
In the Azure portal, you can find and manage resources by selecting **All resources** or **Resource groups**from the left pane.
105
124
106
-
Remember that a free service is limited to three indexes, indexers, and data sources. You can delete individual items in the Azure portal to stay under the limit.
125
+
Remember that a free search service is limited to three indexes, three indexers, and three data sources. To stay under the limit, you can delete these items individually in the Azure portal.
107
126
108
127
## Next step
109
128
110
-
The demo app is useful for prototyping because you can simulate an end-user experience without writing any JavaScript or front-end code. As you get closer to proof-of-concept in your own project, review the end-to-end code samples that more closely mimic a real-word app:
129
+
The demo app is useful for prototyping because it simulates the end-user experience without requiring JavaScript or front-end code. As you approach the proof-of-concept stage of your own project, review the end-to-end code samples that more closely resemble a real-world app:
111
130
112
131
> [!div class="nextstepaction"]
113
132
> [Add search to web apps](tutorial-csharp-overview.md)
0 commit comments