다음을 통해 공유


자습서: Azure App Service 및 Azure OpenAI(Flask)를 사용하여 챗봇 빌드

이 자습서에서는 Python 웹 애플리케이션과 Azure OpenAI를 통합하여 지능형 AI 애플리케이션을 빌드하고 Azure App Service에 배포합니다. Azure OpenAI의 모델에 채팅 완료 요청을 보내고 관리 ID를 사용하여 서비스에 연결하는 Flask 앱을 만듭니다.

당신은 다음을 배우게 됩니다:

  • Azure OpenAI 리소스를 만들고 언어 모델을 배포합니다.
  • Azure OpenAI에 연결하는 Flask 애플리케이션을 빌드합니다.
  • Azure App Service에 애플리케이션을 배포합니다.
  • 개발 환경 및 Azure에서 암호 없는 보안 인증을 구현합니다.

Azure App Service에서 실행되는 챗봇을 보여 주는 스크린샷

Prerequisites

  • 활성 구독이 있는 Azure 계정
  • GitHub Codespaces를 사용하기 위한 GitHub 계정

1. Azure OpenAI 리소스 만들기

이 섹션에서는 GitHub Codespaces에서 Azure CLI를 사용하여 Azure OpenAI 리소스를 만듭니다.

  1. GitHub 계정으로 GitHub Codespaces에 로그인합니다.

  2. 타일에서 이 템플릿 사용을 선택하여 새 빈 코드스페이스를 만듭니다.

  3. Codespace 터미널에서 Azure CLI를 설치합니다.

    curl -sL https://aka.ms/InstallAzureCLIDeb | sudo bash
    
  4. Azure 계정에 로그인합니다.

    az login
    

    터미널의 지침에 따라 인증합니다.

  5. 리소스 그룹 및 Azure OpenAI 서비스에 대한 이름을 제공하고 적절한 Azure 지역을 위치로 설정하여 환경 변수를 설정합니다.

    export RESOURCE_GROUP="<group-name>"
    export OPENAI_SERVICE_NAME="<azure-openai-name>"
    export APPSERVICE_NAME="<app-name>"
    export LOCATION="<azure-region>"
    

    Important

    위치는 선택한 모델의 지역 가용성에 연결됩니다. 모델 및 배포 유형 가용성은 Azure 지역 및 청구 계층에 따라 다릅니다. 이 자습서에서는 표준 배포 유형에 따라 여러 지역에서 사용할 수 있는 를 사용합니다 gpt-4o-mini.

    위치를 선택하기 전에 모델 요약 및 지역 가용성 테이블을 참조하여 선호하는 지역에서 모델 지원을 확인합니다.

  6. 사용자 지정 도메인을 사용하여 리소스 그룹 및 Azure OpenAI 리소스를 만든 다음, 모델을 추가합니다 gpt-4o-mini .

    # Resource group
    az group create --name $RESOURCE_GROUP --location $LOCATION
    # Azure OpenAI resource
    az cognitiveservices account create \
      --name $OPENAI_SERVICE_NAME \
      --resource-group $RESOURCE_GROUP \
      --location $LOCATION \
      --custom-domain $OPENAI_SERVICE_NAME \
      --kind OpenAI \
      --sku s0
    # gpt-4o-mini model
    az cognitiveservices account deployment create \
      --name $OPENAI_SERVICE_NAME \
      --resource-group $RESOURCE_GROUP \
      --deployment-name gpt-4o-mini \
      --model-name gpt-4o-mini \
      --model-version 2024-07-18 \
      --model-format OpenAI \
      --sku-name Standard \
      --sku-capacity 1
    # Cognitive Services OpenAI User role that lets the signed in Azure user read models from Azure OpenAI
    az role assignment create \
      --assignee $(az ad signed-in-user show --query id -o tsv) \
      --role "Cognitive Services OpenAI User" \
      --scope /subscriptions/$(az account show --query id -o tsv)/resourceGroups/$RESOURCE_GROUP/providers/Microsoft.CognitiveServices/accounts/$OPENAI_SERVICE_NAME
    

