ASP.NET Web Dağıtımı: Visual Studio Kullanarak Kod Güncellemesi Yayınlama

tarafından Tom Dykstra

Başlangıç Projesini İndir

Bu öğretici serisi, Visual Studio 2012 veya Visual Studio 2010 kullanarak ASP.NET web uygulamasını Azure Uygulaması Service Web Apps'e veya üçüncü taraf barındırma sağlayıcısına dağıtmayı (yayımlamayı) gösterir. Seri hakkında bilgi için serinin ilk dersine bakın.

Genel bakış

İlk dağıtımdan sonra, web sitenizi koruma ve geliştirme çalışmalarınız devam eder ve çok geçmeden bir güncelleştirme dağıtmak istersiniz. Bu öğretici, uygulama kodunuz için bir güncelleştirme dağıtma işleminde size yol gösterir. Bu öğreticide uyguladığınız ve dağıttığınız güncelleştirme bir veritabanı değişikliği içermez; bir sonraki öğreticide veritabanı değişikliğini dağıtmayla ilgili farklı olan şeyleri göreceksiniz.

Hatırlatma: Bir hata iletisi alırsanız veya öğreticiyi tamamlarken bir şeyin çalışmadığını fark ederseniz, sorun giderme sayfasını kontrol edin.

Kod değişikliği yapma

Uygulamanıza yönelik basit bir güncelleştirme örneği olarak, Eğitmenler sayfasına seçili eğitmen tarafından öğretilen derslerin listesini ekleyeceksiniz.

Eğitmenler sayfasını çalıştırırsanız, kılavuzda "Seç" bağlantıları olduğunu fark edersiniz, ancak satır arka planını griye çevirmek dışında başka bir işlevleri yoktur.

Seçilen eğitmenler sayfası

Şimdi Seç bağlantısına tıklandığında çalışan ve seçilen eğitmen tarafından öğretilen derslerin listesini görüntüleyen bir kod ekleyeceksiniz.

  1. Instructors.aspx dosyasında, ErrorMessageLabelLabel kontrolünden hemen sonra aşağıdaki işaretlemeyi ekleyin:

    <h3>Courses Taught</h3>
    <asp:ObjectDataSource ID="CoursesObjectDataSource" runat="server" TypeName="ContosoUniversity.BLL.SchoolBL"
        DataObjectTypeName="ContosoUniversity.DAL.Course" SelectMethod="GetCoursesByInstructor">
        <SelectParameters>
            <asp:ControlParameter ControlID="InstructorsGridView" Name="PersonID" PropertyName="SelectedDataKey.Value"
                Type="Int32" />
        </SelectParameters>
    </asp:ObjectDataSource>
    <asp:GridView ID="CoursesGridView" runat="server" DataSourceID="CoursesObjectDataSource"
        AllowSorting="True" AutoGenerateColumns="False" SelectedRowStyle-BackColor="LightGray"
        DataKeyNames="CourseID">
        <EmptyDataTemplate>
            <p>No courses found.</p>
        </EmptyDataTemplate>
        <Columns>
            <asp:BoundField DataField="CourseID" HeaderText="ID" ReadOnly="True" SortExpression="CourseID" />
            <asp:BoundField DataField="Title" HeaderText="Title" SortExpression="Title" />
            <asp:TemplateField HeaderText="Department" SortExpression="DepartmentID">
                <ItemTemplate>
                    <asp:Label ID="GridViewDepartmentLabel" runat="server" Text='<%# Eval("Department.Name") %>'></asp:Label>
                </ItemTemplate>
            </asp:TemplateField>
        </Columns>
    </asp:GridView>
    
  2. Sayfayı çalıştırın ve bir eğitmen seçin. Bu eğitmen tarafından öğretilen derslerin listesini görürsünüz.

    Tek bir Eğitmenin vurgulandığı ve ders verdikleri derslerin görüntülendiği Eğitmenler sayfasını gösteren ekran görüntüsü.

  3. Tarayıcıyı kapatın.

Kod güncelleştirmesini test ortamına dağıtma

