Share via


déploiement web ASP.NET à l’aide de Visual Studio : déploiement d’une mise à jour de base de données

par Tom Dykstra

Télécharger le projet de démarrage

Cette série de tutoriels vous montre comment déployer (publier) une application web ASP.NET sur Azure App Service Web Apps ou sur un fournisseur d’hébergement tiers à l’aide de Visual Studio 2012 ou Visual Studio 2010. Pour plus d’informations sur la série, consultez le premier tutoriel de la série.

Vue d’ensemble

Dans ce tutoriel, vous allez apporter une modification de base de données et des modifications de code associées, tester les modifications dans Visual Studio, puis déployer la mise à jour dans les environnements de test, de préproduction et de production.

Le didacticiel montre d’abord comment mettre à jour une base de données gérée par Migrations Code First, puis comment mettre à jour une base de données à l’aide du fournisseur dbDacFx.

Rappel : si vous recevez un message d’erreur ou si un élément ne fonctionne pas pendant le tutoriel, veillez à case activée la page de résolution des problèmes.

Déployer une mise à jour de base de données à l’aide de Migrations Code First

Dans cette section, vous ajoutez une colonne de date de naissance à la Person classe de base pour les Student entités et Instructor . Ensuite, vous mettez à jour la page qui affiche les données de l’instructeur afin qu’elle affiche la nouvelle colonne. Enfin, vous déployez les modifications pour le test, la préproduction et la production.

Ajouter une colonne à une table dans la base de données d’application

  1. Dans le projet ContosoUniversity.DAL , ouvrez Person.cs et ajoutez la propriété suivante à la fin de la Person classe (deux accolades fermants doivent suivre) :

    [DisplayFormat(DataFormatString = "{0:d}", ApplyFormatInEditMode = true)]
    [Display(Name = "Birth Date")]
    public DateTime? BirthDate { get; set; }
    

    Ensuite, mettez à jour la Seed méthode afin qu’elle fournisse une valeur pour la nouvelle colonne. Ouvrez Migrations\Configuration.cs et remplacez le bloc de code qui commence par var instructors = new List<Instructor> le bloc de code suivant qui inclut les informations de date de naissance :

    var instructors = new List<Instructor>
    {
        new Instructor { FirstMidName = "Kim",     LastName = "Abercrombie", HireDate = DateTime.Parse("1995-03-11"), BirthDate = DateTime.Parse("1918-08-12"), OfficeAssignment = new OfficeAssignment { Location = "Smith 17" } },
        new Instructor { FirstMidName = "Fadi",    LastName = "Fakhouri",    HireDate = DateTime.Parse("2002-07-06"), BirthDate = DateTime.Parse("1960-03-15"), OfficeAssignment = new OfficeAssignment { Location = "Gowan 27" } },
        new Instructor { FirstMidName = "Roger",   LastName = "Harui",       HireDate = DateTime.Parse("1998-07-01"), BirthDate = DateTime.Parse("1970-01-11"), OfficeAssignment = new OfficeAssignment { Location = "Thompson 304" } },
        new Instructor { FirstMidName = "Candace", LastName = "Kapoor",      HireDate = DateTime.Parse("2001-01-15"), BirthDate = DateTime.Parse("1975-04-11") },
        new Instructor { FirstMidName = "Roger",   LastName = "Zheng",       HireDate = DateTime.Parse("2004-02-12"), BirthDate = DateTime.Parse("1957-10-12") }
    };
    
  2. Générez la solution, puis ouvrez la fenêtre Console du Gestionnaire de package. Assurez-vous que ContosoUniversity.DAL est toujours sélectionné comme projet par défaut.

  3. Dans la fenêtre Console du Gestionnaire de package, sélectionnez ContosoUniversity.DAL comme projet Par défaut, puis entrez la commande suivante :

    add-migration AddBirthDate
    

    Une fois cette commande terminée, Visual Studio ouvre le fichier de classe qui définit la nouvelle DbMigration classe, et dans la Up méthode, vous pouvez voir le code qui crée la nouvelle colonne. La Up méthode crée la colonne lorsque vous implémentez la modification, et la Down méthode supprime la colonne lorsque vous annulez la modification.

    AddBirthDate_migration_code

  4. Générez la solution, puis entrez la commande suivante dans la fenêtre Console du Gestionnaire de package (vérifiez que le projet ContosoUniversity.DAL est toujours sélectionné) :

    update-database
    

    Entity Framework exécute la Up méthode, puis exécute la Seed méthode .

