Node.js-webalkalmazás üzembe helyezése az Azure-ban

Ebben a rövid útmutatóban megtudhatja, hogyan hozhatja létre és helyezheti üzembe első Node.js (Express) webalkalmazását a Azure-alkalmazás Szolgáltatásban. Az App Service támogatja a Node.js különböző verzióit Linuxon és Windowson egyaránt.

Ez a rövid útmutató egy App Service-alkalmazást konfigurál az ingyenes szinten, és nem jár költséggel az Azure-előfizetéshez.

Ez a videó bemutatja, hogyan helyezhet üzembe Node.js webalkalmazást az Azure-ban.

A videó lépéseit a következő szakaszokban is ismertetjük.

A kezdeti környezet beállítása

• Rendelkezik aktív előfizetéssel rendelkező Azure-fiókkal. Fiók ingyenes létrehozása.
• Telepítse Node.js LTS-t. Futtassa a parancsot node --version a Node.js telepítésének ellenőrzéséhez.
• A Visual Studio Code telepítése.
• Telepítse az Azure App Service szolgáltatás bővítményt a Visual Studio Code-hoz.

• Rendelkezik aktív előfizetéssel rendelkező Azure-fiókkal. Fiók ingyenes létrehozása.
• Telepítse Node.js LTS-t. Futtassa a parancsot node --version a Node.js telepítésének ellenőrzéséhez.
• Telepítse az Azure CLI-t, amellyel parancsokat futtat egy rendszerhéjban az Azure-erőforrások létrehozásához és konfigurálásához.

• Rendelkezik aktív előfizetéssel rendelkező Azure-fiókkal. Fiók ingyenes létrehozása.
• Telepítse Node.js LTS-t. Futtassa a parancsot node --version a Node.js telepítésének ellenőrzéséhez.
• Ftp-ügyféllel (például FileZilla) csatlakozhat az alkalmazáshoz.

A Node.js-alkalmazás létrehozása

Ebben a lépésben létrehoz egy alapszintű Node.js alkalmazást, és gondoskodik arról, hogy az a számítógépen fusson.

Tipp.

Ha már elvégezte a Node.js oktatóanyagot, továbbléphet az Azure-beli üzembe helyezésre.

1. Hozzon létre egy Node.js alkalmazást az Express Generator használatával, amely alapértelmezés szerint Node.js és npm használatával van telepítve.

   npx express-generator myExpressApp --view ejs
   

   Ha ez az első alkalom, hogy telepítette a generátort, az npx megkéri, hogy fogadja el a telepítést.

2. Váltson az alkalmazás könyvtárára, és telepítse az npm-csomagokat.

   cd myExpressApp && npm install
   

3. Frissítse a függőségeket a legbiztonságosabb verzióra.

   npm audit fix --force
   

4. Indítsa el a fejlesztői kiszolgálót hibakeresési információkkal.

   DEBUG=myexpressapp:* npm start
   

5. A böngészőben navigáljon el a következőre http://localhost:3000. Ennek nagyjából a következőképpen kell kinéznie:

   

Problémába ütköztem

Üzembe helyezés az Azure-ban

A folytatás előtt győződjön meg arról, hogy minden előfeltétel telepítve és konfigurálva van.

Megjegyzés

Ahhoz, hogy az Node.js alkalmazás az Azure-ban fusson, figyelnie kell a PORT környezeti változó által biztosított portot. A létrehozott Express-alkalmazásban ez a környezeti változó már használatban van az indítási szkript tárolójában/www. (Keresés a következőre: process.env.PORT)

Bejelentkezés az Azure-ba

1. A terminálban győződjön meg arról, hogy a myExpressApp könyvtárban van, majd indítsa el a Visual Studio Code-ot a következő paranccsal:

   code .
   

2. A Visual Studio Code tevékenységsávjában válassza ki az Azure-emblémát.