이제 Azure OpenAI 리소스가 있으므로 상호 작용하는 웹 애플리케이션을 만들 수 있습니다.

2. Flask 앱 만들기 및 설정

  1. 코드스페이스 터미널에서 가상 환경을 만들고 필요한 PIP 패키지를 설치합니다.

    python3 -m venv .venv
    source .venv/bin/activate
    pip install flask openai azure.identity dotenv
    pip freeze > requirements.txt
    
  2. 작업 영역 루트에서 Azure OpenAI와의 간단한 채팅 완료 호출에 대한 다음 코드가 포함된 app.py 파일을 만듭니다.

    import os
    from flask import Flask, render_template, request
    from azure.identity import DefaultAzureCredential, get_bearer_token_provider
    from openai import AzureOpenAI
    
    app = Flask(__name__)
    
    # Initialize the Azure OpenAI client with Microsoft Entra authentication
    token_provider = get_bearer_token_provider(
        DefaultAzureCredential(), "https://cognitiveservices.azure.com/.default"
    )
    client = AzureOpenAI(
        api_version="2024-10-21",
        azure_endpoint=os.getenv("AZURE_OPENAI_ENDPOINT"),
        azure_ad_token_provider=token_provider,
    )
    
    @app.route('/', methods=['GET', 'POST'])
    def index():
        response = None
        if request.method == 'POST': # Handle form submission
            user_message = request.form.get('message')
            if user_message:
                try:
                    # Call the Azure OpenAI API with the user's message
                    completion = client.chat.completions.create(
                        model="gpt-4o-mini",
                        messages=[{"role": "user", "content": user_message}]
                    )
                    ai_message = completion.choices[0].message.content
                    response = ai_message
                except Exception as e:
                    response = f"Error: {e}"
        return render_template('index.html', response=response)
    
    if __name__ == '__main__':
        app.run()
    
  3. 템플릿 디렉터리와 index.html 파일을 만듭니다. 간단한 채팅 인터페이스를 만들기 위해 다음 코드를 붙여넣습니다.

    <!doctype html>
    <html>
    <head>
        <title>Azure OpenAI Chat</title>
        <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-QWTKZyjpPEjISv5WaRU9OFeRpok6YctnYmDr5pNlyT2bRjXh0JMhjY6hW+ALEwIH" crossorigin="anonymous">
    </head>
    <body>
        <main class="container py-4">
            <h1 class="mb-4 text-primary">Azure OpenAI Chat</h1>
            <form method="post" action="/" class="mb-3">
                <div class="input-group">
                    <input type="text" name="message" class="form-control" placeholder="Type your message..." required>
                    <button type="submit" class="btn btn-primary">Send</button>
                </div>
            </form>
            <div class="card p-3">
                {% if response %}
                    <div class="alert alert-info mt-3">{{ response }}</div>
                {% endif %}
            </div>
        </main>
    </body>
    </html>
    
  4. 터미널에서 OpenAI 엔드포인트를 검색합니다.

    az cognitiveservices account show \
      --name $OPENAI_SERVICE_NAME \
      --resource-group $RESOURCE_GROUP \
      --query properties.endpoint \
      --output tsv
    
  5. 이전 CLI 출력의 값을 추가하여 AZURE_OPENAI_ENDPOINT 앱을 실행하세요.

    AZURE_OPENAI_ENDPOINT=<output-from-previous-cli-command> flask run
    
  6. 브라우저에서 열기를 선택하여 새 브라우저 탭에서 앱을 시작합니다. 질문을 제출하여 응답 메시지를 확인합니다.

3. Azure App Service에 배포 및 OpenAI 연결 구성

