Delen via

Zelfstudie: Chatbot uitvoeren in App Service met een Phi-4 sidecar-extensie (Express.js)

Deze zelfstudie begeleidt u bij het implementeren van een Express.js-gebaseerde chatbottoepassing die is geïntegreerd met de Phi-4-sidecar-extensie in Azure App Service. Door de stappen te volgen, leert u hoe u een schaalbare web-app instelt, een ai-sidecar toevoegt voor verbeterde gespreksmogelijkheden en de functionaliteit van de chatbot test.

Het hosten van uw eigen kleine taalmodel (SLM) biedt verschillende voordelen:

  • Volledige controle over uw gegevens. Gevoelige informatie wordt niet blootgesteld aan externe services, wat essentieel is voor branches met strikte nalevingsvereisten.
  • Zelfgehoste modellen kunnen worden afgestemd om te voldoen aan specifieke toepassingsgevallen of domeinspecifieke vereisten.
  • Geminimaliseerde netwerklatentie en snellere reactietijden voor een betere gebruikerservaring.
  • Volledige controle over resourcetoewijzing, waardoor optimale prestaties voor uw toepassing worden gegarandeerd.

Vereiste voorwaarden

De voorbeeldtoepassing implementeren

  1. Navigeer in de browser naar de opslagplaats van de voorbeeldtoepassing.

  2. Start een nieuwe Codespace vanuit de opslagplaats.

  3. Meld u aan met uw Azure-account:

    az login

  4. Open de terminal in de Codespace en voer de volgende opdrachten uit:

    cd use_sidecar_extension/expressapp
az webapp up --sku P3MV3

Deze opstartopdracht is een algemene installatie voor het implementeren van Express.js toepassingen in Azure App Service. Zie Een Node.js-web-app implementeren in Azure voor meer informatie.

De sidecar-extensie Phi-4 toevoegen

In deze sectie voegt u de phi-4 sidecar-extensie toe aan uw ASP.NET Core-toepassing die wordt gehost in Azure App Service.

  1. Navigeer naar Azure Portal en ga naar de beheerpagina van uw app.
  2. Selecteer implementatiecentrum> in het menu aan de linkerkant.
  3. Selecteer Op het tabblad Containers deextensie Sidecar>.
  4. In de opties voor extensie van sidecar, selecteer AI: phi-4-q4-gguf (experimenteel).
  5. Geef een naam op voor de sidecar-extensie.
  6. Selecteer Opslaan om de wijzigingen toe te passen.
  7. Wacht enkele minuten totdat de sidecar-extensie is geïmplementeerd. Blijf Vernieuwen selecteren totdat de kolom StatusRunning aangeeft.

Deze Phi-4 sidecar-extensie maakt gebruik van een API voor chatvoltooiing zoals OpenAI die een chatvoltooiingsreactie kan geven op http://localhost:11434/v1/chat/completions. Zie voor meer informatie over de interactie met de API:

De chatbot testen

  1. Selecteer Overzicht op de beheerpagina van uw app in het menu aan de linkerkant.

  2. Selecteer onder Standaarddomein de URL om uw web-app in een browser te openen.

  3. Controleer of de chatbottoepassing wordt uitgevoerd en reageert op gebruikersinvoer.

    Schermopname van de modeassistent-app die wordt uitgevoerd in de browser.

Hoe de voorbeeldtoepassing werkt

De voorbeeldtoepassing laat zien hoe u een Express.js-gebaseerde service integreert met de SLM-sidecar-extensie. De SLMService klasse bevat de logica voor het verzenden van aanvragen naar de SLM-API en het verwerken van de gestreamde antwoorden. Met deze integratie kan de toepassing dynamisch gespreksreacties genereren.

Als u in use_sidecar_extension/expressapp/src/services/slm_service.jskijkt, ziet u dat:

  • De service verzendt een POST-aanvraag naar het SLM-eindpunt http://127.0.0.1:11434/v1/chat/completions.

    this.apiUrl = 'http://127.0.0.1:11434/v1/chat/completions';

  • De POST-nettolading bevat het systeembericht en de prompt die is gebouwd op basis van het geselecteerde product en de gebruikersquery.

    const requestPayload = {
  messages: [
    { role: 'system', content: 'You are a helpful assistant.' },
    { role: 'user', content: prompt }
  ],
  stream: true,
  cache_prompt: false,
  n_predict: 2048 // Increased token limit to allow longer responses
};

  • De POST-aanvraag streamt de antwoordregel per regel. Elke regel wordt geparseerd om de gegenereerde inhoud (of token) te extraheren.

    // Set up Server-Sent Events headers