3. Az App Service Explorerben válassza a Bejelentkezés az Azure-ba lehetőséget, és kövesse az utasításokat.

   A Visual Studio Code-ban az Azure-beli e-mail-címét az Állapotsoron, az előfizetését pedig az App Service Explorerben kell látnia.

   

Problémába ütköztem

Az App Service-alkalmazás konfigurálása és a kód üzembe helyezése

1. Válassza ki a myExpressApp mappát.

Üzembe helyezés Linuxon

2. Kattintson a jobb gombbal az App Servicesre , és válassza az Új webalkalmazás létrehozása lehetőséget. A rendszer alapértelmezés szerint linuxos tárolót használ.

3. Írjon be egy globálisan egyedi nevet a webalkalmazásnak, és válassza az Enter lehetőséget. A névnek az összes Azure-ban egyedinek kell lennie, és csak alfanumerikus karaktereket ('A-Z', 'a-z' és '0-9') és kötőjeleket ('-' kell használnia).

4. A Futtatókörnyezet kiválasztása csoportban válassza ki a kívánt Node.js verziót. LtS-verzió használata ajánlott.

5. A Tarifacsomag kiválasztása területen válassza az Ingyenes (F1) lehetőséget, és várja meg, amíg az erőforrások létrejönnek az Azure-ban.

6. Az előugró ablakban "Mindig telepítse a 'myExpressApp' munkaterületet az <app-name>"-re válassza az Igen lehetőséget. Ezzel biztosítja, hogy mindaddig, amíg ugyanabban a munkaterületen van, a Visual Studio Code minden alkalommal ugyanarra az App Service-alkalmazásra telepedik.

   Bár a Visual Studio Code létrehozza az Azure-erőforrásokat, és üzembe helyezi a kódot, állapotértesítéseket jelenít meg.

7. Az üzembe helyezés befejezése után válassza a Webhely tallózása lehetőséget az értesítési előugró ablakban. A böngészőnek meg kell jelennie az Express alapértelmezett lapjának.

Üzembe helyezés a Windowsban

2. Kattintson a jobb gombbal az App Servicesre , és válassza az Új webalkalmazás létrehozása... Speciális.

3. Írjon be egy globálisan egyedi nevet a webalkalmazásnak, és válassza az Enter lehetőséget. A névnek az összes Azure-ban egyedinek kell lennie, és csak alfanumerikus karaktereket ('A-Z', 'a-z' és '0-9') és kötőjeleket ('-' kell használnia).

4. Válassza az Új erőforráscsoport létrehozása lehetőséget, majd adja meg az erőforráscsoport nevét( például AppServiceQS-rg).

5. Válassza ki a kívánt Node.js verziót. LtS-verzió használata ajánlott.

6. Válassza ki a Windowst az operációs rendszerhez.

7. Válassza ki az alkalmazást kiszolgálni kívánt helyet. Például Nyugat-Európa.

8. Válassza az Új App Service-csomag létrehozása lehetőséget, adja meg a csomag nevét (például AppServiceQS-csomag), majd válassza az F1 Ingyenes lehetőséget a tarifacsomaghoz.

9. Az Alkalmazáshoz tartozó Application Insights-erőforrás kiválasztásához válassza az Egyelőre kihagyás lehetőséget, és várja meg, amíg az erőforrások létrejönnek az Azure-ban.

10. Az előugró ablakban "Mindig telepítse a 'myExpressApp' munkaterületet az <app-name>"-re válassza az Igen lehetőséget. Ezzel biztosítja, hogy mindaddig, amíg ugyanabban a munkaterületen van, a Visual Studio Code minden alkalommal ugyanarra az App Service-alkalmazásra telepedik.

    Bár a Visual Studio Code létrehozza az Azure-erőforrásokat, és üzembe helyezi a kódot, állapotértesítéseket jelenít meg.

    Megjegyzés

    Az üzembe helyezés befejeztével az Azure-alkalmazás még nem fut, mert a projektgyökér nem rendelkezik web.config-konfigurációval. Kövesse a többi lépést az automatikus létrehozáshoz. További információért lásd: Nincs engedélye a könyvtár vagy az oldal megtekintésére a Node.js konfigurálása részben.