Afficher la nouvelle colonne dans la page Instructeurs

  1. Dans le projet ContosoUniversity, ouvrez Instructors.aspx et ajoutez un nouveau champ de modèle pour afficher la date de naissance. Ajoutez-le entre ceux pour la date d’embauche et l’affectation de bureau :

    <asp:TemplateField HeaderText="Hire Date" SortExpression="HireDate">
        <ItemTemplate>
            <asp:Label ID="InstructorHireDateLabel" runat="server" Text='<%# Eval("HireDate", "{0:d}") %>'></asp:Label>
        </ItemTemplate>
        <EditItemTemplate>
            <asp:TextBox ID="InstructorHireDateTextBox" runat="server" Text='<%# Bind("HireDate", "{0:d}") %>' Width="7em"></asp:TextBox>
        </EditItemTemplate>
    </asp:TemplateField>
    <asp:TemplateField HeaderText="Birth Date" SortExpression="BirthDate">
        <ItemTemplate>
            <asp:Label ID="InstructorBirthDateLabel" runat="server" Text='<%# Eval("BirthDate", "{0:d}") %>'></asp:Label>
        </ItemTemplate>
        <EditItemTemplate>
            <asp:TextBox ID="InstructorBirthDateTextBox" runat="server" Text='<%# Bind("BirthDate", "{0:d}") %>'
                Width="7em"></asp:TextBox>
        </EditItemTemplate>
    </asp:TemplateField>
    <asp:TemplateField HeaderText="Office Assignment" SortExpression="OfficeAssignment.Location">
        <ItemTemplate>
            <asp:Label ID="InstructorOfficeLabel" runat="server" Text='<%# Eval("OfficeAssignment.Location") %>'></asp:Label>
        </ItemTemplate>
        <EditItemTemplate>
            <asp:TextBox ID="InstructorOfficeTextBox" runat="server"
                Text='<%# Eval("OfficeAssignment.Location") %>' Width="7em"
                OnInit="InstructorOfficeTextBox_Init"></asp:TextBox>
        </EditItemTemplate>
    </asp:TemplateField>
    

    (Si la mise en retrait du code est désynchronisée, vous pouvez appuyer sur CTRL-K, puis ctrl-D pour reformater automatiquement le fichier.)

  2. Exécutez l’application, puis cliquez sur le lien Instructeurs .

    Lorsque la page se charge, vous voyez qu’elle a le nouveau champ date de naissance.

    Capture d’écran de la page Instructeurs montrant leur nom, leur date d’embauche, leur date de naissance et leur affectation de bureau.

  3. Fermez le navigateur.

Déployer la mise à jour de la base de données

  1. Dans Explorateur de solutions sélectionnez le projet ContosoUniversity.

  2. Dans la barre d’outils Web One Click Publier , cliquez sur le profil de publication de test , puis sur Publier le web. (Si la barre d’outils est désactivée, sélectionnez le projet ContosoUniversity dans Explorateur de solutions.)

    Visual Studio déploie l’application mise à jour et le navigateur s’ouvre sur la page d’accueil.

  3. Exécutez la page Instructeurs pour vérifier que la mise à jour a été correctement déployée.

    Lorsque l’application tente d’accéder à la base de données pour cette page, Code First met à jour le schéma de base de données et exécute la Seed méthode . Lorsque la page s’affiche, vous voyez la colonne Date de naissance attendue avec des dates.

  4. Dans la barre d’outils Web Un clic Publier , cliquez sur le profil de publication intermédiaire , puis sur Publier le web.

  5. Exécutez la page Instructeurs en préproduction pour vérifier que la mise à jour a été correctement déployée.

  6. Dans la barre d’outils Web One Click Publier , cliquez sur le profil de publication de production , puis sur Publier le web.

  7. Exécutez la page Instructeurs en production pour vérifier que la mise à jour a été correctement déployée.

    Pour une mise à jour réelle de l’application de production qui inclut une modification de base de données, vous devez généralement mettre l’application hors connexion pendant le déploiement en utilisant app_offline.htm, comme vous l’avez vu dans le tutoriel précédent.

