Självstudie: Skapa en agentisk webbapp i Azure App Service med LangGraph eller Foundry Agent Service (Python)

Den här självstudien visar hur du lägger till agentisk kapacitet i ett befintligt datadrivet FastAPI CRUD-program. Det gör detta med två olika metoder: LangGraph och Foundry Agent Service.

Om ditt webbprogram redan har användbara funktioner, till exempel shopping, hotellbokning eller datahantering, är det relativt enkelt att lägga till agentfunktioner i webbappen genom att omsluta funktionerna i ett plugin-program (för LangGraph) eller som en OpenAPI-slutpunkt (för Foundry Agent Service). I den här självstudien börjar du med en enkel to-do listapp. I slutet kan du skapa, uppdatera och hantera uppgifter med en agent i en App Service-app.

LangGraph

Gjuteriagenttjänst

Med både LangGraph och Foundry Agent Service kan du skapa agentiska webbprogram med AI-drivna funktioner. LangGraph liknar Microsoft Agent Framework och är ett SDK. Följande tabell visar några av övervägandena och kompromisserna:

Att tänka på	LangGraph eller Microsoft Agent Framework	Gjuteritjänstagent
Performance	Snabb (körs lokalt)	Långsammare (hanterad fjärrtjänst)
Utveckling	Fullständig kod, maximal kontroll	Låg kod, snabb integrering
Testing	Manuella/enhetstester i kod	Inbyggd lekplats för snabb testning
Skalbarhet	Apphanterad	Azure-hanterad, autoskalning
Säkerhetsramverk	Anpassad implementering krävs	Inbyggd innehållssäkerhet och moderering
Identitet	Anpassad implementering krävs	Inbyggt agent-ID och autentisering
Enterprise	Anpassad integrering krävs	Inbyggd Microsoft 365/Teams-distribution och integrerade Verktygsanrop för Microsoft 365.

I den här tutorialen lär du dig följande:

• Konvertera befintliga appfunktioner till ett plugin-program för LangGraph.
• Lägg till plugin-programmet i en LangGraph-agent och använd det i en webbapp.
• Konvertera befintliga appfunktioner till en OpenAPI-slutpunkt för Foundry Agent Service.
• Anropa en Foundry-agent i en webbapp.
• Tilldela nödvändiga behörigheter för hanterad identitetsanslutning.

Förutsättningar

• Ett Azure-konto med en aktiv prenumeration – Skapa ett konto kostnadsfritt.
• GitHub-konto för att använda GitHub Codespaces – Läs mer om GitHub Codespaces.

Öppna exemplet med Codespaces

Det enklaste sättet att komma igång är att använda GitHub Codespaces, som ger en fullständig utvecklingsmiljö med alla nödvändiga verktyg förinstallerade.

1. Navigera till GitHub-lagringsplatsen på https://github.com/Azure-Samples/app-service-agentic-langgraph-foundry-python.

2. Välj knappen Kod , välj fliken Codespaces och välj Skapa kodområde på main.

3. Vänta en stund tills kodområdet initieras. När du är klar visas en fullständigt konfigurerad utvecklingsmiljö i webbläsaren.

4. Kör programmet lokalt:

   python3 -m venv venv
   source venv/bin/activate
   pip install -r requirements.txt
   uvicorn src.app:app --host 0.0.0.0 --port 3000
   

5. När du ser Att programmet körs på port 3000 är tillgängligt väljer du Öppna i webbläsare och lägger till några uppgifter.

   Agenterna är inte helt konfigurerade så de fungerar inte än. Du konfigurerar dem senare.

Granska agentkoden

Båda metoderna använder samma implementeringsmönster, där agenten initieras vid programstart, och svarar på användarmeddelanden via POST-begäranden.

LangGraph

LangGraphTaskAgent initieras i konstruktorn i src/agents/langgraph_task_agent.py. Initieringskoden gör följande:

• Konfigurerar AzureChatOpenAI-klienten med hjälp av miljövariabler.
• Skapar den fördefinierade ReAct-agenten med minne och en uppsättning CRUD-verktyg för uppgiftshantering (se Snabbstart för LangGraph).

# Initialize Azure OpenAI client
credential = DefaultAzureCredential()
azure_ad_token_provider = get_bearer_token_provider(
    credential, "https://cognitiveservices.azure.com/.default"
)

self.llm = AzureChatOpenAI(
    azure_endpoint=endpoint,
    azure_deployment=deployment_name,
    azure_ad_token_provider=azure_ad_token_provider,
    api_version="2024-10-21"
)

# Define tools
tools = [
    self._create_task_tool(),
    self._get_tasks_tool(),
    self._get_task_tool(),
    self._update_task_tool(),
    self._delete_task_tool()
]

# Create the agent
self.agent = create_react_agent(self.llm, tools, checkpointer=self.memory)
print("LangGraph Task Agent initialized successfully")

När du bearbetar användarmeddelanden anropas agenten med hjälp av ainvoke() användarens meddelande och ett tråd-ID för konversationskontinuitet:

result = await self.agent.ainvoke(
    {"messages": [("user", message)]},
    config=config
)