11. A Visual Studio Code App Service Explorerében bontsa ki az új alkalmazás csomópontját, kattintson a jobb gombbal az Alkalmazásbeállítások elemre, és válassza az Új beállítás hozzáadása lehetőséget:

    

12. Adja meg SCM_DO_BUILD_DURING_DEPLOYMENT a beállítási kulcsot.

13. Adja meg true a beállítási értéket.

    Ez az alkalmazásbeállítás lehetővé teszi a build automatizálását üzembe helyezéskor, amely automatikusan észleli a start szkriptet, és létrehozza a web.configot vele.

14. Az App Service Explorerben válassza ismét a Webalkalmazás telepítése ikont, és erősítse meg a Telepítés gombra kattintva.

15. Várja meg, amíg az üzembe helyezés befejeződik, majd válassza a Webhely tallózása lehetőséget az értesítési előugró ablakban. A böngészőnek meg kell jelennie az Express alapértelmezett lapjának.

Problémába ütköztem

A terminálban győződjön meg arról, hogy a myExpressApp könyvtárban van, és helyezze üzembe a kódot a helyi mappában (myExpressApp) az az webapp up paranccsal:

Üzembe helyezés Linuxon

az webapp up --sku F1 --name <app-name>

Üzembe helyezés a Windowsban

az webapp up --sku F1 --name <app-name> --os-type Windows

• Ha a az parancs nem ismerhető fel, győződjön meg arról, hogy az Azure CLI telepítve van a kezdeti környezet beállítása című cikkben leírtak szerint.
• Cserélje le <app_name> egy olyan névre, amely egyedi az Azure-ban. (Az érvényes karakterek a következők a-z: , 0-9és -.) Jó példa a cég nevének és egy alkalmazásazonosítónak a kombinációjára.
• Az --sku F1 argumentum létrehozza a webalkalmazást az ingyenes tarifacsomagon, ami nem jár költséggel.
• Opcionálisan megadhatja azt az argumentumot --location <location-name> , amely <location_name> egy elérhető Azure-régiót tartalmaz. A parancs futtatásával lekérheti az Azure-fiók engedélyezett régióinak az account list-locations listáját.
• A parancs alapértelmezés szerint létrehoz egy Linux-alkalmazást Node.js. A Windows-alkalmazás létrehozásához használja az „--os-type” argumentumot.
• Ha a "Nem sikerült automatikusan észlelni az alkalmazás futtatókörnyezeti vermét" hibaüzenet jelenik meg, győződjön meg arról, hogy a parancsot a myExpressApp könyvtárban futtatja (lásd : Az az webapp up szolgáltatással kapcsolatos automatikus észlelési problémák elhárítása).)

A parancs végrehajtása eltarthat néhány percig. Futás közben üzeneteket biztosít az erőforráscsoport, az App Service-csomag és az alkalmazáserőforrás létrehozásáról, a naplózás konfigurálásáról és a Zip-telepítés elvégzéséről. Ezután egy üzenetet ad vissza, amely tartalmazza az alkalmazás URL-címét, amely az alkalmazás AZURE-beli URL-címe.

The webapp '<app-name>' doesn't exist
Creating Resource group '<group-name>' ...
Resource group creation complete
Creating AppServicePlan '<app-service-plan-name>' ...
Creating webapp '<app-name>' ...
Configuring default logging for the app, if not already enabled
Creating zip with contents of dir /home/cephas/myExpressApp ...
Getting scm site credentials for zip deployment
Starting zip deployment. This operation can take a while to complete ...
Deployment endpoint responded with status code 202
You can launch the app at <URL>
{
  "URL": "<URL>",
  "appserviceplan": "<app-service-plan-name>",
  "location": "centralus",
  "name": "<app-name>",
  "os": "<os-type>",
  "resourcegroup": "<group-name>",
  "runtime_version": "node|10.14",
  "runtime_version_detected": "0.0",
  "sku": "FREE",
  "src_path": "//home//cephas//myExpressApp"
}

