Előző

Következő

Gyakorlat – Lekérdezéses alapú webalkalmazás korlátozásainak elemzése

Befejeződött

Mielőtt megváltoztatja a prototípust, le kell futtatnia a feltételezések érvényesítéséhez. A prototípus egy forráskódtárban található a GitHubon.

Azure-erőforrások létrehozása

1. Egy külön böngészőlapon vagy ablakban forgja el a mintaadattárat a GitHubon az alábbi hivatkozással: mslearn-advocates.azure-functions-and-signalr. Ez lehetővé teszi a módosítások leküldését a forráskód saját verziójára. Ez egy szükséges lépés ahhoz, hogy a forráskódot a modul későbbi részében üzembe helyezhesse az Azure-ban.

2. A terminálban klónozza az adattárat. A következő parancsban cserélje le MicrosoftDocs a fiókját:

   git clone https://github.com/MicrosoftDocs/mslearn-advocates.azure-functions-and-signalr stock-prototype
   

3. Telepítse a függőségeket a beállítási erőforrások mappába.

   cd stock-prototype/setup-resources && npm install
   

   Ha figyelmeztetést kap, EBADENGINEfigyelmen kívül hagyhatja őket.

4. Jelentkezzen be az Azure-ba az Azure CLI-vel.

   az login
   

5. Tekintse meg az előfizetéseit, és állítsa be az alapértelmezett Azure-előfizetést.

   Az előfizetések megtekintése.

   az account list --output json | jq -r '.[] | .name' | sort
   

   Az alapértelmezett előfizetés beállításához cserélje le YOUR-SUBSCRIPTION-ID az előző Azure CLI-kimenetből származó előfizetés-azonosítót.

   az account set --subscription <YOUR-SUBSCRIPTION-ID>
   

   Ez az alapértelmezett előfizetés az Azure-erőforrások létrehozásához használatos.

6. Hozza létre az Azure-erőforrásokat, és töltse fel a mintaadatokat az adatbázisba. A folyamat végrehajtása eltarthat néhány percig.

   bash create-start-resources.sh "<YOUR-SUBSCRIPTION-NAME>"
   

   Ügyeljen arra, hogy a nevet idézőjelekbe csomagolja.

7. Másolja ki a szükséges információkat, ezekre lesz szüksége a prototípus futtatásához.

   Erőforrás típusa	Környezeti változó
   Azure Cosmos DB	Más néven COSMOSDB_CONNECTION_STRING
   Azure Storage	Más néven STORAGE_CONNECTION_STRING
   Erőforráscsoport	Más néven RESOURCE_GROUP_NAME.

8. Egy Node.js szkripttel töltse fel a mintaadatokat az adatbázisba az alábbi paranccsal.

   npm start
   

9. A terminálban keresse meg a gyökérmappát .

   cd ..
   

Függőségek telepítése és a prototípus futtatása

1. Telepítse a függőségeket.

   cd start/client && npm install && cd ../..
   cd start/server && npm install && cd ../..
   

2. Ha az értesítés arra kéri, hogy válasszon ki egy Azure-függvényalkalmazást a munkaterülethez, válassza a lehetőséget start/server. Ezt a függvényalkalmazást fogja használni a kiszolgálóoldali kód futtatásához.

3. Ha értesítést kap a legújabb Azure Functions Core Tools telepítéséről, válassza a Telepítés lehetőséget.

Az ügyfél és a kiszolgáló URL-címeinek lekérése

Helyi futtatáskor az ügyfél- és kiszolgálóalkalmazásnak tudnia kell, hol találják meg egymást. Az URL-címek a következők:

• Ügyfél: http://localhost:3000
• Kiszolgáló: http://localhost:7071

Az Azure Functions alkalmazás helyi beállításainak frissítése

Adja hozzá a kapcsolati sztring a prototípus Azure Functions-alkalmazásához.

1. Hozza létre a ./start/server/local.settings.json fájlt, és illessze be az alábbiakat. Ez a fájl tartalmazza a helyi függvényprojekt konfigurációs beállításait.

   {
     "IsEncrypted": false,
     "Values": {
       "AzureWebJobsStorage": "<STORAGE_CONNECTION_STRING>",
       "FUNCTIONS_WORKER_RUNTIME": "node",
       "AzureWebJobsFeatureFlags": "EnableWorkerIndexing",
       "COSMOSDB_CONNECTION_STRING": "<COSMOSDB_CONNECTION_STRING>"
     },
     "Host" : {
       "LocalHttpPort": 7071,
       "CORS": "http://localhost:3000",
       "CORSCredentials": true
     }
   }
   

2. Frissítse a következő változókat a fentről másolt értékekkel.

   Tulajdonság	Érték
   AzureWebJobsStorage	Cserélje le a Storage kapcsolati sztring.
   COSMOSDB_CONNECTION_STRING	Cserélje le a Cosmos DB kapcsolati sztring.

   A Functions-alkalmazás mostantól fogadhat kéréseket az ügyféltől, majd csatlakozhat az adatbázishoz, és megfelelően kezelheti az időzítő eseményindítóját.

Helyi beállítások hozzáadása az ügyfélalkalmazáshoz

Adja hozzá a kiszolgáló URL-címét a prototípus ügyfélalkalmazásához.

Nyissa meg a ./start/client fájlt, és hozzon létre egy .env fájlt az alábbi tartalommal.

BACKEND_URL=http://localhost:7071

A kiszolgálóalkalmazás futtatása

1. Indítsa el az Azure Functions-alkalmazást a terminálban.

   cd start/server && npm start
   

2. Várjon, amíg a terminál megjeleníti az API-végpontokat.

   Functions:
   
           getStocks: [GET] http://localhost:7071/api/getStocks
   
           setPrice: timerTrigger
   

Az ügyfélalkalmazás futtatása

1. Egy új terminálon indítsa el az ügyfélalkalmazást.

   cd start/client && npm start
   
   

2. Amikor az értesítés megjeleníti, hogy az alkalmazás fut, válassza a Megnyitás böngészőben lehetőséget a prototípus használatához.

   

3. Rendezze el a böngészőablakokat, hogy egyszerre láthassa a terminált és a részvényárak prototípusát.

4. A böngésző prototípusának ablakában nyissa meg a böngésző fejlesztői eszközeit. Figyelje meg, hogy a böngésző 5 másodpercenként kérelmet küld az API-nak az összes adathoz, annak ellenére, hogy az adatok nem változtak.

5. A böngészőablakban tekintse meg az Azure Functions alkalmazás kimenetét. Percenként egyetlen részvényárfolyam változik. Amikor az API ára megváltozik, az összes adat következő ügyfélbeolvasása tartalmazza ezt a módosítást.

   

6. A start-client és a start server terminálokon állítsa le az alkalmazásokat a Ctrl C billentyűkombinációval + , vagy a kuka ikon kiválasztásával ölje meg a terminált.

Ebben az egységben futtatta a prototípust. Bár az ügyfél sikeresen fut, nem hatékony. Bár minden egyes ügyfél ezt nem veszi észre ilyen kis számú készlettel, ez megváltozik a készletek számának növekedésével és a kiszolgálóról lekérhető ügyfelek számával. A prototípus fejleszthető. Nézzük meg, hogyan a következő leckében.

Folytatás