Azure Search CORS error

Question

Hello, I am trying to list all indexes on my search service but getting a CORS error when I try to call the following URL: https://my-search-service-name.search.windows.net/indexes?api-version=2023-11-01&$select=name from http://localhost:4200 (a web app). I understand why this happens but cannot find a way to get past this issue. I see you can set CORS options on already existing indexes but I need to get the list of existing indexes from code, delete an index by name if it exists and create and index (here in this part I can specify CORS options). I am using this library: @azure/search-documents and calling its "searchIndexClient.listIndexesNames()" method. How can I enable CORS on the service itself rather than on a particular index? Or is there another way to get the index list from an application which runs in the browser (hence CORS issues) Thanks, B.

Answer 1

Hi @Bosko Kalinic this error may be due to your browser is blocking requests to a different origin (your Azure Search Service) for security reasons

To resolve this issue, you need to configure CORS on your Azure Search Service to allow requests from http://localhost:4200 Here’s how you can do it:

1. Go to the Azure portal and navigate to your Azure Search Service.
2. In the Overview tab, go to “Indexes” and click on your index.
3. Then go to “CORS”.
4. Add http://localhost:4200 and click "Save".

This will tell Azure Search Service to include http://localhost:4200 in the “Access-Control-Allow-Origin” header, which allows your web app to make successful GET requests without being blocked by CORS policy. Please remember that this setting needs to be done for each index separately. Currently, Azure does not provide a way to enable CORS on the service level. If you have many indexes and need to set CORS for all of them, you might want to consider automating this process using Azure CLI or SDK Also, if your web app needs direct access to the search service for specific functionalities, consider using a client-side SDK like @azure/search-documents with CORS options configured in your search service settings. However, remember to restrict allowed origins and methods for security.

Lastly, you can develop a server-side API on your Azure App Service that handles index listing and deletion. This API can be accessed by your web app without CORS issues and communicate with the search service using its SDK and appropriate credentials. This approach offers better security and control.