This project creates a simple image search application using Azure AI Search. The application allows you to search for images with a textual query, and searches using a multimodal embedding from the Azure AI Vision API. The frontend is built with TypeScript/React and the backend is built with Python/Quart.
This project uses the sample nature data set from Vision Studio.
IMPORTANT: In order to deploy and run this example, you'll need:
- Azure account. If you're new to Azure, get an Azure account for free.
- Azure account permissions:
- Your Azure account must have
Microsoft.Authorization/roleAssignments/write
permissions, such as Role Based Access Control Administrator, User Access Administrator, or Owner. If you don't have subscription-level permissions, you must be granted RBAC for an existing resource group and deploy to an existing resource group. - Your Azure account also needs
Microsoft.Resources/deployments/write
permissions on the subscription level.
- Your Azure account must have
Pricing varies per region and usage, so it isn't possible to predict exact costs for your usage. However, you can try the Azure pricing calculator for the resources below.
- Azure App Service: Basic Tier with 1 CPU core, 1.75 GB RAM. Pricing per hour. Pricing
- Azure AI Search: Standard tier, 1 replica. Pricing per hour. Pricing
- Azure Blob Storage: Standard tier with ZRS (Zone-redundant storage). Pricing per storage and read operations. Pricing
- Azure Monitor: Pay-as-you-go tier. Costs based on data ingested. Pricing
To reduce costs, you can switch to free SKUs for various services, but those SKUs may have limitations.
azd down
.
First install the required tools:
- Azure Developer CLI
- Python 3.9, 3.10, or 3.11
- Important: Python and the pip package manager must be in the path in Windows for the setup scripts to work.
- Important: Ensure you can run
python --version
from console. On Ubuntu, you might need to runsudo apt install python-is-python3
to linkpython
topython3
.
- Node.js 14+
- Git
- Powershell 7+ (pwsh) - For Windows users only.
- Important: Ensure you can run
pwsh.exe
from a PowerShell terminal. If this fails, you likely need to upgrade PowerShell.
- Important: Ensure you can run
Then bring down the project code:
- Create a new folder and switch to it in the terminal
- Run
azd auth login
- Run
azd init -t image-search-aisearch
- note that this command will initialize a git repository and you do not need to clone this repository
Execute the following command, if you don't have any pre-existing Azure services and want to start from a fresh deployment.
- Run
azd up
- This will provision Azure resources and deploy this sample to those resources, including building the search index based on the files found in the./data
folder.- Important: Beware that the resources created by this command will incur immediate costs, primarily from the AI Search resource. These resources may accrue costs even if you interrupt the command before it is fully executed. You can run
azd down
or delete the resources manually to avoid unnecessary spending.
- Important: Beware that the resources created by this command will incur immediate costs, primarily from the AI Search resource. These resources may accrue costs even if you interrupt the command before it is fully executed. You can run
- After the application has been successfully deployed you will see a URL printed to the console. Click that URL to interact with the application in your browser.
You can only run locally after having successfully run the azd up
command. If you haven't yet, follow the steps in Azure deployment above.
- Run
azd auth login
- Change dir to
app
and run./start.ps1
or./start.sh
depending on your OS. - Open a browser and navigate to
http://localhost:50505
To clean up all the resources created by this sample:
- Run
azd down
- When asked if you are sure you want to continue, enter
y
- When asked if you want to permanently delete the resources, enter
y
The resource group and all the resources will be deleted.