Megjegyzés

Az az webapp up parancs a következő műveleteket hajtja végre:

• Hozzon létre egy alapértelmezett erőforráscsoportot.

• Hozzon létre egy alapértelmezett App Service-csomagot.

• Hozzon létre egy alkalmazást a megadott névvel.

• A Zip üzembe helyezi az összes fájlt az aktuális munkakönyvtárból, és engedélyezve van a buildautomatizálás.

• Gyorsítótárazza a paramétereket helyileg az .azure/config fájlban, hogy ne kelljen újból megadnia őket, amikor később az webapp up vagy más az webapp parancsokat a projektmappából telepít. A gyorsítótárazott értékek alapértelmezés szerint automatikusan használatosak.

Jelentkezzen be az Azure Portalra

Jelentkezzen be az Azure Portalra.

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

1. Node.js alkalmazás létrehozásához böngésszen a következő helyre: https://portal.azure.com/#create/Microsoft.WebSite.

2. Az Alapszintű beállítások lap Projekt részletei csoportjában győződjön meg arról, hogy a megfelelő előfizetés van kiválasztva, majd válassza az Új létrehozása lehetőséget egy erőforráscsoport létrehozásához. Írja be myResourceGroup nevet.

   

3. A Példány részletei csoportban írjon be egy globálisan egyedi nevet a webalkalmazásnak, és válassza a Kód lehetőséget. Válassza ki a Node 18 LTS-t a futtatókörnyezeti veremben, egy operációs rendszerben és egy régióban , ahonnan az alkalmazást ki szeretné szolgálni.

   

4. Az App Service-csomag alatt válassza a Új létrehozása lehetőséget, hogy új App Service-csomagot hozzon létre. Írja be a myAppServicePlan nevet. Ha ingyenes szintre szeretne váltani, válassza a Méret módosítása, a Fejlesztés/Tesztelés lap, az F1, majd az Oldal alján található Alkalmaz gombot.

   

5. Válassza a Lap alján található Véleményezés + létrehozás gombot.

   

6. Az ellenőrzési futtatások után válassza a lap alján lévő Létrehozás gombot.

7. Az üzembe helyezés befejezése után válassza az Erőforrás megnyitása lehetőséget.

   

FTPS-hitelesítő adatok lekérése

Azure-alkalmazás szolgáltatás kétféle hitelesítő adatot támogat az FTP/S üzembe helyezéséhez. Ezek a hitelesítő adatok nem azonosak az Azure-előfizetés hitelesítő adataival. Ebben a szakaszban lekérheti a FileZilla alkalmazáshatókörű hitelesítő adatait.

1. Az App Service alkalmazáslapján válassza az Üzembe helyezési központ lehetőséget a bal oldali menüben, majd válassza az FTPS hitelesítő adatok lapját .

   

2. Nyissa meg a FileZilla fájlt, és hozzon létre egy új webhelyet.

3. Az FTPS hitelesítő adatai lapon másolja az FTPS-végpontot, a felhasználónevet és a jelszót a FileZilla fájlba.

   

4. Válassza a Csatlakozás lehetőséget a FileZilla alkalmazásban.

Fájlok üzembe helyezése FTPS használatával

1. Másolja az összes fájlt és könyvtárat az Azure /site/wwwroot könyvtárába .

   

2. Keresse meg az alkalmazás URL-címét, és ellenőrizze, hogy az alkalmazás megfelelően működik-e.

Frissítések ismételt üzembe helyezése

Az alkalmazás módosításait a Visual Studio Code szerkesztésével, a fájlok mentésével, majd az Azure-alkalmazásba való ismételt üzembe helyezéssel helyezheti üzembe. Példa:

1. A mintaprojektben nyissa meg a views/index.ejs fájlt, és módosítsa a

   <p>Welcome to <%= title %></p>
   

   felhasználóként a(z)

   <p>Welcome to Azure</p>
   

