使用Visual Studio 2012發行網站應用程式到Windows Azure

by vivid 3. 七月 2013 17:54

.NET Magazine國際中文電子雜誌
作 者:許薰尹
審 稿:張智凱
文章編號:N130713801
出刊日期:2013/07/03

 

WCF服務需要一個裝載環境負責接聽請求,分配服務所需的資源,並在接收到請求時,建立服務物件的實體。WCF服務可以放在公司內部網路執行,當然也可以放在雲端上,例如微軟的Windows Azure。

Windows Azure是微軟的雲端平台,可以幫你裝載網站應用程式或WCF服務,多媒體影音檔案,甚至您也可以在Windows Azure中建立SQL資料庫。要將WCF服務部署到Windows Azure只需要準備好服務應用程式,以及組態檔案就好,Windows Azure會負責裝載WCF。

 

建立Windows Azure WCF服務Web角色專案

在Visual Studio 2012之中,想要開發可部署到Windows Azure服務,需要先下載並安裝「Windows Azure SDK for .NET」,參考以下網址:

https://www.windowsazure.com/en-us/develop/net/

接著從Visual Studio 2012開發工具的「檔案」->「新增」->「專案」,從「Cloud」範本之中,選取「Windows Azure雲端服務」,建立一個專案,設定一個名稱,如「MyWindowsAzureService」,並按下「確定」按鈕,請參考下圖所示:

clip_image002

圖 1:建立Windows Azure WCF服務Web角色專案。

在「新增Windows Azure雲端服務」對話盒中選取「WCF服務Web角色」,按下向右箭頭加到右方的清單,並按下「確定」按鈕,請參考下圖所示:

clip_image004

圖 2:建立「WCF服務Web角色」。

預設Visual Studio 2012會建立兩個專案,以本文範例而言:WCFServiceWebRole1專案為WCF服務;MyWindowsAzureService專案為服務組態資訊,請參考下圖所示:

clip_image005

圖 3:Visual Studio 2012自動建立兩個專案。

檢視WCFServiceWebRole1專案中的IService1.cs檔案,其中已經包含一個WCF服務定義範例IService1,描述服務提供GetData、與GetDataUsingDataContract方法:

 

namespace WCFServiceWebRole1 {
  // 注意: 您可以使用 [重構] 功能表上的 [重新命名] 命令同時變更程式碼和組態檔中的介面名稱 "IService1"。
  [ServiceContract]
  public interface IService1 {

    [OperationContract]
    string GetData( int value );

    [OperationContract]
    CompositeType GetDataUsingDataContract( CompositeType composite );

    // TODO: 在此新增您的服務作業
  }


  //使用下列範例中所示的資料合約,新增複合型別至服務作業。
  [DataContract]
  public class CompositeType {
    bool boolValue = true;
    string stringValue = "Hello ";

    [DataMember]
    public bool BoolValue {
      get { return boolValue; }
      set { boolValue = value; }
    }

    [DataMember]
    public string StringValue {
      get { return stringValue; }
      set { stringValue = value; }
    }
  }
}


WCFServiceWebRole1專案中的Service1.svc.cs檔案包含一個Service1類別,實作了服務的程式碼:

namespace WCFServiceWebRole1 {
  // 注意: 您可以使用 [重構] 功能表上的 [重新命名] 命令同時變更程式碼、svc 和組態檔中的類別名稱 "Service1"。
  // 注意: 若要啟動 WCF 測試用戶端以便測試此服務,請在 [方案總管] 中選取 Service1.svc 或 Service1.svc.cs,然後開始偵錯。
  public class Service1 : IService1 {
    public string GetData( int value ) {
      return string.Format(  "You entered: {0}" , value  );
    }

    public CompositeType GetDataUsingDataContract( CompositeType composite ) {
      if ( composite == null ) {
        throw new ArgumentNullException(  "composite"  );
      }
      if ( composite.BoolValue ) {
        composite.StringValue += "Suffix";
      }
      return composite;
    }
  }
}


建立好專案之後,就有一個現成的服務可以讓我們進行測試了。

 

測試

Windows Azure Compute Emulator(Windows Azure 計算模擬器)可以讓你用來在本機執行、測試、除錯雲端服務專案,而不需要連接到網際網路上真正的Windows Azure。在本機執行專案時,Visual Studio 2012會主動啟動Windows Azure計算模擬器。

在Visual Studio 2012直接按F5執行,Visual Studio 2012會啟動「Windows Azure偵錯環境」將WCF服務部署到Windows Azure偵錯環境上執行,請參考下圖所示:

clip_image007

圖 4:將WCF服務部署到Windows Azure偵錯環境上執行。