Gjuteriagenttjänst

FoundryTaskAgent Initieras i konstruktorn för src/agents/foundry_task_agent.py. Initieringskoden gör följande:

• Skapar en AIProjectClient med Azure-autentiseringsuppgifter.
• Hämtar en OpenAI-klient från projektklienten.
• Hämtar agenten från Foundry med namn.
• Skapar en ny konversation för sessionen.

# Create the project client using Azure credentials
self.project_client = AIProjectClient(
    endpoint=endpoint,
    credential=DefaultAzureCredential()
)

# Get the OpenAI client for conversation operations
self.openai_client = self.project_client.get_openai_client()

# Find the existing agent by name
self.agent = self.project_client.agents.get(agent_name)

if not self.agent:
    print(f"Agent with name '{agent_name}' not found in project.")
    return
            
# Create a conversation for this session
conversation = self.openai_client.conversations.create()
self.conversation_id = conversation.id
print("Foundry agent initialized successfully")

Den här initieringskoden definierar inte några funktioner för agenten eftersom du vanligtvis skapar agenten i Foundry-portalen. Som en del av exempelscenariot följer det även OpenAPI-mönstret som visas i Lägg till en App Service-app som ett verktyg i Foundry Agent Service (Python) och gör dess CRUD-funktioner tillgängliga som en OpenAPI-slutpunkt. På så sätt kan du lägga till den i agenten senare som ett anropsbart verktyg.

OpenAPI-koden definieras i src/routes/api.py. Till exempel definierar "GET /tasks"-vägen en anpassad operation_id parameter, som krävs av OpenAPI-specifikationsverktyget i Microsoft Foundry, och description hjälper agenten att avgöra hur API:et anropas:

@router.get(
    "/tasks",
    response_model=List[TaskItem],
    operation_id="getAllTasks",
    description="Retrieve all tasks in the task list."
)
async def get_all_tasks():
    """Get all tasks"""
    try:
        tasks = await task_service.get_all_tasks()
        return tasks
    except Exception as e:
        print(f"Error getting tasks: {e}")
        import traceback
        traceback.print_exc()
        raise HTTPException(status_code=500, detail=f"Failed to get tasks: {str(e)}")

När användarmeddelanden bearbetas anropas agenten genom att användarens meddelande läggs till i konversationen och anropas responses.create() med agentreferensen:

# Add user message to the conversation
self.openai_client.conversations.items.create(
    conversation_id=self.conversation_id,
    items=[{"type": "message", "role": "user", "content": message}],
)

# Create response using the agent
response = self.openai_client.responses.create(
    conversation=self.conversation_id,
    extra_body={"agent": {"name": self.agent.name, "type": "agent_reference"}},
    input="",
)

Distribuera exempelprogrammet

Exempellagringsplatsen innehåller en AZD-mall (Azure Developer CLI) som skapar en App Service-app med hanterad identitet och distribuerar exempelprogrammet.

1. Logga in på Azure med Azure Developer CLI i terminalen:

   azd auth login
   

   Följ anvisningarna för att slutföra autentiseringsprocessen.

2. Distribuera Azure App Service-appen med AZD-mallen:

   azd up
   

3. När du uppmanas att ge följande svar:

   Question	Svar
   Ange ett nytt miljönamn:	Skriv ett unikt namn.
   Välj en Azure-prenumeration som ska användas:	Välj prenumerationen.
   Välj en resursgrupp som ska användas:	Välj Skapa en ny resursgrupp.
   Välj en plats för att skapa resursgruppen i:	Välj Sweden Central.
   Ange ett namn för den nya resursgruppen:	Skriv Retur.

4. I AZD-utdata letar du reda på url:en för din app och navigerar till den i webbläsaren. URL:en ser ut så här i AZD-utdata:

    Deploying services (azd deploy)
   
      (✓) Done: Deploying service web
      - Endpoint: <URL>
    

5. Öppna det automatiskt genererade OpenAPI-schemat på https://....azurewebsites.net/openapi.json sökvägen. Du behöver det här schemat senare.

   Nu har du en App Service-app med en systemtilldelad hanterad identitet.

Skapa och konfigurera Microsoft Foundry-resursen

LangGraph

1. I Foundry-portalen kontrollerar du att den översta Ny Foundry-radioknappen är inställd på aktiv och skapa ett projekt.

2. Distribuera en modell (se Microsoft Foundry Snabbstart: Skapa resurser).

3. Kopiera modellnamnet överst på modelllekplatsen.

4. Det enklaste sättet att hämta Azure OpenAI-slutpunkten är fortfarande från den klassiska portalen. Välj alternativknappen Ny foundry, därefter Azure OpenAI, och kopiera sedan URL:en vid Azure OpenAI slutpunkt för senare användning.

   

Gjuteriagenttjänst

1. I Foundry-portalen kontrollerar du att den översta Ny Foundry-radioknappen är inställd på aktiv och skapa ett projekt.

2. På startsidan kopierar du Projektslutpunkten för senare.

3. Välj Börja skapa>en agent och följ anvisningarna.

