這是 Will 保哥在「2015 微軟實戰課程日」演講主題【ASP.NET MVC 6 新功能探索】的簡報。

1. ASP.NET MVC 6 新功能探索
多奇數位創意有限公司
技術總監 黃保翕 ( Will 保哥 )
部落格：http://blog.miniasp.com/

2. ASP.NET MVC 6 的三個新功能
New Features in the ASP.NET MVC 6

3. ASP.NET MVC 6 新功能 ( 1 / 3 )
• 檢視頁面元件 (View Components) (VCs)
– 用來解決 Partial View 不容易解決的呈現問題
– 主要還是以 Views 為中心思考，但更加元件化
– 類似一個 mini-controller，因為他有自己的
View
• 相關連結
– View components and Inject in ASP.NET MVC 6

4. ASP.NET MVC 6: 檢視頁面元件
Demo: View Components

5. ASP.NET MVC 6 新功能 ( 2 / 3 )
• 服務注入
– 可自由注入任意服務類別到 View 中使用
– 建立任意服務類別 (Service class)
• 公開類別
• 非巢狀類別
• 非抽象類別
– 從 View 載入服務類別
• @inject TodoList.Services.StatisticsService Statistics
– 使用服務類別
• @await Statistics.GetCount()
– 在 Startup.cs 的 ConfigureServices() 註冊服務類別
• services.AddTransient<TodoList.Services.StatisticsService>();

6. ASP.NET MVC 6: 服務注入
Demo: The @inject

7. ASP.NET MVC 6 新功能 ( 3 / 3 )
• 標籤輔助方法 (TagHelpers)
– 用來幫你自訂伺服器標籤的輔助方法
– 範例程式
https://github.com/aspnet/Mvc/tree/dev/samples/TagHelperSample.Web
https://github.com/DamianEdwards/TagHelperStarterWeb
– Taylor Mullen discusses Tag Helpers on Web Camps TV
http://channel9.msdn.com/Shows/Web+Camps+TV/Create-your-own-Domain-Specific-
Language-in-ASPNET-with-TagHelpers

8. ASP.NET MVC 6: 標籤輔助方法
Demo: The TagHelpers

9. ASP.NET 5 與 .NET Core 簡介
ASP.NET 5 and .NET Core Introduction

10. ASP 開發技術的歷史
• 1996 – Active Server Pages (ASP)
• 2002 – ASP.NET
• 2008 – ASP.NET MVC
• 2010 – ASP.NET Web Pages
• 2012 – ASP.NET Web API, SignalR
• 2014 – ASP.NET 5

11. ASP.NET 5 是甚麼？
• 一個重新設計的 ASP.NET 框架
( 目前 ASP.NET 5 還處於預覽階段 )
• 一個精鍊的、可重組的框架，
用來建構網站與雲端應用程式。
• ASP.NET 5 完全開放原始碼，
並且發布於 GitHub 平台。

12. ASP.NET 5 的特性 ( 1 / 3 )
• ASP.NET 5 有真正「跨平台」的執行環境
– Full .NET CLR (Common Language Runtime)
• 完整的 .NET 執行環境 ( 即 .NET 4.5 / 4.6 )
– Core CLR (針對雲端執行環境最佳化過的執行環境)
• 將部分 Full CLR 拆解成各自獨立的 NuGet 套件
• 個別的套件可以個別更新，更新速度更快
• 所有的套件都將隨著專案部署 (伺服器不用預裝)
– Cross-Platform CLR
• 微軟將會官方支援 Linux 與 Mac OS X 執行環境
• 短期內可透過 Mono 執行 ASP.NET 5
• ASP.NET 5 有個完全模組化的 HTTP 要求管線
– 很多事情都跟你想像的不一樣了！
13

