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

LangGraphTaskAgent Initieras i konstruktorn i src/agents/LangGraphTaskAgent.ts. Initieringskoden gör följande:

• Konfigurerar AzureChatOpenAI-klienten med hjälp av miljövariabler.
• Skapar den fördefinierade ReAct-agenten med en uppsättning CRUD-verktyg för uppgiftshantering (se LangGraph: Så här använder du den fördefinierade ReAct-agenten).
• Konfigurerar minneshantering (se LangGraph: Så här lägger du till minne i den fördefinierade ReAct-agenten).

    constructor(taskService: TaskService) {
        this.taskService = taskService;
        this.memory = new MemorySaver();
        try {
            const endpoint = process.env.AZURE_OPENAI_ENDPOINT;
            const deploymentName = process.env.AZURE_OPENAI_DEPLOYMENT_NAME;

            if (!endpoint || !deploymentName) {
                console.warn('Azure OpenAI configuration missing for LangGraph agent');
                return;
            }
            // Initialize Azure OpenAI client
            const credential = new DefaultAzureCredential();
            const azureADTokenProvider = getBearerTokenProvider(credential, "https://cognitiveservices.azure.com/.default");
            
            this.llm = new AzureChatOpenAI({
                azureOpenAIEndpoint: endpoint,
                azureOpenAIApiDeploymentName: deploymentName,
                azureADTokenProvider: azureADTokenProvider,
                azureOpenAIApiVersion: "2024-10-21"
            });
            // Define tools directly in the array
            const tools = [
                tool(
                    async ({ title, isComplete = false }) => {
                        const task = await this.taskService.addTask(title, isComplete);
                        return `Task created successfully: "${task.title}" (ID: ${task.id})`;
                    },
                    {
                        name: 'createTask',
                        description: 'Create a new task',
                        schema: z.object({
                            title: z.string(),
                            isComplete: z.boolean().optional()
                        }) as any
                    }
                ),
                tool(
                    async () => {
                        const tasks = await this.taskService.getAllTasks();
                        if (tasks.length === 0) {
                            return 'No tasks found.';
                        }
                        return `Found ${tasks.length} tasks:\n` + 
                               tasks.map(t => `- ${t.id}: ${t.title} (${t.isComplete ? 'Complete' : 'Incomplete'})`).join('\n');
                    },
                    {
                        name: 'getTasks',
                        description: 'Get all tasks',
                        schema: z.object({}) as any
                    }
                ),
                tool(
                    async ({ id }) => {
                        const task = await this.taskService.getTaskById(id);
                        if (!task) {
                            return `Task with ID ${id} not found.`;
                        }
                        return `Task ${task.id}: "${task.title}" - Status: ${task.isComplete ? 'Complete' : 'Incomplete'}`;
                    },
                    {
                        name: 'getTask',
                        description: 'Get a specific task by ID',
                        schema: z.object({
                            id: z.number()
                        }) as any
                    }
                ),
                tool(
                    async ({ id, title, isComplete }) => {
                        const updated = await this.taskService.updateTask(id, title, isComplete);
                        if (!updated) {
                            return `Task with ID ${id} not found.`;
                        }
                        return `Task ${id} updated successfully.`;
                    },
                    {
                        name: 'updateTask',
                        description: 'Update an existing task',
                        schema: z.object({
                            id: z.number(),
                            title: z.string().optional(),
                            isComplete: z.boolean().optional()
                        }) as any
                    }
                ),
                tool(
                    async ({ id }) => {
                        const deleted = await this.taskService.deleteTask(id);
                        if (!deleted) {
                            return `Task with ID ${id} not found.`;
                        }
                        return `Task ${id} deleted successfully.`;
                    },
                    {
                        name: 'deleteTask',
                        description: 'Delete a task',
                        schema: z.object({
                            id: z.number()
                        }) as any
                    }
                )
            ];

            // Create the ReAct agent with memory
            this.agent = createReactAgent({
                llm: this.llm,
                tools,
                checkpointSaver: this.memory,
                stateModifier: `You are an AI assistant that manages tasks using CRUD operations.
                
You have access to tools for creating, reading, updating, and deleting tasks.
Always use the appropriate tool for any task management request.
Be helpful and provide clear responses about the actions you take.

If you need more information to complete a request, ask the user for it.`
            });
        } catch (error) {
            console.error('Error initializing LangGraph agent:', error);
        }
    }

Det distribuerade exemplet skyddas av App Service-autentisering och använder en servervald LangGraph-tråd. När du bearbetar användarmeddelanden anropar invoke() agenten med användarens meddelande och serverhanterad tråd-ID:

private readonly conversationThreadId = 'authenticated-conversation';

const result = await this.agent.invoke(
    {
        messages: [
            { role: 'user', content: message }
        ]
    },
    {
        configurable: {
            thread_id: this.conversationThreadId
        }
    }
);

FoundryTaskAgent använder ett "lazy initialization pattern" i src/agents/FoundryTaskAgent.ts. Initieringskoden gör följande:

• Skapar en AIProjectClient med Azure-autentiseringsuppgifter.
• Hämtar en OpenAI-klient från projektklienten.
• Hämtar agenten vid namn.
• Skapar en serverhanterad konversation för den App Service-autentiserade exempelupplevelsen.

// Create the AI Project client
this.project = new AIProjectClient(endpoint, new DefaultAzureCredential());
this.openAIClient = await this.project.getOpenAIClient();
this.agentName = agentName;

// App Service authentication protects this app, so this sample intentionally
// keeps one server-managed authenticated conversation for the Foundry path.
const conversation = await this.openAIClient.conversations.create({
    items: [],
});
this.conversationId = conversation.id;

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 (Node.js), 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.ts. Till exempel definierar operationId vägen "GET /api/tasks" i JSDoc Swagger-kommentarerna, enligt vad som krävs av OpenAPI-specifikationsverktyget i Microsoft Foundry, och description hjälper agenten att avgöra hur API:et ska anropas:

/**
 * @swagger
 * /api/tasks:
 *   get:
 *     summary: Get all tasks
 *     operationId: getAllTasks
 *     responses:
 *       200:
 *         description: List of tasks
 */
router.get('/tasks', async (req: Request, res: Response) => {
    try {
        const tasks = await taskService.getAllTasks();
        res.json(tasks);
    } catch (error) {
        console.error('Error getting tasks:', error);
        res.status(500).json({ error: 'Failed to get tasks' });
    }
});

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

try {
    // Add the user message to the conversation
    await this.openAIClient.conversations.items.create(this.conversationId, {
        items: [{ type: 'message', role: 'user', content: message }],
    });

    // Generate response using the agent
    const response = await this.openAIClient.responses.create(
        {
            conversation: this.conversationId,
        },
        {
            body: { agent: { name: this.agentName, type: 'agent_reference' } },
        }

1. I Foundry-portalen, skapa ett projekt.

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

3. Kopiera modellnamnet överst på modelllekplatsen.

4. På startsidan, kopiera Azure OpenAI-endpointen för senare.

1. I Foundry-portalen, skapa ett projekt.

2. På startsidan, kopiera Project-endpointen för senare användning.

3. Välj Börja bygga och följ prompten.

4. Välj verktyg>Lägg till>Lägg till verktyg>Anpassade>OpenAPI-verktyg>Skapa. I installationsfönstret lägger du till en åtgärd med verktyget OpenAPI-specifikation.

5. Klistra in OpenAPI-schemat som du kopierade från den autentiserade App Service-appen.

6. Som Autentiseringsmetod väljer du Hanterad identitet.

7. För Audience, klistra in värdet för Foundry OpenAPI managed identity audience från AZD-utdata. Den liknar:

   api://<generated-client-id>
   

8. Spara verktyget och agenten.

Låt den överordnade Foundry-resursen anropa uppgifts-API:et

1. I Foundry-portalen, välj Hantera i toppmenyn.

2. I Project-detaljer, välj Parent-resursen för ditt projekt och välj sedan Open i Azure-portalen.

3. Kopiera den systemtilldelade identitetens objekt-ID (huvudnamn). Hitta den identiteten i Microsoft Entra ID och kopiera dess applikations-ID. För detaljerade steg, se Hitta huvudidentiteten för Foundry-resursen.

4. I Codespace-terminalen, lagra applikations-ID:t i AZD-miljön och uppdatera App Service-autentiseringskonfigurationen:

   azd env set AZURE_AI_FOUNDRY_ACCOUNT_CLIENT_ID <application-id>
   azd provision
   

1. I Foundry-portalen, välj Hantera i toppmenyn.

2. I Project-detaljer, välj Parent-resursen för ditt projekt och välj sedan Open i Azure-portalen.

   Från Azure-portalen kan du tilldela rollbaserad åtkomst till resursen.

3. Lägg till följande roll både för App Service-appens hanterade identitet och för användaren du använder med az login:

   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.

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

1. I Foundry-portalen, välj Hantera i toppmenyn.

2. I Project details, välj Open in Azure portal.

   Från Azure-portalen kan du tilldela rollbaserad åtkomst för projektet.

3. Lägg till följande roll både för App Service-appens hanterade identitet och för användaren du använder med az login:

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

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