J'essaie de déployer une application angulaire 9 de base sur les services d'application Azure.

Ce que j'ai fait jusqu'ici.

  • J'ai créé une instance d'application Web entrez la description de l'image ici

enter image description here

  • Ensuite, je suis allé au centre de déploiement comme le site Web de démarrage le suggérait et j'ai connecté mon référentiel github via le centre de déploiement

enter image description here

  • Il a ajouté ce fichier yml de flux de travail à mon référentiel.J'ai commenté le test d'exécution npm car il s'agit de l'application par défaut pour angular, pas besoin de perdre du temps à exécuter l'application
# Docs for the Azure Web Apps Deploy action: https://github.com/Azure/webapps-deploy
# More GitHub Actions for Azure: https://github.com/Azure/actions

name: Build and deploy Node.js app to Azure Web App - someapp

on:
  push:
    branches:
      - master

jobs:
  build-and-deploy:
    runs-on: ubuntu-latest

    steps:
    - uses: actions/checkout@master

    - name: Set up Node.js version
      uses: actions/setup-node@v1
      with:
        node-version: '12.x'

    - name: npm install, build, and test
      run: |
        npm install
        npm run build -prod --if-present
        # npm run test --if-present
    - name: 'Deploy to Azure Web App'
      uses: azure/webapps-deploy@v1
      with:
        app-name: 'someapp'
        slot-name: 'production'
        publish-profile: ${{ secrets.AzureAppService_PublishProfile}}
        package: .
  • après avoir exécuté le pipeline, il donne une erreur d'application avec un code d'erreur 503 lors de la récupération initiale.

J'ai essayé ssh sur le serveur pour examiner la structure des fichiers, mais je ne peux pas me connecter ou si je me connecte, cela me déclenche après quelques secondes.

Est-ce que quelqu'un sait si j'ai manqué une étape nécessaire pour déployer sur Azure ou sur la structure de fichiers que je dois faire? J'ai essayé de rechercher des didacticiels ou des questions plus à jour, mais la plupart semblent assez datés.

0
Codyj110 17 avril 2020 à 06:16

2 réponses

Meilleure réponse

Les services d'application ne sont pas le bon service pour les sites Web statiques. Je suis tombé sur ces documents qui m'aident à configurer le site Web assez rapidement. comme Sajeetharan l'a suggéré, vous devrez utiliser un pipeline devops pour obtenir le même effet que le centre de développement des services d'application pour le déploiement.

  1. Créez un "compte de stockage", accédez au site Web de STatic et activez le site Web statique.

  2. Créez un projet dans Azure Devops en cliquant sur les pipelines et créez-en un nouveau. Sur le setp de configuration, sélectionnez Node.js avec Angular. J'ai lié le mien à un référentiel github. Cela ajoutera un yml de pipeline Azure à la branche de déploiement que vous avez sélectionnée.

Vous devrez produire un artefact, vous devrez donc ajouter une tâche supplémentaire à votre yml. par exemple.

- task: PublishBuildArtifacts@1
  inputs:
    pathToPublish: dist/Nebulous
    artifactName: drop

Votre yml complet devrait ressembler à ceci

trigger:
- master

pool:
  vmImage: 'ubuntu-latest'

steps:
- task: NodeTool@0
  inputs:
    versionSpec: '10.x'
  displayName: 'Install Node.js'

- script: |
    npm install -g @angular/cli
    npm install
    ng build --prod
  displayName: 'npm install and build'

- task: PublishBuildArtifacts@1
  inputs:
    pathToPublish: dist/Nebulous
    artifactName: drop

lien utile sur l'ajout d'artefact

Après cela, nous sommes prêts à transférer votre artefact vers votre compte de stockage

Accéder aux versions d'Azure Devops

  1. Sous la carte des artefacts, cliquez sur Ajouter et ajoutez le pipeline que nous venons de créer. Si vous voulez des déploiements continus, cliquez sur le boulon d'éclairage dans le coin et activez-le.

  2. Cliquez maintenant sur le lien sous l'étape 1 qui dit "1 travail, 0 tâche" puis cliquez sur Le plus sur la ligne de travail de l'agent pour ajouter une nouvelle tâche. Recherchez la copie du fichier AzureBlob.

Source: sélectionnez vos pipelines que vous avez créés et accédez à votre dossier d'artefacts que vous avez créé lors des étapes précédentes

Le type de destination est Azure Blob

Sélectionnez le nom du compte de stockage que vous avez créé précédemment

Nom du conteneur = $ web

Vous pouvez maintenant démarrer ou pousser manuellement dans votre branche et elle se déploiera sur Azure.

https://docs.microsoft.com/en-us/azure/javascript/tutorial-vscode-static-website-node-01?tabs=bash

1
Codyj110 18 avril 2020 à 18:42

Vous pouvez le faire de deux manières, l'une consiste à utiliser les actions Github, où vous pouvez créer votre propre pipeline à l'aide d'actions. Comme cela semble être une application angulaire, suivez mes blog sur le même

La deuxième méthode consiste à utiliser le projet Azure Devops, à créer le projet et à ajouter votre propre code personnalisé.

En ce qui concerne l'erreur réelle: je doute que vos fichiers soient déployés sur le service d'applications, vous pouvez utiliser Kudu pour vérifier si les fichiers corrects sont là.

0
Sajeetharan 17 avril 2020 à 03:46