本文章是由機器翻譯。

Visual Studio 2013

使用 Visual Studio 2013 建置 Office 365 雲端商務應用程式

Heinrich Wendel
Jim Nakashima
Mike Morton

從未比現在更大的需求、 期望和商務應用程式的重要性。現代商務應用程式需要訪問可用組織內部和外部的資料。他們需要連接個人整個組織,並説明它們相互協作以豐富、 有趣的方式。應用程式本身需要在多個類型的設備和表單的因素,例如智慧手機、 平板電腦、 筆記本電腦和桌上型電腦與各種螢幕尺寸上可用。

你需要一個平臺,提供一整套的服務,以滿足這些應用程式的核心要求。您還需要一個工具集,可使您有效地與現有 DevOps 集成流程跨組織的同時生成這些應用程式。

在本文中,我們將展示Visual Studio2013年如何説明您生成這些現代商務應用程式。我們將創建一個招聘的應用程式,管理職位和提供無縫擴展的 Office 365 和 Windows Azure 平臺和使用 Office 365 服務等身份和社會經驗的候選人。

我們將介紹如何Visual Studio可説明您將生產性跨從建立、 運行和測試、 發佈和使用持續集成的雲商務應用程式的完整生命週期。

建立新專案

通過推出Visual Studio2013年啟動。按一下檔 |新的專案。雲的商務應用程式範本是可用的辦公室/SharePointVisual Basic和 Visual C# 應用程式節點下 (見圖 1)。這種分類基於中介層 ; 中使用的語言 用戶端是 HTML 和 JavaScript。


圖 1 在Visual Studio2013年中創建一個新的雲商務應用程式專案

雲的商務應用程式包括四個專案:

  • 伺服器專案,這是一個基本的ASP.NET專案,用來添加表和連接到資料來源
  • 與標準的 app 的 SharePoint 專案,提供到 Office 365 的連接
  • HTMLClient 專案,您在其中定義 UI 為您的應用程式 (螢幕) 一個 JavaScript 專案
  • 雲的商務應用程式專案,它的所有專案聯繫在一起。您可以看到中的Visual Studio專案結構圖 2


圖 2 雲商務應用程式結構

我們就去通過如何使用每個這些專案。

定義資料模型