13. ASP.NET 5 的特性 ( 2 / 3 )
• ASP.NET 5 有個全新的設定檔管理機制
– 開發環境設定 config.json
– 正式環境設定 global.json、環境變數、自動覆寫 config.json
– 專案設定 project.json
• ASP.NET 5 有個全新的 Session State 管理機制
– 會依據執行環境自動判斷 Session State 該寫到哪裡去 ( Cloud First )
– 所有寫進 Session 的物件都將需要「強制」序列化 ( Cloud First )
• ASP.NET 5 有個全新的 Cache 管理機制
– 全自動管理，無須再額外設定 ( Cloud First )
• ASP.NET 5 有個全新的追蹤機制
– 支援一個共用的追蹤堆疊 (Tracing Stack)
– 從最底層一直追蹤到 ASP.NET Web Form, ASP.NET MVC,
ASP.NET Web API, ... 通通都可以用。

14. ASP.NET 5 的特性 ( 3 / 3 )
• ASP.NET 5 提供統一 ASP.NET 框架的開發模型
– MVC、Web API 與 Web Pages 都將採用相同的開發流程、介面、類別
– 開發模型 (programming model) != 應用程式介面 (API)
• ASP.NET 5 開發過程完全不需要手動執行建置動作
– 採用全新 Rosyln 編譯器平台，所有編譯動作在背景完成
– Rosyln = 編譯即服務 ( Compile-as-a-Service )
• ASP.NET 5 與 .NET Framework 的連結是綁在一起的
– ASP.NET 5 可以用 .NET 4.5.x、.NET 4.6 甚至是 .NET Core 都可自由選
擇
– 未來不用再等 Microsoft 每個數月才做一次大更新，也降低了套件相依性
• ASP.NET 5 可以更加彈性的執行在任意 Host 環境
– 依然可以跑在 IIS 上
– 也可以跑在自訂的 Console 應用程式或 Windows 服務裡 (self-host)
• ASP.NET 5 在 GitHub 上開放原始碼！

15. ASP.NET 5 與舊版的相容性
• ASP.NET 4.5 (ASP.NET MVC 5) 以前的網
站
– 可以不用重寫！
– 依然可以跑在 .NET Framework 4.6 上！
– 請記得：
• ASP.NET 5 是一種開發模型的轉變！
• 如果想用到 ASP.NET 5 的新功能特性
– 必須微調部分程式碼與專案架構才能用！

16. 什麼是 "k"？
• 一套用來管理 ASP.NET 5 執行環境的工具
– KVM = K Version Manager
• 用來管理 KRE 的工具
• kvm list
• kvm use default
– KRE = K Runtime Environment
• 一個 .NET 版本就是一個 KRE
• klr 執行 KRE 的主要程式
• k 方便執行 klr 的批次檔
• kpm KRE 的套件管理員

17. 主要資料夾
• C:Userswill.kre
– 所有 KRuntime 的根目錄
• C:Userswill.krealias
– 儲存 KRuntime 版本的別名 (類似git的ref)
• C:Userswill.krebin
– kvm 工具所在路徑
• C:Userswill.krepackages
– 每個 KRE 的存放目錄
• C:Userswill.kpmpackages
– K Package Manager (裡面都是 NuGet 套件)
– 以前NuGet套件放在方案的packages目錄下，現在集中放在這裡！

18. Visual Studio 2015 開發環境介紹
Visual Studio 2015 Development Environment

19. ASP.NET 5 專案範本類型
• ASP.NET Web Application
– 建立 ASP.NET 5 網站應用程式
• ASP.NET 5 Class Library
– 建立與 ASP.NET 5 相容的類別庫
• ASP.NET 5 Console Application
– 建立可被 "k" 呼叫的主控台應用程式

20. ASP.NET 5 專案範本
• ASP.NET Web Application 的專案範本
– 上一版有的範本現在還是都有
• Empty, Web Forms, MVC, Web API, Single Page
Application, Azure Mobile Service
– 新版多了兩個 ASP.NET 5 範本 ( 不能勾選核心參考 )
• ASP.NET 5 Empty
• ASP.NET 5 Starter Web

21. 全新的專案結構
• 新的專案檔
– *.kproj
• 新的資料夾
– wwwroot
• 所有靜態檔案
• 新的檔案
– global.json
– project.json
– config.json
• 相依性與參考
– Dependencies
• NPM
• Bower
– References
• ASP.NET 5.0
• ASP.NET Core 5.0
• 自動管理套件相依性