Yayımlama profillerinizi test, hazırlama ve üretim için dağıtmak üzere kullanabilmeniz için önce veritabanı yayımlama seçeneklerini değiştirmeniz gerekir. Artık üyelik veritabanı için verme ve veri dağıtım betiklerini çalıştırmanız gerekmez.

  1. ContosoUniversity projesine sağ tıklayıp Yayımla'ya tıklayarak Web'i Yayımla sihirbazını açın.
  2. Profil açılır listesinden Test profiline tıklayın.
  3. Ayarlar sekmesine tıklayın.
  4. Veritabanları bölümündeki DefaultConnection altında Veritabanını güncelleştir onay kutusunu temizleyin.
  5. Profil sekmesine tıklayın ve ardından Profil açılır listesinden Staging profilini seçin.
  6. Test profilinde yapılan değişiklikleri kaydetmek isteyip istemediğiniz sorulduğunda Evet'e tıklayın.
  7. Hazırlama profilinde de aynı değişikliği yapın.
  8. Aynı değişikliği Üretim profilinde yapmak için işlemi yineleyin.
  9. Web Yayımlama Sihirbazı kapatın.

Test ortamına dağıtmak artık tek tıklamayla yayımlamayı yeniden çalıştırmak için basit bir işlemdir. Bu işlemi daha hızlı hale getirmek için Web One Click Yayımla araç çubuğunu kullanabilirsiniz.

  1. Görünüm menüsünde Araç Çubukları'nı ve ardından Web Tek Tıklamayla Yayımla'yı seçin.

    Bir_Tıkla_Yayımla_Araç_Çubuğunu_Seçme

  2. Çözüm Gezgini contosoUniversity projesini seçin.

  3. Web One Click Yayımla araç çubuğuna tıklayın, Test yayımlama profilini seçin ve ardından Web'i Yayımla'ya tıklayın (okların sola ve sağa işaret eden simgesi).

    Web_One_Click_Publish_toolbar

  4. Visual Studio güncelleştirilmiş uygulamayı dağıtır ve tarayıcı otomatik olarak giriş sayfasına açılır.

  5. Eğitmenler sayfasını çalıştırın ve güncelleştirmenin başarıyla dağıtıldığını doğrulamak için bir eğitmen seçin.

Normalde regresyon testi de yaparsınız (yani, yeni değişikliğin mevcut işlevleri bozmadığından emin olmak için sitenin geri kalanını test edin). Ancak bu eğitimde bu adımı atlayıp güncelleştirmeyi hazırlama ve canlı ortama dağıtmaya devam edeceksiniz.

Yeniden dağıttığınızda, Web Dağıtımı hangi dosyaların değiştirildiğini otomatik olarak belirler ve değiştirilen dosyaları yalnızca sunucuya kopyalar. Varsayılan olarak, Web Dağıtımı hangilerinin değiştiğini belirlemek için dosyalarda son değiştirilen tarihleri kullanır. Bazı kaynak denetim sistemleri, dosya içeriğini değiştirmeseniz bile dosya tarihlerini değiştirir. Bu durumda, hangi dosyaların değiştiğini belirlemek için Web Dağıtımı'nı dosya sağlama değerlerini kullanacak şekilde yapılandırmak isteyebilirsiniz. Daha fazla bilgi için ASP.NET Dağıtım SSS bölümünde "Dosyalarımın tamamı değişiklik yapmadığım halde neden yeniden dağıtılıyor?" başlığına bakın.

Dağıtım sırasında uygulamayı çevrimdışına alma

Şimdi dağıttığınız değişiklik, tek bir sayfada yapılan basit bir değişikliktir. Ancak bazen daha büyük değişiklikler dağıtırsınız veya hem kod hem de veritabanı değişikliklerini dağıtırsınız ve kullanıcı dağıtım tamamlanmadan önce bir sayfa isterse site yanlış davranabilir. Dağıtım devam ederken kullanıcıların siteye erişmesini önlemek için bir app_offline.htm dosyası kullanabilirsiniz. uygulamanızın kök klasörüne app_offline.htm adlı bir dosya yerleştirdiğinizde IIS, uygulamanızı çalıştırmak yerine bu dosyayı otomatik olarak görüntüler. Bu nedenle dağıtım sırasında erişimi önlemek için app_offline.htm kök klasöre koyar, dağıtım işlemini çalıştırır ve başarılı dağıtımdan sonra app_offline.htm kaldırırsınız.

Web Dağıtımı'nı, dağıtıma başladığında sunucuya otomatik olarak bir varsayılan app_offline.htm dosyası koyacak ve tamamlandığında kaldıracak şekilde yapılandırabilirsiniz. Bunu yapmak için tek yapmanız gereken yayımlama profili (.pubxml) dosyanıza aşağıdaki XML öğesini eklemektir:

<EnableMSDeployAppOffline>true</EnableMSDeployAppOffline>

Bu öğreticide özel bir app_offline.htm dosyası oluşturma ve kullanma hakkında bilgi edineceksiniz.

