Azure SignalR AI Streaming with Azure OpenAI

In the current landscape of digital communication, AI-powered chatbots and streaming technology have become increasingly popular. This project aims to combine these two trends into a seamless group chat application by leveraging SignalR for real-time communication and integrating Azure OpenAI. This project demonstrates SignalR group chats and Azure OpenAI integration.

Features • Gettting Started • Guidance

Important Security Notice

This template, the application code and configuration it contains, has been built to showcase Microsoft Azure specific services and tools. We strongly advise our customers not to make this code part of their production environments without implementing or enabling additional security features.

Features

This project provides the following features:

• Group streaming with Azure SignalR
• OpenAI chatbot integration
• Chat has full context of history conversation

Architecture Diagram

Getting Started

You have a few options for getting started with this template. The quickest way to get started is GitHub Codespaces, since it will setup all the tools for you, but you can also set it up locally. You can also use a VS Code dev container

This template uses gpt-4o which may not be available in all Azure regions. Check for up-to-date region availability and select a region during deployment accordingly

• We recommend using [East US]

GitHub Codespaces

You can run this template virtually by using GitHub Codespaces. The button will open a web-based VS Code instance in your browser:

1. Open the template (this may take several minutes)
2. Open a terminal window
3. Continue with the Deploying steps

VS Code Dev Containers

A related option is VS Code Dev Containers, which will open the project in your local VS Code using the Dev Containers extension:

1. Start Docker Desktop (install it if not already installed)
2. Open the project:
3. In the VS Code window that opens, once the project files show up (this may take several minutes), open a terminal window.
4. Continue with the Deploying steps

Local Environment

Prerequisites

• .Net 8 SDK
• Install azd
  • Windows: winget install microsoft.azd
  • Linux: curl -fsSL https://aka.ms/install-azd.sh | bash
  • MacOS: brew tap azure/azd && brew install azd
• Docker Desktop
• This template uses "gpt-4o" which may not be available in all Azure regions. Check for up-to-date region availability and select a region during deployment accordingly
  • We recommend using [East US]

Installation

1. Download the project code:

az init -t signalr-ai-streaming

1. Continue with the Deploying steps

Deploying

Once you've opened the project in Codespaces, in Dev Containers, or locally, you can deploy it to Azure.

Deploying with azd

1. Login to Azure:

azd auth login

1. Provision resources and deploy the app to Azure Container App:

azd up

It will prompt you to provide an azd environment name (like "chat-app"), select a subscription from your Azure account, and select a location where OpenAI is available (like "eastus"). Then it will provision the resources in your account and deploy the latest code. If you get an error or timeout with deployment, changing the location can help, as there may be availability constraints for the OpenAI resource.

1. When azd has finished deploying, you'll see an endpoint URI in the command output. Visit that URI, and you should see the chat app!

2. When you've made any changes to the app code, you can just run:

azd deploy

Continuous deployment with GitHub Actions

This project includes a Github workflow for deploying the resources to Azure on every push to main. That workflow requires several Azure-related authentication secrets to be stored as Github action secrets. To set that up, run:

azd pipeline config

Guidance

Region Availability

This template uses "gpt-4o" which may not be available in all Azure regions. Check for up-to-date region availability and select a region during deployment accordingly

• We recommend using [East US]

Costs

You can estimate the cost of this project's architecture with Azure's pricing calculator

• [Azure Product] - [plan type] link to pricing for product

Security

Note

When implementing this template please specify whether the template uses Managed Identity or Key Vault

This template has either Managed Identity or Key Vault built in to eliminate the need for developers to manage these credentials. Applications can use managed identities to obtain Microsoft Entra tokens without having to manage any credentials. Additionally, we have added a GitHub Action tool that scans the infrastructure-as-code files and generates a report containing any detected issues. To ensure best practices in your repo we recommend anyone creating solutions based on our templates ensure that the Github secret scanning setting is enabled in your repos.

Resources

• Azure SignalR Service