22. 新的專案檔類型 *.kproj
• 採用 MSBuild 第 14 版
• 不再需要明確列出加入專案的檔案清單
( 版控時也將會減少大量的合併衝突機會 )
• 預設在目錄中的專案，都會自動被加進專案
( 直接把檔案放進目錄即可 )
• 可在 project.json 的 exclude 排除不要編譯
的檔案或目錄

23. 新的靜態檔案專用資料夾
• wwwroot
– 注意：這個目錄才是你的網站根目錄
– 只要是靜態檔案都全部集中在這裡
• JavaScript, Images, CSS, …
– 更清楚的關注點分離
• 完整切割前、後端程式碼，目錄結構更乾淨
• 更容易與前端開發流程整合
– 編譯 CoffeeScript 或 TypeScript 到 JavaScript
– 編譯 LESS 或 Sass 到 CSS
– 最小化與合併 JavaScript 或 CSS 檔案
– 最佳化圖片檔案

24. NuGet 套件與相依性管理
25

25. NuGet 套件與相依性管理
• 新的 NuGet 套件管理員
– 支援預覽變更功能 (Preview)
– 套件管理主控台依然可用
– 也可手動修改 project.json 的 dependencies
• 不再有｢加入參考」等動作
– 所有套件相依性的安裝或移除都是自動完成的！

26. 其他套件與相依性管理
• 整合 Bower 套件管理員
– A package manager for the web
– bower_components
• 整合 NPM (Node.js) 套件管理員
– npm is the package manager for something
– node_modules
• 整合 Grunt / Gulp 工作執行器
– The JavaScript Task Runner
– gruntfile.js
– [View] -> [Other Windows] -> [Task Runner Explorer]
– Using Grunt and Bower in Visual Studio 2015

27. 關於專案中的 *.json 檔案
• project.json
– 主要的專案設定檔
– NuGet 套件與相依性都列在這裡
• package.json
– 別誤會，這跟之前的 packages.config 完全無關
– 這是 npm 的套件清單
• bower.json
– 這是 Bower 的套件清單
• gruntfile.js
– 這是 Grunt 的定義檔

28. 管理 BOWER 套件
Demo: bower install requirejs

29. 切換不同的 .NET 核心
• 切換目標 KRE 版本
– [專案屬性] -> [Application] -> [Target KRE version]
• C# 編輯器中可切換不同 .NET 核心
– API Portability Analyzer - Alpha

30. 發佈 ASP.NET 5 網站到 Azure WS
• 發布流程跟以前一模一樣
• 查看部署後的目錄結構

31. ASP.NET MVC 6 與 ASP.NET Web API
ASP.NET MVC 6 and ASP.NET Web API

32. ASP.NET MVC 5 與 ASP.NET Web API 2

33. ASP.NET Web API 哪裡不一樣了？
• MVC + Web API + Web Pages
= ASP.NET MVC 6!
• Web API 的 API 被犧牲了！
– 預設採用跟 ASP.NET MVC 一樣的 Routing,
Filters, Model Binding, … etc.
– 類別不需要再繼承 ApiController
直接繼承 Controller 即可
不繼承 Controller 一樣可用 (透過 DI/IoC 機制)

34. ASP.NET 5 從核心方面的改變
• 什麼！Global.asax 沒了？
• 什麼！Web.config 沒了？
– ASP.NET 5 採用全新設計的 HTTP 要求管線
• 只剩 Startup.cs 來定義應用程式特性
– Startup()
• 用來設定參數來源
– ConfigureServices()
• 使用 ASP.NET 5 內建的 DI 機制進行服務註冊
– Configure()
• 當 ConfigureServices() 執行完後會執行這個方法

35. Startup()
• AddJsonFile("config.json")
– 從 config.json 讀取參數
• AddEnvironmentVariables()
– 從環境變數取得參數(用冒號分隔名稱)
• AddIniFile("App_Dataconfig.ini")
– 從 INI 設定檔讀取參數
• AddXmlFile("App_Dataconfig.xml")
– 從 XML 設定檔讀取參數
• AddCommandLine(args)
– 從命令列參數取得參數