Hazırlama sitesinde app_offline.htm kullanmak gerekli değildir, çünkü hazırlama sitesine erişen kullanıcılarınız yoktur. Staging ortamını, üretimde dağıtacağınız gibi her şeyi test etmek için kullanmak iyi bir uygulamadır.

app_offline.htm oluştur

  1. Çözüm Gezgini'da çözüme sağ tıklayın, Ekle'ye ve ardından Yeni Öğe'ye tıklayın.

  2. app_offline.htm adlı bir HTML Sayfası oluşturun (Visual Studio'nın varsayılan olarak oluşturduğu .html uzantısında son "l"yi silin).

  3. Şablon işaretlemesini aşağıdaki işaretlemeyle değiştirin:

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <title>Contoso University - Under Construction</title>
    </head>
    <body>
      <h1>Contoso University</h1>
      <h2>Under Construction</h2>
      <p>The Contoso University site is temporarily unavailable while we upgrade it. Please try again later.</p>
    </body>
    </html>
    
  4. Dosyayı kaydedip kapatın

app_offline.htm web sitesinin kök klasörüne kopyalama

Dosyaları web sitesine kopyalamak için herhangi bir FTP aracını kullanabilirsiniz. FileZilla popüler bir FTP aracıdır ve ekran görüntülerinde gösterilir.

FTP aracı kullanmak için üç şey gerekir: FTP URL'si, kullanıcı adı ve parola.

URL, Web sitesinin Azure Yönetim Portalı'ndaki pano sayfasında gösterilir ve FTP kullanıcı adı ve parolası daha önce indirdiğiniz .publishsettings dosyasında bulunabilir. Aşağıdaki adımlarda bu değerlerin nasıl alınıyor olduğu gösterilmektedir.

  1. Azure Yönetim Portalı'nda Web Siteleri sekmesine ve ardından hazırlama web sitesine tıklayın.

  2. Pano sayfasında, Hızlı Bakış bölümünde FTP ana bilgisayar adını bulmak için ekranı aşağı kaydırın.

    FTP ana bilgisayar adı

  3. Hazırlama .publishsettings dosyasını Not Defteri'nde veya başka bir metin düzenleyicisinde açın.

  4. FTP profili için publishProfile öğesini bulun.

  5. userName ve userPWD değerlerini kopyalayın.

    FTP kimlik bilgileri

  6. FTP aracınızı açın ve FTP URL'sinde oturum açın.

  7. app_offline.htm çözüm klasöründen hazırlama sitesindeki /site/wwwroot klasörüne kopyalayın.

    kopyalama app_offline

  8. Hazırlama sitenizin URL'sine göz atın. Artık giriş sayfanız yerine app_offline.htm sayfasının görüntülendiğini görürsünüz.

    Tarayıcı penceresinde app_offline.htm

Artık sürüm ortamına dağıtmaya hazırsınız.

Kod güncellemesini test ortamına ve üretime dağıtma

  1. Web Tek Tıkla Yayımla araç çubuğunda Hazırlama yayımlama profilini seçin ve web'i Yayımla'ya tıklayın.

    Visual Studio güncelleştirilmiş uygulamayı dağıtır ve tarayıcıyı sitenin giriş sayfasına açar. app_offline.htm dosyası görüntülenir. Başarılı dağıtımı doğrulamayı test etmeden önce app_offline.htm dosyasını kaldırmanız gerekir.

  2. FTP aracınıza dönün ve hazırlama sitesinden app_offline.htm silin.

  3. Tarayıcıda, hazırlama sitesinde Eğitmenler sayfasını açın ve güncelleştirmenin başarıyla dağıtıldığını doğrulamak için bir eğitmen seçin.

  4. Üretim için test ortamındaki işlemiyle aynı prosedürü izleyin.

Değişiklikleri Gözden Geçirme ve Belirli Dosyaları Dağıtma

Visual Studio 2012 ayrıca tek tek dosyaları dağıtma olanağı sağlar. Seçili bir dosya için yerel sürümle dağıtılan sürüm arasındaki farkları görüntüleyebilir, dosyayı hedef ortama dağıtabilir veya dosyayı hedef ortamdan yerel projeye kopyalayabilirsiniz. Eğitimin bu bölümünde bu özelliklerin nasıl kullanılacağını göreceksiniz.

Dağıtım yapmak için değişiklik yap

  1. Content/Site.css dosyasını açın ve etiket bloğunu body bulun.

  2. background-color değerini #fff yerine darkblue olarak değiştirin.

    body {
        background-color: darkblue;
        border-top: solid 10px #000;
        color: #333;
        font-size: .85em;
        font-family: "Segoe UI", Verdana, Helvetica, Sans-Serif;
        margin: 0;
        padding: 0;
    }
    

Önizlemeyi Yayımla penceresinde değişikliği görüntüleme

Projeyi yayımlamak için Web'i Yayımla sihirbazını kullandığınızda, Önizleme penceresinde dosyaya çift tıklayarak hangi değişikliklerin yayımlandığını görebilirsiniz.

  1. ContosoUniversity projesine sağ tıklayın ve Yayımla'ya tıklayın.

  2. Profil açılır listesinden Test yayımlama profilini seçin.

  3. Önizleme'ye tıklayın ve ardından Önizlemeyi Başlat'a tıklayın.

  4. Önizleme bölmesinde Site.css dosyasına çift tıklayın.

    Site.css dosyasına çift tıklayın

    Değişiklikleri önizle iletişim kutusunda dağıtılacak değişikliklerin önizlemesi gösterilir.

    Site.css değişiklikleri önizleme

    Web.config dosyasına çift tıklarsanız, Değişiklikleri önizle iletişim kutusu derleme yapılandırma dönüşümlerinizin ve yayımlama profili dönüşümlerinizin etkisini gösterir. Bu noktada, sunucudaki Web.config dosyasının değişmesine neden olacak hiçbir şey yapmadınız, bu nedenle hiçbir değişiklik görmeyi beklemiyorsunuz. Ancak, Değişiklikleri önizleme penceresi yanlış iki değişiklik gösterir. İki XML öğesi kaldırılacak gibi görünüyor. Bu öğeler, bir Code First bağlam sınıfı için uygulama başlangıcında Kod İlk Geçişlerini Yürüt'i seçtiğinizde yayımlama işlemi tarafından eklenir. Karşılaştırma, bu öğelerin yayımlama işlemi tarafından eklenmesinden önce yapılır, bu yüzden aslında kaldırılmayacak olmalarına rağmen kaldırılıyor gibi görünebilirler. Bu hata gelecek bir sürümde düzeltilecektir.

  5. Kapat'a tıklayın.

  6. Yayımla öğesine tıklayın.

  7. Tarayıcı Test sitesinin giriş sayfasında açıldığında, CSS değişikliğinin etkisini görmek için CTRL+F5 tuşlarına basarak sabit bir yenilemeye neden olun.

    CSS değişikliğinin etkisi

  8. Tarayıcıyı kapatın.

Çözüm Gezgini'nden belirli dosyaları yayımla

Mavi arka planı sevmediğinizi ve özgün renge geri dönmek istediğinizi varsayalım. Bu bölümde, doğrudan Çözüm Gezgini belirli bir dosyayı yayımlayarak özgün ayarları geri yükleyeceksiniz.

  1. İçerik/Site.css dosyasını açın ve background-color ayarını #fff olarak geri yükleyin.

  2. Çözüm Gezgini'da İçerik/Site.css dosyasına sağ tıklayın.

    Bağlam menüsünde üç yayımlama seçeneği gösterilir.

    Çözüm Gezgini yayımlama seçenekleri

  3. Site.css'teki değişiklikleri önizle'ye tıklayın.

    Hedef ortamda yerel dosya ile sürümü arasındaki farkları gösteren bir pencere açılır.

    Farklı İçerik/Site.css

  4. Çözüm Gezgini'nde Site.css dosyasına yeniden sağ tıklayın ve Site.css'i Yayımla'ya tıklayın.

    Web Yayımlama Etkinliği penceresinde dosyanın yayımlandığı gösterilir.

    Web Yayımlama Etkinliği penceresi

  5. Bir tarayıcı açın ve http://localhost/contosouniversity URL'ye gidin, ardından CSS değişikliğinin etkisini görmek için CTRL+F5 tuşlarına basarak zorunlu yenileme yapın.

    Normal CSS içeren giriş sayfası

  6. Tarayıcıyı kapatın.

Özet

Veritabanı değişikliği içermeyen bir uygulama güncelleştirmesini dağıtmanın birkaç yolunu gördünüz ve güncelleştirileceklerin beklediğiniz gibi olduğunu doğrulamak için değişikliklerin önizlemesini nasıl yapacağınızı gördünüz. Eğitmenler sayfasında artık Verilen Dersler bölümü bulunmaktadır.

Eğitmenler sayfasını ve belirli bir Eğitmen tarafından öğretilen kursları gösteren ekran görüntüsü.

Bir sonraki öğreticide veritabanı değişikliğinin nasıl uygulanacağı gösterilmektedir: doğum tarihi alanını veritabanına ve Eğitmenler sayfasına ekleyeceksiniz.