Déployer une mise à jour de base de données à l’aide du fournisseur dbDacFx

Dans cette section, vous ajoutez une colonne Commentaires à la table Utilisateur de la base de données d’appartenance et créez une page qui vous permet d’afficher et de modifier des commentaires pour chaque utilisateur. Ensuite, vous déployez les modifications pour le test, la préproduction et la production.

Ajouter une colonne à une table dans la base de données d’appartenances

  1. Dans Visual Studio, ouvrez SQL Server Explorateur d'objets.

  2. Développez (localdb)\v11.0, bases de données, aspnet-ContosoUniversity (et non aspnet-ContosoUniversity-Prod), puis tables.

    Si vous ne voyez pas (localdb)\v11.0 sous le nœud SQL Server, cliquez avec le bouton droit sur le nœud SQL Server et cliquez sur Ajouter SQL Server. Dans la boîte de dialogue Se connecter au serveur , entrez (localdb)\v11.0 comme nom du serveur, puis cliquez sur Se connecter.

    Si vous ne voyez pas aspnet-ContosoUniversity, exécutez le projet et connectez-vous à l’aide des informations d’identification d’administrateur (le mot de passe est devpwd), puis actualisez la fenêtre SQL Server Explorateur d'objets.

  3. Cliquez avec le bouton droit sur la table Utilisateurs, puis cliquez sur Afficher Designer.

    Designer de vue SSOX

  4. Dans le concepteur, ajoutez une colonne Commentaires et rendez-la nvarchar(128) et nullable, puis cliquez sur Mettre à jour.

    Ajout d’une colonne Commentaires

  5. Dans la zone Aperçu de l’Mises à jour de base de données, cliquez sur Mettre à jour la base de données.

    Mises à jour de base de données en préversion

Créer une page pour afficher et modifier la nouvelle colonne

  1. Dans Explorateur de solutions, cliquez avec le bouton droit sur le dossier Compte dans le projet ContosoUniversity, cliquez sur Ajouter, puis sur Nouvel élément.

  2. Créez un formulaire web à l’aide de la page maître et nommez-le UserInfo.aspx. Acceptez le fichier Site.Master par défaut comme page master.

  3. Copiez le balisage suivant dans l’élément MainContentContent (le dernier des 3 Content éléments) :

    <h2>User Information</h2>
        <asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$ ConnectionStrings:DefaultConnection %>" 
            SelectCommand="SELECT UserId, UserName, Comments FROM [Users]" 
            UpdateCommand="UPDATE [Users] SET [UserName] = @UserName, [Comments] = @Comments WHERE [UserId] = @UserId">
            <DeleteParameters>
                <asp:Parameter Name="UserId" Type="Object" />
            </DeleteParameters>
            <UpdateParameters>
                <asp:Parameter Name="UserId" Type="Object" />
                <asp:Parameter Name="UserName" Type="String" />
                <asp:Parameter Name="Comments" Type="String" />
            </UpdateParameters>
        </asp:SqlDataSource>
    
        <asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" DataKeyNames="UserId" DataSourceID="SqlDataSource1">
            <Columns>
                <asp:CommandField ShowEditButton="True" />
                <asp:BoundField DataField="UserName" HeaderText="UserName" SortExpression="UserName" />
                <asp:BoundField DataField="Comments" HeaderText="Comments" SortExpression="Comments" />
            </Columns>
        </asp:GridView>
    
  4. Cliquez avec le bouton droit sur la page UserInfo.aspx , puis cliquez sur Afficher dans le navigateur.

  5. Connectez-vous avec vos informations d’identification d’utilisateur administrateur (mot de passe est devpwd) et ajoutez des commentaires à un utilisateur pour vérifier que la page fonctionne correctement.

    Capture d’écran montrant la page UserInfo affichant le test UserName et le compte de test de Comment Tom.

  6. Fermez le navigateur.