4. I den nya agentens lekplats skapar du ett OpenAPI-verktyg för att anropa webbappen genom att välja Verktyg>Lägg till>anpassat>OpenAPI-verktyg>Skapa. I installationsfönstret lägger du till en åtgärd med verktyget OpenAPI-specifikation. Använd OpenAPI-schemat som du får från den distribuerade webbappen och anonym autentisering. Detaljerade steg finns i Använda OpenAPI-specifikationsverktyget.

   Programkoden är redan konfigurerad för att inkludera serverns url och operationId, som krävs av agenten. Mer information finns i Ansluta till OpenAPI-specifikation.

5. Var noga med att välja Spara.

6. Välj Prova på lekplatsen och testa Foundry-agenten med frågor som "Visa mig alla uppgifter" och "Lägg till en uppgift".

   Om du får ett giltigt svar anropar agenten verktygsanrop till OpenAPI-slutpunkten i din distribuerade webbapp.

Tilldela nödvändiga behörigheter

LangGraph

1. På den översta menyn i den nya Foundry-portalen väljer du Använd och sedan Admin. På raden för ditt Foundry-projekt bör du se två länkar. Den i kolumnen Namn är projektresursen Foundry och den i kolumnen Överordnad resurs är Foundry-resursen.

   

2. Välj Foundry-resursen i den överordnade resursen och välj sedan Hantera den här resursen i Azure-portalen. Från Azure-portalen kan du tilldela rollbaserad åtkomst för resursen till den distribuerade webbappen.

3. Lägg till följande roll för App Service-appens hanterade identitet:

   Målresurs	Obligatorisk roll	Behövs för
   Gjuteri	Cognitive Services OpenAI-användare	Tjänsten för chattens slutförande i Microsoft Agent Framework.

   Anvisningar finns i Tilldela Azure-roller med hjälp av Azure-portalen.

Gjuteriagenttjänst

1. På den översta menyn i den nya Foundry-portalen väljer du Använd och sedan Admin. På raden för ditt Foundry-projekt bör du se två länkar. Den i kolumnen Namn är projektresursen Foundry och den i kolumnen Överordnad resurs är Foundry-resursen.

   

2. Välj projektresursen Foundry i kolumnen Namn och välj sedan Hantera den här resursen i Azure-portalen. Från Azure-portalen kan du tilldela rollbaserad åtkomst för resursen till den distribuerade webbappen.

3. Lägg till följande roll för App Service-appens hanterade identitet:

   Målresurs	Obligatorisk roll	Behövs för
   Foundry-projekt	Azure AI-användare	Läser och anropar Foundry-agenten.

   Anvisningar finns i Tilldela Azure-roller med hjälp av Azure-portalen.

Konfigurera anslutningsvariabler i exempelprogrammet

1. Öppna .env. Med de värden som du kopierade tidigare från Foundry-portalen konfigurerar du följande variabler:

   LangGraph

   Variable	Description
   AZURE_OPENAI_ENDPOINT	Azure OpenAI-slutpunkt (kopierad från den klassiska Foundry-portalen).
   AZURE_OPENAI_DEPLOYMENT_NAME	Modellnamn i distributionen (kopieras från modelllekplatsen i den nya Foundry-portalen).

   Anmärkning

   För att hålla självstudien enkel använder du dessa variabler i .env i stället för att skriva över dem med appinställningar i App Service.

   Gjuteriagenttjänst

   Variable	Description
   AZURE_AI_FOUNDRY_PROJECT_ENDPOINT	Microsoft Foundry-projektslutpunkten från den nya Foundry-portalen.
   AZURE_AI_FOUNDRY_AGENT_NAME	Agentnamn (från agentlekplatsen i Foundry-portalen).

   Anmärkning

   För att hålla självstudien enkel använder du dessa variabler i .env i stället för att skriva över dem med appinställningar i App Service.

2. Logga in på Azure med Azure CLI:

   az login
   

   På så sätt kan Azure Identity-klientbiblioteket i exempelkoden ta emot en autentiseringstoken för den inloggade användaren. Kom ihåg att du lade till den roll som krävs för den här användaren tidigare.

3. Kör programmet lokalt:

   npm run build
   npm start
   

4. När du ser Att programmet körs på port 3000 är tillgängligt väljer du Öppna i webbläsare.

5. Välj länken LangGraph Agent och länken Foundry Agent för att testa chattgränssnittet. Om du får ett svar ansluter programmet till Microsoft Foundry-resursen.

6. Tillbaka i GitHub-kodområdet distribuerar du dina appändringar.

   azd up
   

7. Navigera till det distribuerade programmet igen och testa chattagenterna.

LangGraph

Gjuteriagenttjänst

Rensa resurser

När du är klar med programmet kan du ta bort App Service-resurserna för att undvika ytterligare kostnader:

azd down --purge

Eftersom AZD-mallen inte innehåller Microsoft Foundry-resurserna måste du ta bort dem manuellt om du vill.

Fler resurser

• Integrera AI i dina Azure App Service-program
• Vad är Foundry Agent Service?
• LangGraph – snabbstart
• Azure AI Projects-klientbibliotek för Python