資料是每個商務應用程式的核心。雲商務應用程式提供以各種方式與資料進行交互。讓我們首先定義一個新的資料模型,使用表設計器。我們稍後會將此資料模型部署到 Windows Azure SQL 資料庫。我們會使用表設計器來定義一個候選人的實體。圖 3 顯示的資料模型的詳細資訊。實體的屬性,它是一個簡單的資料類型 (如字串或整數或一種業務類型 (如 URL、 電子郵件地址或人組成。具體驗證邏輯和獨特的視覺化效果內置Visual Studio工具和運行時。

圖 3 候選人實體詳細資訊

屬性名稱 資料型別
命名 字串
Phone 電話號碼
Email 電子郵件地址
ReferredBy Person
InterviewDate 日期 (不需要)

雲的商務應用程式是為 SharePoint 應用程式。它在它運行的 Office 365 租客中有對資料的訪問。資訊工作者使用 SharePoint 在日常基礎上創建、 管理和共用協作環境中的資料。為我們的方案中,我們假設一個 SharePoint 清單當前用於跟蹤打開的作業的帖子。圖 4 顯示此清單中,包括了輸入的資料。


圖 4 工作在 SharePoint 中過帳清單

讓我們將資料附加到此清單中添加資料來源操作使用內容功能表中的資料來源資料夾。在嚮導的第一頁中選擇 SharePoint 和輸入對您計畫開發的 SharePoint 網站的 URL。(如果您沒有為發展一個 SharePoint 網站,你可以得到一個從 dev.office.com— — 一年的 MSDN 訂閱是免費.)下一個頁面顯示在給定的 SharePoint 網站上的所有清單和文件庫可用。通過選擇和整理對話方塊中導入的招聘資訊清單。

有關從兩個不同的資料來源的資料 — — SharePoint 和在這種情況下 SQL — — 寫在兩個工作的業務邏輯是你當建設雲商務應用程式的最強大功能之一。讓我們添加的候選人和使用表設計器的工作崗位之間的關係。我們會成立一個對多的關係,在表設計器中使用添加關係操作。我們會指定每個候選人可以適用于只是一個工作過帳。圖 5 顯示關係的確切配置。現在,我們已經定義的資料模型,我們會為應用程式提供一個使用者介面來改變我們的工作重點。


圖 5 一多候選人和工作崗位之間的關係

設計使用者介面

在今天的世界中它不再足以創建使用者介面,只是工作。使用者期望應用程式跨寬度從智慧手機和平板電腦到傳統的桌面設備的工作。他們還希望應用程式可以使用觸摸,以及鍵盤為大量資料輸入。應用程式應該看起來一致在整個公司和有特定的品牌形象。雲商務應用程式為您提供的範本、 佈局和控制項,輕鬆地完成這些平凡的任務。

我們會創建一組的三個螢幕,並定義它們之間的導航流程。第一個螢幕將顯示平鋪的清單讓你流覽所有候選人都在資料庫中。從這裡,您可以導航到要添加新的候選人,第二個螢幕或鑽到現有的候選人,在第三個螢幕上的詳細資訊。

通過在螢幕資料夾中的 HTMLClient 專案的內容功能表中選擇添加螢幕動作添加的第一個螢幕。螢幕範本對話方塊中提供了三個範本,您可以使用作為好的起點。對於第一個螢幕上,我們會使用"流覽資料螢幕"範本。請確保在螢幕資料下拉清單中選擇候選實體和完成對話方塊。

螢幕設計器中顯示圖 6 是由兩部分組成。綁定到螢幕的資料將顯示在左側,側面板中,您的螢幕的分層視圖的主區域中。


圖 6 顯示流覽候選人螢幕的螢幕設計器

螢幕設計器中選擇的清單,並從它的屬性頁設置專案點擊操作。而不是編寫您自己的方法使用的 JavaScript 代碼,您可以選擇從一組常用的預定義方法。選擇 Candidates.viewSelected,然後按照嚮導創建詳細資訊螢幕。回來的第一個螢幕上,選擇該命令列並添加一個新按鈕。這一次使用 Candidates.addAndEditNew 方法,並創建一個添加編輯詳細資訊螢幕。

現在,定義了基本螢幕和它們之間的導航,讓我們定制它們的外觀。你可以呈現三種方式中的實體的清單:使用標準的清單、 一個表格視圖或平鋪清單。清單是一個很適合更複雜的佈局,而表格視圖優化的資料密集型任務。

現在,我們就會選擇平鋪清單,更好地利用螢幕房地產,可以跨不同的螢幕大小最佳擴展。從平鋪清單節點除姓名、 電話和電子郵件中刪除所有子專案。最後,從集合中通過更改圖示屬性在屬性工作表中的包含的圖示的選擇更好的視覺化的命令。

在行動中的應用程式

它是時間來看一看正在運行的應用程式。在Visual Studio,在瀏覽器中運行它,請按 F5。這款應用程式部署到 SharePoint 開發者網站,第一次出現對話方塊,詢問您批准的許可權集。隨後 F5s 將跳過此步驟,除非您更改 SharePoint 專案內您的解決方案。

這款應用程式載入的單頁面應用程式 (SPA) 體系結構中使用完全由用戶端代碼呈現的 UI。與伺服器的通信將使用非同步調用,從而導致快速和流體的經驗來執行。一個例子你可以看到這是在主畫面上,使用增量滾動的候選人名單。當到達清單的結尾,項下一集是動態載入在後臺不會阻止使用者。

所有的佈局很好地適應不同的表單使用回應設計技術的因素。調整瀏覽器視窗的大小給你看看這款應用程式如何在手機或平板電腦,看起來如中所示的快速方法圖 7。一切都已被優化為觸摸但作品同樣也在桌面上使用的鍵盤和滑鼠。


圖 7 運行雲商務應用程式在行動裝置上的所有三個螢幕,

現在讓我們來添加一個新的候選。顯示對話方塊中為您提供預期的一組輸入的欄位和一個選擇器,它允許使用者從附加的 SharePoint 清單中選擇工作職位。選擇使用自動完成的文字方塊,用於顯示建議基於您的組織的使用者目錄的 ReferredBy 值 — — 例如,類似活動目錄。

你可以看到其他 Office 365 集成詳細資訊螢幕,其中顯示了每個人的狀態資訊。Lync 的連絡人卡片顯示的詳細的資訊,並允許為豐富的交互,例如啟動 IM 對話、 發送電子郵件或排程會議。

當由其中一個實體創建和最後修改跟蹤的欄位會自動添加。這些説明履行共同審核要求,而無需編寫任何代碼。如果他們不需要為您的應用場景,你可以切換回螢幕設計器而不終止應用程式、 刪除的欄位並保存螢幕。刷新您的瀏覽器 — — 無需重新開機該應用程式在Visual Studio— — 和所做的更改會立即反映出來在應用程式中。

添加業務邏輯

到目前為止我們描述的生產發展經驗可以讓你將你的精力集中在應用程式的獨特價值:業務邏輯。讓我們說只有從人力資源部的員工應獲准為候選人安排面試。這種組織的資訊通常存儲在 Active Directory 中。

在 Office 365,Active Directory 給開發者出現通過使用者設定檔服務。一種強型別的 API 有最常用的屬性,如使用者的部門。可以將特定的自訂屬性添加到您的組織使用 SharePoint 管理中心的使用者設定檔服務。你還可以檢索這些在代碼中使用標準 SharePoint Api 直接談到使用者設定檔服務。

業務邏輯寫在中介層上,它由伺服器在此解決方案中的專案。表設計器中編寫代碼下拉清單中為您提供一套廣泛的進入點到您的應用程式的資料管道。在這裡我們處理驗證事件和使用的應用程式物件查詢當前已登錄的使用者的部:

if (entity.InterviewDate !=
  null && Application.Current.User.Department != "HR") {
  results.AddPropertyError("Only HR can schedule interviews",
  entity.Details.Properties.InterviewDate);
}

您的應用程式再次啟動,或只是刷新您的瀏覽器,如果你已經沒停止應用程式。現在,試圖設置一名候選人的面試日期將導致一個錯誤因為你不是人力資源部的成員。這種邏輯運行在中介層上,這意味著無論用戶端如何連接到服務的有效性規則將運行。

整合企業社會

社交網路用於通信和協作。使用者期望現代商務應用程式與這些社會網路進行集成。雲商務應用程式能夠與使用 SharePoint 新聞推送功能的幾個點擊的社會融合。在此第一版本中,您必須配置 SharePoint,而是使用 SharePoint 新聞推送 Yammer 比。

設計階段選項在表設計器中打開的候選實體和查看屬性視窗。社會科已用於生成該新聞推送關於創建和更新實體的一個職位的選項。啟用這兩個。您可以控制哪些屬性觸發社會更新使用"選擇郵政觸發器......"的連結。選擇僅 InterviewDate 郵政觸發器,如中所示圖 8。摘要屬性允許您選擇什麼有關實體的資料將顯示在該職位。


圖 8 社會屬性和郵政觸發器對話方塊的

運行庫單篇運行應用程式來查看已配置的社會融合。通知中右上角的新聞推送和跟隨連結。新聞複製連結打開一個新視窗顯示應用程式的活動頁面。認為這是應用程式的內部社會飼料。新聞複製頁面有一項為每個新創建的候選人和每名候選人的面試日期改為誰。點擊該職位需要你直接向候選人詳細資訊螢幕。此外,使用者可以啟動新會話或喜歡或職位的任何答覆。添加一個新的候選或更改現有的候選人要看到這項活動在新聞頁面上,正在生成的示例中所示的面試日期圖 9


圖 9 雲商務應用程式的新聞複製頁

如果你想要看看這款應用,從活動,但有更容易的方法,定期跟蹤應用程式的活動,有新聞複製選項有説明。按一下主畫面上的跟隨連結將導致同一社會職位與談話將發送到使用者的個人的新聞來源。這使使用者可以按照在此應用程式或任何其他雲商務 App,發生了什麼人或一個集中的位置中的文檔。

發行

現在,您已經生成並測試您的應用程式本地,它是將應用程式部署到您的組織中的其他雇員的好時機。從解決方案資源管理器中的雲的商務應用程式專案的內容功能表中選擇發佈。發佈對話方塊中為你走過了你有發佈雲商務應用程式時的選擇:託管方法,SharePoint 承載的應用程式服務、 資料連線和 SharePoint 的身份驗證。

讓我們看雲的商務應用程式發佈到 Office 365 使用安全的 Windows Azure 網站來承載的應用程式服務和 Windows Azure SQL 資料庫,資料庫的宿主最優路徑。

可以將應用程式發佈到的辦公室存儲或貴公司的應用程式目錄。如果目標是創建一個應用程式供公眾查閱,然後辦公室商店有意義。如果應用程式僅用於內部使用您的組織中,然後使用您的應用程式目錄是要走的路。App 目錄允許您自動將出 app 推送到多個網站。這簡化了應用程式的最終使用者和管理採集。只有在應用程式的單個實例實際上存在,即使使用者可以從許多不同的網站訪問它。

SharePoint 承載方法選擇託管提供程式選項,這將使您更好地控制如何你會部署該應用程式的不同部分。它還提供更深入瞭解這款應用程式正在執行、 容易地擴展應用程式的不同層和提供對應用程式的資料的存留期的完全控制。

承載的應用程式服務現在你需要決定之間承載 Windows Azure 中或在 IIS 伺服器上的應用程式服務。Windows Azure 是創建一個主控環境的最簡單和最快方式。你不需要設置一台機器或甚至配置 IIS,如 Windows Azure 照顧這對你來說。

下一步,選擇特定的 Windows Azure 訂閱,以使用。如果您在登錄到您的 Windows Azure 帳戶,請選擇您想要使用的訂閱。否則,您需要登錄以查看可用的訂閱。

服務類型選項卡 (請參閱圖 10) 提供了有關使用 Windows Azure 網站或雲服務的選項。選擇 Web 網站選項。Web 網站選項是一個偉大的選擇為雲商務應用程式由於速度有多快,你可以推 app 出來,為承載它的低成本和易用性,這款應用程式可以縮放如果它成為最受歡迎。使用 Windows Azure 的 Web 網站選項仍給您訪問其他 Windows Azure 服務 (如 SQL 資料庫,緩存,BLOB 存儲和服務匯流排。


圖 10 發佈對話方塊

下一步,選擇您想要使用的特定 Windows Azure Web 網站。如果沒有列出,或者如果您想要創建一個新,請使用以下連結,轉到 Windows Azure 門戶。最後,選擇 HTTPS 選項以便安全地加密通信。

資料連線現在是時候要配置要使用的應用程式的資料庫連接。如果你已經連結到 Web 網站的 SQL 資料庫,然後連接字串將填寫正確。如果沒有,可以按照以下的文章,"如何對配置的 Web 網站"中的相應步驟創建新連結的資源在 Windows Azure 文檔中 bit.ly/151m3GM。簡單地也可以使用現有的 SQL 資料庫的連接字串。在附加資料來源選項卡,請確保該連接指向相應的端點 — — 經常連接終結點是不同的基礎是否您要發佈到生產或不同的環境。

SharePoint 身份驗證你需要配置的最後一件事是 SharePoint 使用的驗證類型。這必需啟用 Web 服務器上承載的應用程式服務 — — 在這種情況下 Windows Azure — — 與 SharePoint 進行通信。您需要在 SharePoint 的身份驗證選項卡,選擇"使用用戶端的秘密"選項,因為您正在使用 Office 365。若要使用這種類型的身份驗證,您需要獲得一個用戶端 Id 和用戶端的秘密。這些基本上是一個使用者 ID 和應用程式的密碼。他們被需要使用打開授權 (OAuth),這是一個開放的標準應用程式的授權。

我們會將發佈 app 到 app catalog,因為我們只想要它由組織內的人使用。因此,若要獲取用戶端 Id 和用戶端的秘密,需要執行以下操作:

  • 登錄到辦公室 365 SharePoint 網站,您計畫部署應用程式,然後定位到 HTTP://Your­SharePointSiteName/_layouts/15/appregnew.aspx (圖 11 顯示 AppRegNew.aspx 頁)。
  • 按一下製作按鈕為用戶端 Id 和用戶端的秘密。
  • 輸入您的應用程式的名稱作為標題和域的 Windows Azure 網站作為應用程式域。
  • 將重定向 URI 文字方塊保留為空,然後按一下創建按鈕。


圖 11 AppRegNew.aspx 頁

回到上Visual Studio中發佈對話方塊的視窗,複製的用戶端 Id 和用戶端的秘密從 AppReg-­New.aspx 確認頁。下一個選項卡上,Windows Azure Web 網站的 URL 應該已經填寫。

發佈雲商務 App 現在,您應該看到顯示你剛配置的選項回顧一下摘要選項卡。單鍵發行按鈕以將雲商務應用程式發佈到各個端點。在部署完成後,檔資源管理器視窗將打開,顯示.app 檔。這是你需要上傳到您的應用程式目錄的 SharePoint 應用程式套裝軟體。若要瞭解更多詳情,請參閱在Microsoft Office支援文章中的步驟 bit.ly/1bnIrRY

此時,該應用程式是在應用程式目錄中,您可以在一個或多個網站上安裝它。

持續集成

持續集成可以節省你的時間通過自動發佈你的應用程式在整個開發過程。在團隊環境中多個開發人員在不斷地進行更改,持續集成可確保您的應用程式將編譯、 打包,和自動和一致的方式公佈。

Team Foundation伺服器 要利用雲的商務應用程式的持續集成,你要麼需要Visual StudioTeam Foundation伺服器 (TFS) 2013 安裝上-處所或使用 TFS 在雲中,Team Foundation的服務 (見 tfs.visualstudio.com)。如果您使用 TFS 2013 處所,請確保您 TFS 生成過程範本下載並安裝它為您的團隊專案。目前,新的流程範本僅支援對 Office 365 承載 SharePoint 網站部署 SharePoint 一部分雲商務應用程式。關於房地 SharePoint 網站尚不支援。

創建組建定義組建定義描述的持續集成過程,並包括一個生成過程範本 (描述工作流的.xaml 檔) 和您的環境所特有的配置資料。若要在Visual Studio中創建新的組建定義,請確保你連接到 TFS 電腦和您的應用程式簽入到原始程式碼管理。Team 總管中的生成面板,在選擇新的組建定義。

一個組建定義的關鍵方面和特定雲商務應用程式 (您會看到在左邊後按一下以創建新的組建定義的六個選項卡) 的新參數的更詳細的說明如下:

  • 一般:選擇此選項以提供名稱、 描述和佇列處理規則。
  • 觸發器:選擇此選項以指定當您想要開始一個組建定義。你可能想要將此設置為手動,直到你已經證實的組建定義運行的目的。
  • 源設置:選擇此選項以指定您正在構建。
  • 生成預設值:選擇此選項以指定是將進程的組建定義和應放置輸出的組建控制器。
  • 過程:選擇此選項以選擇要使用的生成過程範本和參數將傳遞到工作流。
  • 保留原則:選擇此選項以指定生成輸出應保留多長時間。

為雲商務應用程式的組建定義的三個新參數位於進程選項卡上。第一,選擇為雲商務應用程式創建的生成過程範本。按一下"顯示詳細資訊"展開器並選擇 TfvcContinuousDeploymentTemplate.12.xaml 範本或 GitContinuousDeploymentTemplate.12.xaml 範本。展開部署設置部分配置新的參數 (所示圖 12),哪些是:

  • 部署設置的路徑:此參數包含一個 XML 檔,包含有關雲的商務應用程式,包括內在資料庫的資料庫連接字串和終結點的任何附加的資料來源的發佈資訊的路徑。
  • SharePoint 部署環境的名稱:此參數包含 SharePoint URL、 使用者名和密碼,將用於連接到 SharePoint 伺服器在其中將發佈應用程式。
  • Windows Azure 部署環境的名稱:此參數包含用於連接到 Windows Azure 訂閱所需的資訊。


圖 12 組建定義對話方塊的

佇列組建定義現在為您所提供的必要的配置資料,以持續集成的利用,是時候要踢遠的生成。找到您剛才在生成面板中創建的組建定義並從內容功能表中選擇新生成入隊。要把一切都在顯示的對話方塊和佇列中生成。它將由接組建控制器時它是免費的。

若要查看生成Build 總管中的,選擇查看我生成從生成面板上的操作下拉清單。你會看到Build 總管有兩個選項卡:一個排隊的、 正在進行的和最近完成的生成 ; 和一個為較早前已完成的生成。通過在資源管理器中,如果生成失敗,其中包括額外的診斷資訊中選擇它,您可以看到任何生成的日誌。

立即行動

我們已經表明你生產力高的經驗來定義資料和螢幕,使您可以快速獲得應用程式啟動和運行。這個應用程式有一個專業型式的使用者介面,與 SharePoint 擁有優越的地理位置和與一組 Office 365 服務 Lync 的存在和聯繫卡、 人選取器和社會等集成在一起。我們已經表明你如何使用 Microsoft.NET 框架若要自訂您的應用程式和 — — 當你準備好了 — — 如何發佈您的應用程式和配置連續集成作為您的發展進程的一部分。

現在開始構建雲商務應用程式。所有您需要是Visual Studio2013年和辦公室 365 開發人員訂閱使用作為一個沙箱的開發環境。MSDN 訂閱者有資格為一次性,12 個月的單使用者辦公室 365 開發商訂閱。轉到 bit.ly/1fvYeAT 瞭解更多。

Heinrich Wendel  曾在微軟許多年在這兩個,資訊技術組和產品組作為一名開發人員、 架構師和其他角色。他目前是程式管理器上的Visual Studio團隊的創建為Microsoft Office和 SharePoint,以及新的雲商務應用程式開發的應用程式的工具。最近莫頓花了建設的新的"行動方案"工具,在瀏覽器中完全工作的時間。

Jim Nakashima  是下午上重點建設偉大的端到端開發的Visual Studio雲平臺工具團隊經驗為Microsoft Office和 SharePoint 的主體。之前他當前的角色中, 島美嘉花了數年來對 Windows Azure,刺激了他的興趣的雲及開發人員服務,他現在適用于Visual Studio工作。

Mike Morton  是一個程式管理器上的Visual Studio團隊的建立在微軟的雲商務應用程式工具。加入之前的產品組,他曾作為一名顧問,為客戶利用 SharePoint 平臺設計的業務解決方案。自己的電腦是現代 UX 的激情,試圖使開發人員和最終使用者來說它的好處。

衷心感谢以下 Microsoft 技术专家对本文的审阅:喬文件夾和Brian摩爾

喬聯程式設計序是主要程式經理,他對Visual Studio工具天青、 Office 365 和商務應用程式開發。他是Visual StudioLightSwitch 團隊的原始成員之一,協助塑造其發展和其成立以來的方向。聯程式設計序是建立在商務應用程式和高生產力應用程式開發中的出色的使用者體驗的激情。在加入微軟之前, 他學習在羅切斯特理工學院電腦科學。

Brian摩爾是目前正在與 Office 365 和 Windows Azure 的雲商務應用程式融入Visual Studio產品線的專案經理。他曾在Visual StudioLightSwitch 專案的所有版本和在過去 20 年,他花了時間在每個主要司在 Microsoft,包括不同的國家和美國各地的校園在心的VB開發人員,他的激情給現代天業務線應用程式帶來簡單性。