Déployer la mise à jour de la base de données

Pour déployer à l’aide du fournisseur dbDacFx, il vous suffit de sélectionner l’option Mettre à jour la base de données dans le profil de publication. Toutefois, pour le déploiement initial, lorsque vous avez utilisé cette option, vous avez également configuré des scripts SQL supplémentaires à exécuter : ceux-ci se trouvent toujours dans le profil et vous devrez les empêcher de s’exécuter à nouveau.

  1. Ouvrez l’Assistant Publier le web en cliquant avec le bouton droit sur le projet ContosoUniversity et en cliquant sur Publier.

  2. Sélectionnez le profil de test .

  3. Cliquez sur l'onglet Paramètres .

  4. Sous DefaultConnection, sélectionnez Mettre à jour la base de données.

  5. Désactivez les scripts supplémentaires que vous avez configurés pour s’exécuter pour le déploiement initial :

    1. Cliquez sur Configurer les mises à jour de base de données.
    2. Dans la boîte de dialogue Configurer l’Mises à jour de base de données, désactivez les zones de case activée en regard de Grant.sql et aspnet-data-dev.sql.
    3. Cliquez sur Fermer.
  6. Cliquez sur l’onglet Aperçu .

  7. Sous Bases de données et à droite de DefaultConnection, cliquez sur le lien Aperçu de la base de données .

    Préversion de base de données

    La fenêtre d’aperçu montre le script qui sera exécuté dans la base de données de destination pour que ce schéma de base de données corresponde au schéma de la base de données source. Le script inclut une commande ALTER TABLE qui ajoute la nouvelle colonne.

  8. Fermez la boîte de dialogue Aperçu de la base de données , puis cliquez sur Publier.

    Visual Studio déploie l’application mise à jour et le navigateur s’ouvre sur la page d’accueil.

  9. Exécutez la page UserInfo (ajouter Account/UserInfo.aspx à l’URL de la page d’accueil) pour vérifier que la mise à jour a bien été déployée. Vous devez vous connecter en entrant admin et devpwd.

    Les données dans les tables ne sont pas déployées par défaut et vous n’avez pas configuré de script de déploiement de données pour l’exécuter. Vous ne trouverez donc pas le commentaire que vous avez ajouté dans le développement. Vous pouvez ajouter un nouveau commentaire maintenant en préproduction pour vérifier que la modification a été déployée dans la base de données et que la page fonctionne correctement.

  10. Suivez la même procédure pour déployer en préproduction et en production.

    N’oubliez pas de désactiver les scripts supplémentaires. La seule différence par rapport au profil de test est que vous ne désactiverez qu’un seul script dans les profils de préproduction et de production, car ils ont été configurés pour exécuter uniquement aspnet-prod-data.sql.

    Les informations d’identification pour la préproduction et la production sont admin et prodpwd.

    Pour une mise à jour réelle de l’application de production qui inclut une modification de base de données, vous devez généralement mettre l’application hors connexion pendant le déploiement en chargeant app_offline.htm avant de la publier et de la supprimer par la suite, comme vous l’avez vu dans le tutoriel précédent.

Résumé

Vous avez maintenant déployé une mise à jour d’application incluant une modification de base de données à l’aide de Migrations Code First et du fournisseur dbDacFx.

Capture d’écran montrant la page Instructeurs affichant leur nom, leur date d’embauche, leur date de naissance et leur affectation de bureau.

Capture d’écran de la page UserInfo montrant le test UserName et le compte de test de Comment Tom.

Le tutoriel suivant vous montre comment exécuter des déploiements à l’aide de la ligne de commande.