Se ha denunciado esta presentación.
Utilizamos tu perfil de LinkedIn y tus datos de actividad para personalizar los anuncios y mostrarte publicidad más relevante. Puedes cambiar tus preferencias de publicidad en cualquier momento.

ASP.NET MVC 6 新功能探索

10.235 visualizaciones

Publicado el

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

Publicado en: Software
  • Sé el primero en comentar

ASP.NET MVC 6 新功能探索

  1. 1. ASP.NET MVC 6 新功能探索 多奇數位創意有限公司 技術總監 黃保翕 ( Will 保哥 ) 部落格:http://blog.miniasp.com/
  2. 2. ASP.NET MVC 6 的三個新功能 New Features in the ASP.NET MVC 6
  3. 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. 4. ASP.NET MVC 6: 檢視頁面元件 Demo: View Components
  5. 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. 6. ASP.NET MVC 6: 服務注入 Demo: The @inject
  7. 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. 8. ASP.NET MVC 6: 標籤輔助方法 Demo: The TagHelpers
  9. 9. ASP.NET 5 與 .NET Core 簡介 ASP.NET 5 and .NET Core Introduction
  10. 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. 11. ASP.NET 5 是甚麼? • 一個重新設計的 ASP.NET 框架 ( 目前 ASP.NET 5 還處於預覽階段 ) • 一個精鍊的、可重組的框架, 用來建構網站與雲端應用程式。 • ASP.NET 5 完全開放原始碼, 並且發布於 GitHub 平台。
  12. 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. 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. 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. 15. ASP.NET 5 與舊版的相容性 • ASP.NET 4.5 (ASP.NET MVC 5) 以前的網 站 – 可以不用重寫! – 依然可以跑在 .NET Framework 4.6 上! – 請記得: • ASP.NET 5 是一種開發模型的轉變! • 如果想用到 ASP.NET 5 的新功能特性 – 必須微調部分程式碼與專案架構才能用!
  16. 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. 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. 18. Visual Studio 2015 開發環境介紹 Visual Studio 2015 Development Environment
  19. 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. 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. 21. 全新的專案結構 • 新的專案檔 – *.kproj • 新的資料夾 – wwwroot • 所有靜態檔案 • 新的檔案 – global.json – project.json – config.json • 相依性與參考 – Dependencies • NPM • Bower – References • ASP.NET 5.0 • ASP.NET Core 5.0 • 自動管理套件相依性
  22. 22. 新的專案檔類型 *.kproj • 採用 MSBuild 第 14 版 • 不再需要明確列出加入專案的檔案清單 ( 版控時也將會減少大量的合併衝突機會 ) • 預設在目錄中的專案,都會自動被加進專案 ( 直接把檔案放進目錄即可 ) • 可在 project.json 的 exclude 排除不要編譯 的檔案或目錄
  23. 23. 新的靜態檔案專用資料夾 • wwwroot – 注意:這個目錄才是你的網站根目錄 – 只要是靜態檔案都全部集中在這裡 • JavaScript, Images, CSS, … – 更清楚的關注點分離 • 完整切割前、後端程式碼,目錄結構更乾淨 • 更容易與前端開發流程整合 – 編譯 CoffeeScript 或 TypeScript 到 JavaScript – 編譯 LESS 或 Sass 到 CSS – 最小化與合併 JavaScript 或 CSS 檔案 – 最佳化圖片檔案
  24. 24. NuGet 套件與相依性管理 25
  25. 25. NuGet 套件與相依性管理 • 新的 NuGet 套件管理員 – 支援預覽變更功能 (Preview) – 套件管理主控台依然可用 – 也可手動修改 project.json 的 dependencies • 不再有「加入參考」等動作 – 所有套件相依性的安裝或移除都是自動完成的!
  26. 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. 27. 關於專案中的 *.json 檔案 • project.json – 主要的專案設定檔 – NuGet 套件與相依性都列在這裡 • package.json – 別誤會,這跟之前的 packages.config 完全無關 – 這是 npm 的套件清單 • bower.json – 這是 Bower 的套件清單 • gruntfile.js – 這是 Grunt 的定義檔
  28. 28. 管理 BOWER 套件 Demo: bower install requirejs
  29. 29. 切換不同的 .NET 核心 • 切換目標 KRE 版本 – [專案屬性] -> [Application] -> [Target KRE version] • C# 編輯器中可切換不同 .NET 核心 – API Portability Analyzer - Alpha
  30. 30. 發佈 ASP.NET 5 網站到 Azure WS • 發布流程跟以前一模一樣 • 查看部署後的目錄結構
  31. 31. ASP.NET MVC 6 與 ASP.NET Web API ASP.NET MVC 6 and ASP.NET Web API
  32. 32. ASP.NET MVC 5 與 ASP.NET Web API 2
  33. 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. 34. ASP.NET 5 從核心方面的改變 • 什麼!Global.asax 沒了? • 什麼!Web.config 沒了? – ASP.NET 5 採用全新設計的 HTTP 要求管線 • 只剩 Startup.cs 來定義應用程式特性 – Startup() • 用來設定參數來源 – ConfigureServices() • 使用 ASP.NET 5 內建的 DI 機制進行服務註冊 – Configure() • 當 ConfigureServices() 執行完後會執行這個方法
  35. 35. Startup() • AddJsonFile("config.json") – 從 config.json 讀取參數 • AddEnvironmentVariables() – 從環境變數取得參數(用冒號分隔名稱) • AddIniFile("App_Dataconfig.ini") – 從 INI 設定檔讀取參數 • AddXmlFile("App_Dataconfig.xml") – 從 XML 設定檔讀取參數 • AddCommandLine(args) – 從命令列參數取得參數
  36. 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. 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. 38. ASP.NET MVC 6 錯誤追蹤頁面 Demo
  39. 39. Configure() 2/2 • app.UseStaticFiles() – 使用靜態檔案讀取 ( wwwroot ) • app.UseIdentity() – 使用 ASP.NET Identity 進行身分驗證 • app.UseMvc() – 使用 ASP.NET MVC / ASP.NET Web API – 包含完整路由設定也定義在此
  40. 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. 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. 42. ASP.NET MVC 6 什麼是不變的 • Controllers • ActionResults • Filters • Routing • Model binding • Views (Razor)
  43. 43. 使用 ASP.NET MVC 6 的注意事項 • 少用 HttpContext.Current – 因為全新的 HTTP Request pipeline – 許多 API 都被移入 Middleware 了! • 少用 HttpModules 或 HttpHandlers – 因為全新的 HTTP Request pipeline – 許多 API 都被移入 Middleware 了!
  44. 44. 在 Core CLR 執行環境下的變化 • 以前的 ngen 要改用 crossgen – crossgen = CoreCLR Native Image Generator • 不再有 GAC 的概念!
  45. 45. 總結 Summary
  46. 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. 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. 48. ASP.NET MVC 6 相關連結 http://bit.ly/aspnetmvc6

×