res.setHeader('Content-Type', 'text/event-stream');
res.setHeader('Cache-Control', 'no-cache');
res.setHeader('Connection', 'keep-alive');
res.flushHeaders();

const response = await axios.post(this.apiUrl, requestPayload, {
  headers: { 'Content-Type': 'application/json' },
  responseType: 'stream'
});

response.data.on('data', (chunk) => {
  const lines = chunk.toString().split('\n').filter(line => line.trim() !== '');

  for (const line of lines) {
    let parsedLine = line;
    if (line.startsWith('data: ')) {
      parsedLine = line.replace('data: ', '').trim();
    }

    if (parsedLine === '[DONE]') {
      return;
    }

    try {
      const jsonObj = JSON.parse(parsedLine);
      if (jsonObj.choices && jsonObj.choices.length > 0) {
        const delta = jsonObj.choices[0].delta || {};
        const content = delta.content;

        if (content) {
          // Use non-breaking space to preserve formatting
          const formattedToken = content.replace(/ /g, '\u00A0');
          res.write(`data: ${formattedToken}\n\n`);
        }
      }
    } catch (parseError) {
      console.warn(`Failed to parse JSON from line: ${parsedLine}`);
    }
  }
});

Veelgestelde vragen

Hoe is de prijscategorie van invloed op de prestaties van de SLM-sidecar?

Omdat AI-modellen aanzienlijke resources verbruiken, kiest u de prijscategorie waarmee u voldoende vCPU's en geheugen krijgt om uw specifieke model uit te voeren. Daarom worden de ingebouwde AI-sidecar-extensies alleen weergegeven wanneer de app zich in een geschikte prijscategorie bevindt. Als u uw eigen SLM-sidecarcontainer bouwt, moet u ook een model gebruiken dat voor de CPU geoptimaliseerd is, omdat de prijscategorieën van de App Service uitsluitend CPU-lagen zijn.

Het Phi-3 minimodel met een 4K-contextlengte van Hugging Face is bijvoorbeeld ontworpen om te worden uitgevoerd met beperkte resources en biedt sterke wiskundige en logische redeneringen voor veel algemene scenario's. Het wordt ook geleverd met een versie die is geoptimaliseerd voor CPU. In App Service hebben we het model getest op alle Premium-lagen en gevonden dat het goed presteert in de P2mv3-laag of hoger. Als uw vereisten het toelaten, kunt u het op een lager niveau uitvoeren.

Hoe gebruik ik mijn eigen SLM-sidecar?

De voorbeeldopslagplaats bevat een SLM-voorbeeldcontainer die u als sidecar kunt gebruiken. Er wordt een FastAPI-toepassing uitgevoerd die luistert op poort 8000, zoals opgegeven in het Dockerfile. De toepassing gebruikt ONNX Runtime om het Phi-3-model te laden en stuurt vervolgens de HTTP POST-gegevens door naar het model en streamt het antwoord van het model terug naar de client. Zie model_api.py voor meer informatie.

Als u de sidecar-afbeelding zelf wilt bouwen, moet u Docker Desktop lokaal op uw machine installeren.

  1. Kloon de opslagplaats lokaal.

    git clone https://github.com/Azure-Samples/ai-slm-in-app-service-sidecar
cd ai-slm-in-app-service-sidecar

  2. Ga naar de bronmap van de Phi-3-afbeelding en download het model lokaal met behulp van de Huggingface CLI.

    cd bring_your_own_slm/src/phi-3-sidecar
huggingface-cli download microsoft/Phi-3-mini-4k-instruct-onnx --local-dir ./Phi-3-mini-4k-instruct-onnx

    Het Dockerfile is geconfigureerd om het model te kopiëren van ./Phi-3-mini-4k-instruct-onnx.

  3. Bouw de Docker-installatiekopie. Voorbeeld:

    docker build --tag phi-3 .

  4. Upload de ingebouwde installatiekopie naar Azure Container Registry met push uw eerste installatiekopie naar uw Azure-containerregister met behulp van de Docker CLI.

  5. Selecteer Op het tabblad Implementatiecentrumcontainers>(nieuw)de optie Aangepaste container> en configureert u de nieuwe container als volgt:

    • Naam: phi-3
    • Bron van installatiekopieën: Azure Container Registry
    • Register: uw register
    • Afbeelding: de geüploade afbeelding
    • Tag: de gewenste afbeeldingstag
    • Poort: 8000

  6. Selecteer de optie Toepassen.

Zie bring_your_own_slm/src/webapp voor een voorbeeldtoepassing die communiceert met deze aangepaste sidecarcontainer.

Volgende stappen

Zelfstudie: Een sidecarcontainer configureren voor een Linux-app in Azure App Service

  • Last updated on