36. ConfigureServices()
• AddEntityFramework()
– 加入 Entity Framework 服務
• AddIdentity()
– 加入 ASP.NET Identity 服務
• AddMvc()
– 加入 ASP.NET MVC / ASP.NET Web API 服務
• AddWebApiConventions()
– 加入相容於舊版 ASP.NET Web API 的服務
– 需安裝 Microsoft.AspNet.Mvc.WebApiCompatShim
(即 NuGet 套件)

37. Configure() 1/2
• loggerfactory.AddConsole()
– 設定 Logger ( ASP.NET 5 全新設計 )
• app.UseBrowserLink()
– 使用 Browser Link
• app.UseErrorPage()
– 使用錯誤畫面 ( ASP.NET 5 全新設計 )
• app.UseDatabaseErrorPage()
– 使用資料庫錯誤畫面
• app.UseErrorHandler("/Home/Error")
– 將錯誤導向到指定路徑 (Controller/Action)

38. ASP.NET MVC 6 錯誤追蹤頁面
Demo

39. Configure() 2/2
• app.UseStaticFiles()
– 使用靜態檔案讀取 ( wwwroot )
• app.UseIdentity()
– 使用 ASP.NET Identity 進行身分驗證
• app.UseMvc()
– 使用 ASP.NET MVC / ASP.NET Web API
– 包含完整路由設定也定義在此

40. 開始使用 ASP.NET MVC 6
• 安裝 Microsoft.AspNet.Mvc 套件(NuGet)
• 在 Startup.cs 新增 Mvc 服務 (DI/IoC)
– 定義在 ConfigureServices() 方法中
– 範例程式
• services.AddMvc();
• services.Configure<MvcOptions>(options =>
{
options.Filters.Add(...);
});
• 設定 ASP.NET MVC 路由
– 定義在 Configure() 方法中

41. ASP.NET MVC 6 哪裡不一樣了？
• 全新的 DI 引擎
– 不用繼承 Controller 也可以執行
• 新的 Routing 風格
routes.MapRoute(
name: "default",
template: "{controller=Home}/{action=Index}/{id?}");
• 關於 ViewEngines
– 不支援 WebFormViewEngine
• Visual Studio 改用 Roslyn 編譯器
– 就算編輯 C# 檔案，不用編譯就能執行
– 將 Ctrl+F5 改成 Ctrl+Alt+Enter 吧！ 
• 新增 3 個功能

42. ASP.NET MVC 6 什麼是不變的
• Controllers
• ActionResults
• Filters
• Routing
• Model binding
• Views (Razor)

43. 使用 ASP.NET MVC 6 的注意事項
• 少用 HttpContext.Current
– 因為全新的 HTTP Request pipeline
– 許多 API 都被移入 Middleware 了！
• 少用 HttpModules 或 HttpHandlers
– 因為全新的 HTTP Request pipeline
– 許多 API 都被移入 Middleware 了！

44. 在 Core CLR 執行環境下的變化
• 以前的 ngen 要改用 crossgen
– crossgen = CoreCLR Native Image Generator
• 不再有 GAC 的概念！

45. 總結
Summary

46. • ASP.NET 5 這次真的打掉重練
– ASP.NET 5.0 事實上跑在 .NET 4.5 CLR 上面
– ASP.NET 5.0 自己是一個 Process Container
– ASP.NET 5.0 是個開發模型(Programming Model)
– ASP.NET 5.0 與 ASP.NET Core 5.0 開發模型相
同
– ASP.NET 5.0 須跑在一個支援 KRuntime 的環境
– ASP.NET 5.0 改用全新的專案架構 (*.kproj)
• ASP.NET MVC 6
– 核心觀念與架構都沒變，僅新增幾個小功能
• 建議多學點前端工程的技能 (大勢所趨)

47. 聯絡資訊
• The Will Will Web
記載著 Will 在網路世界的學習心得與技術分享
– http://blog.miniasp.com/
• Will 保哥的技術交流中心 (臉書粉絲專頁)
– http://www.facebook.com/will.fans
• Will 保哥的噗浪
– http://www.plurk.com/willh/invite

48. ASP.NET MVC 6 相關連結
http://bit.ly/aspnetmvc6