2. Az App Service Explorerben válassza ismét a Webalkalmazás telepítése ikont, és erősítse meg a Telepítés gombra kattintva.

3. Várja meg, amíg az üzembe helyezés befejeződik, majd válassza a Webhely tallózása lehetőséget az értesítési előugró ablakban. Látnia kell, hogy az Welcome to Express üzenet Welcome to Azuremegváltozott.

2. Mentse a módosításokat, majd telepítse újra az alkalmazást az az webapp up paranccsal, és ne adjon meg argumentumokat a Linuxhoz. A --os-type Windows hozzáadása a Windows-hoz:

   az webapp up
   

   Ez a parancs az .azure/config fájlban helyileg gyorsítótárazott értékeket használ, például az alkalmazás nevét, az erőforráscsoportot és az App Service-csomagot.

3. Az üzembe helyezés befejezése után frissítse a weblapot. Látnia kell, hogy az Welcome to Express üzenet Welcome to Azuremegváltozott.

2. Mentse a módosításokat, majd telepítse újra az alkalmazást az FTP-ügyféllel.

3. Az üzembe helyezés befejezése után frissítse a weblapot. Látnia kell, hogy az Welcome to Express üzenet Welcome to Azuremegváltozott.

Naplófolyamok

Közvetlenül az Azure alkalmazásból streamelheti a naplókimenetet a Visual Studio Code kimeneti ablakában.

1. Az App Service Explorerben kattintson a jobb gombbal az alkalmazáscsomópontra, és válassza a Streamelési naplók indítása lehetőséget.

   

2. Ha az alkalmazás újraindítására van szükség, válassza az Igen lehetőséget. Az alkalmazás újraindítása után megnyílik a Visual Studio Code kimeneti ablaka a naplóstreamhez való kapcsolattal.

3. Néhány másodperc elteltével a kimeneti ablakban megjelenik egy üzenet, amely jelzi, hogy csatlakozik a naplóstreamelési szolgáltatáshoz. A böngészőben a lap frissítésével további kimeneti tevékenységeket hozhat létre.

    Connecting to log stream...
    2020-03-04T19:29:44  Welcome, you are now connected to log-streaming service. The default timeout is 2 hours.
    Change the timeout with the App Setting SCM_LOGSTREAM_TIMEOUT (in seconds).
    

Problémába ütköztem

Hozzáférhetsz az alkalmazáson belülről létrehozott konzolnaplókhoz és ahhoz a tárolóhoz, amelyben fut. A naplók tartalmazzák bármilyen kimenetet, amit a console.log() hívás generál.

Naplók streameléséhez futtassa az az webapp log tail parancsot:

az webapp log tail

A parancs a .azure/config fájlban gyorsítótárazott erőforráscsoport-nevet használja.

A --logs paramétert is megadhatja az az webapp up paranccsal, hogy az üzembe helyezéskor automatikusan megnyíljon a naplóstream.

Frissítse az alkalmazást a böngészőben a konzolnaplók létrehozásához, amelyek tartalmazzák az alkalmazásnak küldött HTTP-kéréseket leíró üzeneteket. Ha nem jelenik meg azonnal kimenet, próbálkozzon újra 30 másodperc múlva.

Ha bármikor le szeretné állítani a naplóstreamelést, válassza a Ctrl C billentyűkombinációt+a terminálban.

Hozzáférhetsz az alkalmazáson belülről létrehozott konzolnaplókhoz és ahhoz a tárolóhoz, amelyben fut. A naplókimenetet (hívásokat console.log()) közvetlenül az Azure Portalon streamelheti az Node.js alkalmazásból.

1. Az alkalmazás ugyanazon App Service-lapján a bal oldali menüben görgessen a Figyelés szakaszhoz, és válassza a Naplóstream lehetőséget.

   