接著便會啟動瀏覽器,連結到服務所在位置,請參考下圖所示:

clip_image009

圖 5:服務位置。

只要使用滑鼠右鍵點選作業系統下方工具列上Windows Azure小圖示,就會開啟快捷選單,透過選單可以開啟Windows Azure 計算模擬器圖型化介面,請參考下圖所示:

clip_image010

圖 6:開啟Windows Azure 計算模擬器圖型化介面。

Windows Azure 計算模擬器列表顯示所有執行中的Role執行個體,點選其中的執行個體,右邊就會列出日誌資訊,請參考下圖所示:

clip_image012

圖 7:執行日誌資訊。

同樣地,使用滑鼠右鍵點選作業系統下方工具列上Windows Azure小圖示,從選單可以開啟Storage模擬器圖型化介面,請參考下圖所示:

clip_image014

圖 8:Storage模擬器圖型化介面。

RoleEntryPoint

檢視WCF服務專案WCFServiceWebRole1中的WebRole.cs檔案:

namespace WCFServiceWebRole1 {
  public class WebRole : RoleEntryPoint {
    public override bool OnStart ( ) {
      // 若要啟用 AzureLocalStorageTraceListner,請取消註解 web.config 中的相關區段 
      DiagnosticMonitorConfiguration diagnosticConfig = DiagnosticMonitor.GetDefaultInitialConfiguration( );
      diagnosticConfig.Directories.ScheduledTransferPeriod = TimeSpan.FromMinutes( 1 );
      diagnosticConfig.Directories.DataSources.Add( AzureLocalStorageTraceListener.GetLogDirectory( ) );

      // 如需有關處理組態變更的資訊,
      // 請參閱位於 http://go.microsoft.com/fwlink/?LinkId=166357 的 MSDN 主題。

      return base.OnStart( );
    }
  }
}


預設Web Role專案中WebRole類別繼承RoleEntryPoint類別,RoleEntryPoint類別定義了讓Windows Azure裝載程式(host)呼叫的方法。你也可以透過此類別新增一些處理邏輯到服務中。若是Worker Role類型的服務,便強制要繼承自RoleEntryPoint類別。

RoleEntryPoint類別定義了以下方法:

  • OnStart:應用程式啟動時執行。
  • OnStop:應用程式停止時執行。若應用程式產生例外錯誤,並不會執行OnStop方法。
  • Run:可視為應用程式的進入點。

組態設定

MyWindowsAzureService專案中包含了一些檔案,可以用來設定部署到Windows Azure的相關資訊,檔案包含:ServiceDefinition.csdef、ServiceConfiguration.Local.cscfg與ServiceConfiguration.Cloud.cscfg檔案。舉例來說,使用滑鼠雙擊MyWindowsAzureService專案中「角色」目錄下的的「WCFServiceWebRole1」項目,便會開啟角色屬性設定頁面,我們可以將執行個體所在的VM大小設為適當的值,例如以下範例設為「超小」,設定的值將會儲存在ServiceDefinition.csdef檔案之中,請參考下圖所示:

clip_image016

圖 9:設定角色屬性。

ServiceDefinition.csdef檔案包含一些描述資訊,用來定義應用程式的角色,也可以包含一些組態設定,套用到所有執行個體。參考以下程式碼,上述的操作步驟會將WebRole 項目的vmsize屬性設定為ExtraSmall。

<?xml version = "1.0" encoding = "utf-8"?>
<ServiceDefinition name = "MyWindowsAzureService" xmlns = "http://schemas.microsoft.com/ServiceHosting/2008/10/ServiceDefinition" schemaVersion = "2012-10.1.8">
  <WebRole name = "WCFServiceWebRole1" vmsize = "ExtraSmall">
    <Sites>
      <Site name = "Web">
        <Bindings>
          <Binding name = "Endpoint1" endpointName = "Endpoint1" />
        </Bindings>
      </Site>
    </Sites>
    <Endpoints>
      <InputEndpoint name = "Endpoint1" protocol = "http" port = "80" />
    </Endpoints>
    <Imports>
      <Import moduleName = "Diagnostics" />
    </Imports>
    <LocalResources>
      <LocalStorage name = "WCFServiceWebRole1.svclog" sizeInMB = "1000" cleanOnRoleRecycle = "false" />
    </LocalResources>
  </WebRole>
</ServiceDefinition>

預設ServiceConfiguration.Local.cscfg與ServiceConfiguration.Cloud.cscfg檔案內容相同,你可以利用這個檔案來設定應用程式的執行個體(Instance),ServiceConfiguration.Cloud.cscfg檔案內容參考如下:

<?xml version = "1.0" encoding = "utf-8"?>
<!--
  *********************************************************************

  這個檔案是由專案檔案中的工具產生: ServiceConfiguration.Cloud.cscfg

  對這個檔案所做的變更可能會造成錯誤的行為,而且如果重新產生檔案,所做的變更將會遺失。

  *********************************************************************
-->
<ServiceConfiguration serviceName = "MyWindowsAzureService" xmlns = "http://schemas.microsoft.com/ServiceHosting/2008/10/ServiceConfiguration" osFamily = "3" osVersion = "*" schemaVersion = "2012-10.1.8">
  <Role name = "WCFServiceWebRole1">
    <Instances count = "1" />
    <ConfigurationSettings>
      <Setting name = "Microsoft.WindowsAzure.Plugins.Diagnostics.ConnectionString" value = "UseDevelopmentStorage = true" />
    </ConfigurationSettings>
  </Role>
</ServiceConfiguration>


部署

服務組態設定好了之後,就可以準備部署到Windows Azure。從Visual Studio 2012開發工具的「方案總管」->「MyWindowsAzureService」專案,按滑鼠右鍵,從快捷選單中選取「封裝」,請參考下圖所示:

clip_image017

圖 10:封裝Windows Azure應用程式。

下一步是選取服務的組態與組件的組態,最後按下「封裝」按鈕,請參考下圖所示:

clip_image018

圖 11:設定服務的組態與組件的組態。

完成之後,會自動啟動檔案總管,顯示封裝完成的檔案所在目錄,其中包含MyWindowsAzureService.cspkg與ServiceConfiguration.Cloud.cscfg檔案,請參考下圖所示:clip_image020

圖 12:封裝完產生MyWindowsAzureService.cspkg與ServiceConfiguration.Cloud.cscfg檔案。

建立雲服務

Windows Azure中的雲服務採用的是Role-Based模型來運作,Role-Based模型包含一個Web Role與一個Worker Role,每一個Role都是一個VM,支援應用程式的部署與監控的動作。

要建立雲服務,只需要將應用程式的組態設定檔上傳到雲服務。使用瀏覽器連接到:http://manage.windowsazure.com網站,點選「雲服務」,再點選「創建雲服務」連結,請參考下圖所示:

clip_image022

圖 13:創建雲服務。

從網頁下方跳出的黑色底色的對話盒中,選取「自定義創建」,請參考下圖所示:

clip_image024

圖 14:設定網域名稱與所在地區。

URL部分指定一個唯一的識別名稱,這將是網站的網域名稱,若名稱已存在,會馬上顯示錯誤訊息。在「區域」區塊之中,選取網站所在地區,請參考下圖所示:

clip_image026

圖 15:設定雲服務。

建立完成之後,從「雲服務」頁點選剛建立的服務名稱,請參考下圖所示:

clip_image028

圖 16:點選剛建立的服務名稱。

點選「儀表板」下的「上傳新的生產部署」項目,請參考下圖所示:

clip_image030

圖 17:「上傳新的生產部署」。

為「上載包」取一個名稱,「程序包」設定cspkg檔案;配置選取cscfg檔案,並勾選下方兩個核取方塊,請參考下圖所示:

clip_image032

圖 18:上載設定。

部署完後,您便可以使用瀏覽器連接至此服務,URL可以會顯示在「儀表版」右下方,請參考下圖所示:

clip_image034

圖 19:儀表板。

點選「儀表版」右下方的URL,連接到服務,點選「Service1.svc」檔案檢視服務,請參考下圖所示:

clip_image036

圖 20:檢視服務。

連結到服務的Service1.svc檔案,便會顯示服務的說明頁面,請參考下圖所示:

clip_image038

圖 21:服務的說明頁面。

設計用戶端ASP.NET Web Form應用程式

WCF服務設計並部署完成後,我們便可以設計各種用戶端程式來連結到服務。在本文中將介紹使用ASP.NET Web Form與MVC類型的網站應用程式當用戶端。

若要設計ASP.NET Web Form應用程式當用戶端,首先在Visual Studio 2012開發工具之中,選取「檔案」-「新增」- 「專案」,在「新增專案」對話盒之中,選取程式語言,如「Visual C#」,然後選取「Web」-「ASP.NET空白Web應用程式」,請參考下圖所示:clip_image040

圖 22:建立ASP.NET空白Web應用程式。

從「方案總管」視窗,ASP.NET應用程式上方按滑鼠右鍵,從快捷選單中,選取「加入服務參考」,請參考下圖所示:

clip_image041

圖 23:「加入服務參考」。