이제 앱이 로컬로 작동하므로 Azure App Service에 배포하고 관리 ID를 사용하여 Azure OpenAI에 대한 서비스 연결을 설정합니다.

  1. 먼저 Azure CLI 명령을 az webapp up사용하여 Azure App Service에 앱을 배포합니다. 이 명령은 OpenAI 리소스와 동일한 리소스 그룹에 새 웹앱을 만들고 코드를 배포합니다. 명령을 완료하는 데 몇 분 정도 걸릴 수 있습니다.

    az webapp up \
      --resource-group $RESOURCE_GROUP \
      --location $LOCATION \
      --name $APPSERVICE_NAME \
      --plan $APPSERVICE_NAME \
      --sku B1 \
      --os-type Linux \
      --track-status false
    
  2. 앱이 배포된 후 관리 ID를 사용하여 웹앱과 Azure OpenAI 리소스 간에 서비스 연결을 만듭니다. 다음 명령은 다음을 통해 웹앱과 Azure OpenAI 리소스 간의 연결을 만듭니다.

    • 웹앱에 대한 시스템 할당 관리 ID 생성
    • Azure OpenAI 리소스의 관리 ID에 Cognitive Services OpenAI 기여자 역할을 추가합니다.
    • 웹앱에 AZURE_OPENAI_ENDPOINT 앱 설정을 추가합니다.
    az webapp connection create cognitiveservices \
      --resource-group $RESOURCE_GROUP \
      --name $APPSERVICE_NAME \
      --target-resource-group $RESOURCE_GROUP \
      --account $OPENAI_SERVICE_NAME \
      --connection azure_openai \
      --system-identity
    
  3. 명령의 터미널 출력에서 배포된 앱의 URL을 az webapp up 찾고 웹 브라우저에서 앱으로 이동합니다.

    az webapp browse
    
  4. 웹앱에서 텍스트 상자에 메시지를 입력하고 보내기를 선택합니다. 앱이 Azure OpenAI의 메시지로 응답할 때까지 몇 초만 기다리세요.

    Azure App Service에서 실행되는 챗봇을 보여 주는 스크린샷

이제 앱이 배포되고 관리 ID를 사용하여 Azure OpenAI에 연결됩니다.

자주 묻는 질문


Azure OpenAI 대신 OpenAI에 연결하려면 어떻게 해야 하나요?

Azure OpenAI 대신 OpenAI에 연결하려면 다음 코드를 사용합니다.

from openai import OpenAI

client = OpenAI(
    api_key="<openai-api-key>"
)

자세한 내용은 Python을 사용하여 OpenAI와 Azure OpenAI 엔드포인트 간에 전환하는 방법을 참조하세요.

Important

App Service에서 API 키와 같은 연결 비밀을 사용하는 경우 코드에 직접 비밀을 저장하는 대신 Azure Key Vault 참조를 사용해야 합니다. 이렇게 하면 중요한 정보가 안전하게 유지되고 중앙에서 관리됩니다.


관리 ID 대신 API 키를 사용하여 Azure OpenAI에 연결할 수 있나요?

예, 관리 ID 대신 API 키를 사용하여 Azure OpenAI에 연결할 수 있습니다. Azure OpenAI SDK 및 의미 체계 커널은 이 방법을 지원합니다.

Important

App Service에서 API 키와 같은 연결 비밀을 사용하는 경우 코드에 직접 비밀을 저장하는 대신 Key Vault 참조를 사용해야 합니다. 이렇게 하면 중요한 정보가 안전하게 유지되고 중앙에서 관리됩니다.


DefaultAzureCredential은 어떻게 작동하나요?

사용 DefaultAzureCredential 가능한 가장 적합한 인증 방법을 자동으로 선택하여 인증을 간소화합니다.

  • 로컬 개발 중에 az login를 실행한 후 DefaultAzureCredential은 로컬 Azure CLI 자격 증명을 사용합니다.
  • Azure App Service 배포의 DefaultAzureCredential 경우 보안 암호 없는 인증에 앱의 관리 ID를 사용합니다.

이 방법을 사용하면 코드를 수정하지 않고 로컬 환경과 클라우드 환경 모두에서 안전하고 원활하게 실행할 수 있습니다.