2. Néhány másodperc elteltével a kimeneti ablakban megjelenik egy üzenet, amely jelzi, hogy csatlakozik a naplóstreamelési szolgáltatáshoz. A böngészőben a lap frissítésével további kimeneti tevékenységeket hozhat létre.

    Connecting...
    2021-10-26T21:04:14  Welcome, you are now connected to log-streaming service.
    Starting Log Tail -n 10 of existing logs ----
    /appsvctmp/volatile/logs/runtime/81b1b83b27ea1c3d598a1cdec28c71c4074ce66c735d0be57f15a8d07cb3178e.log
    2021-10-26T21:04:08.614384810Z: [INFO]
    2021-10-26T21:04:08.614393710Z: [INFO]  # Enter the source directory to make sure the script runs where the user expects
    2021-10-26T21:04:08.614399010Z: [INFO]  cd "/home/site/wwwroot"
    2021-10-26T21:04:08.614403210Z: [INFO]
    2021-10-26T21:04:08.614407110Z: [INFO]  export NODE_PATH=/usr/local/lib/node_modules:$NODE_PATH
    2021-10-26T21:04:08.614411210Z: [INFO]  if [ -z "$PORT" ]; then
    2021-10-26T21:04:08.614415310Z: [INFO]          export PORT=8080
    2021-10-26T21:04:08.614419610Z: [INFO]  fi
    2021-10-26T21:04:08.614423411Z: [INFO]
    2021-10-26T21:04:08.614427211Z: [INFO]  node /opt/startup/default-static-site.js
    Ending Log Tail of existing logs ---
    

Az erőforrások tisztítása

Az előző lépésekben Azure-erőforrásokat hozott létre egy erőforráscsoportban. A rövid útmutató lépései az összes erőforrást ebbe az erőforráscsoportba helyezik. A törléshez csak el kell távolítania az erőforráscsoportot.

1. A Visual Studio Azure-bővítményében bontsa ki az Erőforráscsoportok kezelőt.

2. Bontsa ki az előfizetést, kattintson a jobb gombbal a korábban létrehozott erőforráscsoportra, és válassza a Törlés lehetőséget.

   

3. Amikor a rendszer kéri, erősítse meg a törlést a törölni kívánt erőforráscsoport nevének megadásával. A megerősítést követően az erőforráscsoport törlődik, és megjelenik egy értesítés , ha elkészült.

Problémába ütköztem

Az előző lépésekben Azure-erőforrásokat hozott létre egy erőforráscsoportban. A neve például "appsvc_rg_Linux_CentralUS" lehet az erőforráscsoportnak, a helyétől függően.

Ha a jövőben nem lesz szüksége ezekre az erőforrásokra, törölje az erőforráscsoportot az alábbi parancs futtatásával:

az group delete --no-wait

A parancs a .azure/config fájlban gyorsítótárazott erőforráscsoport-nevet használja.

Az --no-wait argumentum lehetővé teszi a parancs visszatérését a művelet befejezése előtt.

Ha már nincs rájuk szükség, törölheti az erőforráscsoportot, az App Service-t és az összes kapcsolódó erőforrást.

1. Az App Service áttekintési lapján válassza ki az Azure-erőforrások létrehozása lépésben létrehozott erőforráscsoportot.

   

2. Az erőforráscsoport lapján válassza az Erőforráscsoport törlése lehetőséget. Az erőforrások törlésének befejezéséhez erősítse meg az erőforráscsoport nevét.

   

Következő lépések

Gratulálunk, sikeresen elvégezte ezt a rövid útmutatót!

Node.js + MongoDB-webalkalmazás üzembe helyezése az Azure-ban

Node.js-alkalmazás konfigurálása

  Védje meg Azure App Service alkalmazását egy egyéni tartománnyal és egy felügyelt tanúsítvánnyal

Tekintse meg a többi Azure-bővítményt.

• Azure Cosmos DB
• Azure Functions
• Docker-eszközök
• Azure CLI-eszközök
• Azure Resource Manager-eszközök

Vagy lekérheti őket az Azure-hoz készült Node Pack bővítménycsomag telepítésével.