在「加入服務參考」視窗中,輸入裝載在Windows Azure雲服務的位址,並按下「移至」按鈕,此時便會從服務下載描述資訊。當你按下「確定」按鈕後,便下載服務相關資訊,並自動產生叫用服務的代理類別程式碼,請參考下圖所示:

clip_image043

圖 24:產生叫用服務的代理類別程式碼。

從「方案總管」視窗可以看到下載下來的資訊,請參考下圖所示:

clip_image044

圖 25:服務參考資料。

加入一個Web Form網頁到網站。自Visual Studio 2012主選單「專案」-「加入新項目.」,選取「Web Form」,使用預設的檔名命名,以新增一個網頁。雙擊新網頁設計畫面,便會進入程式設計視窗,在Page_Load事件處理常式中,加入以下程式碼,呼叫服務:

namespace WebApplication1 {
  public partial class WebForm1 : System.Web.UI.Page {
    protected void Page_Load( object sender , EventArgs e ) {
      ServiceReference1.Service1Client proxy = new ServiceReference1.Service1Client( );
      Response.Write( proxy.GetData( 10 ) );
    }
  }
}

執行網頁測試。在「方案總管」視窗,點選網頁,按滑鼠右鍵,選「在瀏覽器中檢視」,WCF服務執行的結果將會顯示在畫面上,請參考下圖所示:

clip_image046

圖 26:叫用WCF服務。

撰寫ASP.NET MVC應用程式

設計ASP.NET MVC應用程式當WCF服務用戶端的步驟和前一節設計用戶端ASP.NET Web Form應用程式大致相同,首先在Visual Studio 2012開發工具之中,選取「檔案」-「新增」- 「專案」,在「新增專案」對話盒之中,選取程式語言,如「Visual C#」,然後選取「Web」-「ASP.NETMVC4 Web應用程式」,請參考下圖所示:

clip_image048

圖 27:撰寫ASP.NET MVC應用程式當用戶端。

建立一個ASP.NET MVC 4應用程式「空白」範本專案後,Visual Studio 2012會自動在專案中建立許多目錄,以及一些程式碼檔案到專案之中,請參考下圖所示:

clip_image050

圖 28:建立「空白」專案。

從「方案總管」視窗-「Controllers」目錄,按滑鼠右鍵,選取「加入」-「控制器」。此時會有一個「加入控制器」視窗提示要設定控制器名稱,將其名稱設定為「HomeController」,然後按「加入」按鈕將類別加入專案之中,請參考下圖所示: clip_image052

圖 29:加入控制器。

從「方案總管」視窗,ASP.NET MVC網站應用程式上方按滑鼠右鍵,從快捷選單中,選取「加入服務參考」,請參考下圖所示:

clip_image054

圖 30:加入服務參考。

若點選Visual Studio 2012「加入服務參考」視窗內的「確定」按鈕後,產生的Reference.cs檔案內沒有代理類別程式碼,請記得點選「加入服務參考」視窗的「進階」按鈕,清除勾選「重複使用參考組件中的型別」,這樣就會產生代理程式原始程式碼,請參考下圖所示:

clip_image056

圖 31:清除勾選「重複使用參考組件中的型別」。

在HomeController.cs類別Index方法加入叫用服務的程式碼,並將服務執行的結果透過ViewBag傳到檢視:

public ActionResult Index( ) {
      ServiceReference1.Service1Client proxy = new ServiceReference1.Service1Client( );
      ViewBag.Result = proxy.GetData( 10 );
      return View( );
    }
  }

接下來您可以將滑鼠停留在Index action程式碼上方,按滑鼠右鍵,從快捷選單選取「加入檢視」,請參考下圖所示:

clip_image058

圖 32:加入檢視。

隨即出現「加入檢視」對話盒,設定名稱為「Index」,按下「加入」按鈕,請參考下圖所示:

clip_image059

圖 33:加入檢視。

在Index檢視中使用ViewBag顯示執行結果,請參考下圖所示:

clip_image060

圖 34:Index檢視。

Tags:

.NET Magazine國際中文電子雜誌 | ASP.NET | ASP.NET MVC | 許薰尹Vivid Hsu | WindowsAzure | WPF

新增評論




  Country flag
biuquote
  • 評論
  • 線上預覽
Loading






NET Magazine國際中文電子雜誌

NET Magazine國際中文電子版雜誌,由恆逸資訊創立於2000,自發刊日起迄今已發行超過500篇.NET相關技術文章,擁有超過40000名註冊讀者群。NET Magazine國際中文電子版雜誌希望藉於電子雜誌與NET Developer達到共同學習與技術新知分享,歡迎每一位對.NET 技術有興趣的朋友們多多支持本雜誌,讓作者群們可以有持續性的動力繼續爬文。<請加入免費訂閱>

月分類Month List