Weitere ähnliche Inhalte Ähnlich wie Asp.net mvc 6 新功能初探 (20) Asp.net mvc 6 新功能初探3. Agenda
• 從 ASP.NET vNext 來看.NET 2015
• 為什麼要重新設計 ASP.NET?
• 現有 ASP.NET (問題/限制)
• ASP.NET 5 關鍵性的改進
• ASP.NET 5 的專案結構
• ASP.NET 5 的執行環境
• MVC 6 新增功能
• DI in MVC 6
• 移轉 ASP.NET MVC 5 到 ASP.NET MVC 6?
• 未來技術更多更雜,開發人員因應這股技術浪潮呢?
8. ASP.NET 5 跟 MVC 6 有什麼關係?
• ASP.NET 5 是一種開發模型的轉變
• 目前 ASP.NET 5 只提供 MVC 的框架
• 目前預覽版本裡只有 C# 框架
9. ASP.NET 的發展歷史
• 1996 – ASP
• 2002 – ASP.NET Web Form, Web Services
• 2008 – ASP.NET MVC 1
• 2010 – ASP.NET MVC 2
• 2011 – ASP.NET MVC 3, Web Pages
• 2012 – ASP.NET MVC 4, Web API
• 2013 – ASP.NET MVC 5, SignalR
• 2015 – ASP.NET 5, MVC 6
10. ASP.NET 5 三種專案介紹
• ASP.NET Web Application
建立 ASP.NET 5 網站應用程式
• ASP.NET 5 Class Library
建立與 ASP.NET 5 相容的類別庫
• ASP.NET 5 Console Application
建立使用 K 命令列工具的主控台應用程式
14. Current ASP.NET Stack
Windows Server
IIS
.NET Framework
ASP.NET Web
Forms
MVC Web API
System.Web
HTTP
Modules
HTTP
Handlers
Request
Pipeline
Caching
Session
State
15. 現有 ASP.NET (問題/限制)
• 只能 Run 在 IIS
• 與 System.Web 相依
• Web 技術發展速度比 .NET Framework 還快
• 要再優化執行環境有困難
• 無法跨多個平台 (Windows...)
• 不是雲端最佳化...
Cache & Session 不能夠平行擴充,不符合雲端 Scale out 設計理念
18. Power of Katana
• 新的要求管道(request pipeline)都源自Katana專案,OWIN
Modularity – 新的模組以更小更輕量化為優先
Flexibility – 為不同的應用程式加入需要的 Middlewares
Performance – 所需要的運算資源更小
Scalability – 根據不同的需求擴展需要的 Middlewares
Portability – 可以在任何平台執行你的應用程式
19. ASP.NET 5 關鍵性的改進
• OWIN, bye bye system.web
• 跨平台 (cross-platform)
• .NET Framework 不再包山包海 (輕量化)
• .NET Framework 會 Packages 化
• 易於被安裝 (可攜性提高)
• .NET Core CLR 沒有 GAC
• 開放 (Open Source)、容易開發、新的專案結構
• 雲端最佳化
• MVC6, POCO Controller, DI
• 吸引其他平台的開發者
21. ASP.NET 5 的執行環境
• ASP.NET 5 有真正「跨平台」的執行環境
Full .NET CLR
就是原本的.NET Framework 4.5/4.6
Core CLR
KRE 是執行環境
將.NET Framework 組件 Packages 化 化
Cross-Platform
真正跨多平台
官方會推出跨平台的KRE
25. ASP.NET 5 的專案結構 (1)
• (你的專案).kproj
• Dependency
Bower
Bower 是 Twitter 所推出的一種解決安裝、管理、打包 .js/JavaScript、CSS ,
與管理與相依性的工具。
安裝 Bower 需要 npm 執行引擎
更詳細關於 Bower 相關資訊可到官網:http://bower.io/
NPM (Node Package Manager)
Node.js 的套件管理員,如果你是前端工程師應該很熟悉,因為你可以透過
bower它來進行前端 CSS 與 JS 的安裝,再使用 grunt 進行自動化的打包與壓縮
前端 CSS 與 JS的作業。
26. ASP.NET 5 的專案結構 (2)
• wwwroot
存放所有網站使用到的靜態檔案,如:圖片、CSS、JavaScript 檔案
解決了以往程式檔案與靜態檔案放在一起的問題
同時,它也是程式執行的起點 (根)
• Config.json
取代以前 web.config 設定 ConnectionString與AppSetting
• Project.json
取代以前 web.config,定義專案使用到的組件相依性
• Gruntfile.js
透過它,在工作執行器裡自動化編譯CoffeeScript、TypeScript、打包CSS/JS等作業
• Package.json
管理 npm 的套件清單,這裡你會常看到在這裡 grunt 工作執行器等套件
28. 什麼是 Grunt
• 以 Node.js 為基礎所開發的命令列工具
• 將一些
• 並且將這些工作由 task runner來依序處理
34. 使用 Task Runner Explorer 輸出 .js/.css
• 在 Visual Studio 2015 的選單 View –> Other Windows –> Task
Runner Explorer
36. 所謂的 K?
• 用來管理 ASP.NET 5 的執行環境的工具
• 可分為三類:
KVM (K Version Manager)
KRE (K Runtime Environment)
KPM (K Package Manager)
K
37. KVM (K Version Manager)
• K 的版本管理工具
• 因為同一台可以安裝各種版本的 KRE 執行環境
• 支援 x86/x64 與 .NET CLR/.NET Core CLR
Kvm list
38. 安裝 KRE
• 要安裝 KRE 你得先安裝 KVM
• 安裝 KVM 可透過 PowerShell 命令來安裝
@powershell -NoProfile -ExecutionPolicy unrestricted -Command "iex ((new-object
net.webclient).DownloadString('https://raw.githubusercontent.com/aspnet/Home/master/kvminstall.ps1'))"
40. KRE (K Runtime Emvironment)
• .NET Core CLR 的執行環境
• 背後是由 KLR.EXE 來負責
• KLR 會帶起一個載入器 Loader,由 project.json 內
指定的 Runtime 來決定運行的平台。
46. ASP.NET 5 with MVC 6 新增功能
1. VCs (View Components) 頁面檢視元件
2. (Injecting a service into a view) 服務檢視注入
3. TagHelper 標籤補助方法
50. (Injecting a service into a view) 服務檢視注入
• 在 ASP.NET 5 中大量地使用到 DI (Dependency Injection) 概念
• 只需撰寫如下的程式碼,可在 View 中任意注入此服務類別:
public class StatisticsService
{
public async Task<int> GetCount()
{
return await Task.FromResult(1);
}
public async Task<int> GetCompletedCount()
{
return await Task.FromResult(2);
}
public async Task<double> GetAveragePriority()
{
return await Task.FromResult(0.0);
}
}
51. (Injecting a service into a view) 服務檢視注入
• 從 View 中載入服務類別的方式
• 使用服務類別的方式
• 並記得在 Startup.cs 中的 ConfigureService() 註冊該服務類別
• 服務類別必須是:
Public 類別
非巢狀類別
非抽象類別
53. TagHelper 標籤補助方法
• 取代原本的 HtmlHelper 自定義 HTML 標籤的方式
• 定義標籤輸出
@Html.Label(“UserName”, “UserName:”, new { @class = "col-md-2 control-label" })
[HtmlElementName("myLabel")]
public class MyLabelTagHelper : TagHelper
{
public override void Process(TagHelperContext context, TagHelperOutput output)
{
output.TagName = "";
StringBuilder sb = new StringBuilder();
sb.AppendFormat("<label id={0} name={0}>{1}</label>", "myLabel", "我的
LABEL");
output.Content = sb.ToString();
}
}
57. ASP.NET 5 內建的 DI (Dependency Injection)
• 一切的初始化工作都由 Startup.cs 開始
• Startup
ConfigureService()
Configure()
59. ASP.NET 5 有四種 DI 作法
• 代表不同等級的物件生命週期
1. Instance:不管任何時候,針對特定物件,總是回傳給你
最初建立的物件實體。
2. Transient:每次叫用時,都重新 new 新的物件給你。
3. Singleton:對於目前的容器而言,幾乎就是全域物件。
4. Scoped:針對程式碼特定範圍內,等於 Singleton 物件。
60. Microsoft.Framework.DependencyInjection
• 內建 DI 由Microsoft.Framework.DependencyInjection
所提供的
• 不過目前內建的 DI 容器稍嫌陽春
• 如果建構式有多個參數,內建的 DI 可能就無法滿足
• 可 System.IServiceProvider 這個抽象層介面
• 可參考:
https://github.com/aspnet/Home/issues/218
https://robinsedlaczek.wordpress.com/2014/11/22/dependency-injection-in-asp-net-
vnext/https://github.com/aspnet/DependencyInjection/find/dev
62. 使用 ASP.NET 5 內建的 DI
• 加入 ICustomer 介面
• 加入實作 ICustomer 的 CustomerService 類別
• 記得在 Startup.cs 裡,加入對 ICustomer 與 CustomerService 的註冊
65. MVC 5 移轉到 MVC 6 的方式
• 如果你的應用程式沒有考慮跨其它平台 Linux、UNIX、MAC OS 等
• 你並不需要做移轉這件事,可繼續執行在.NET Framework 4.6 的
Full .NET CLR 中
• 若真要移轉,你得改變程式裡,用到與 System.Web 相依的部分
• 移轉 ASP.NET MVC 5 改變幅度最小
• 步驟
改使用 project.json 加入相關參考
改使用 config.json 設定 ConnectionString
在 Startup.cs 加入需要使用的 Middleware 服務,註冊需要的介面
改用 bower 安裝 bootstrap & jquery 前端元件
透過 K 來進行 Code-First 的 add migration 作業
68. 對於技術只是工作?熱情?
• 你對於自己的工作是不是充滿熱情?
• 對於吸收新知是不是充滿興趣?
• 你是不是偶而會了解產業脈動?市場需求?不要只是看技術資訊。
• 技術或許更多更雜
但『服務』、 『人』才是重點
眼光要遠、洞察力、投資報酬率?
多與其他的開發人員互動 (twMVC, Study4, SQL PASS...)
• 回到技術面,平台不再是問題
多了解其他平台吧 Linux, Unix, OS X, AIX 等等
了解一些前端的開發技術吧,比如早就跨多個平台的 JavaScript/HTML5, 以
及 AngularJS
未來,服務會是重點
多了解雲端的開發吧
71. 相關連結
• ASP.NET 5 相關連結
http://www.asp.net/vnext
http://katanaproject.codeplex.com/
http://blogs.msdn.com/b/dotnet/archive/2014/12/04/introduci
ng-net-core.aspx
http://owin.org/
https://msdn.microsoft.com/en-us/magazine/dn879354.aspx
72. Summary
• 不一定只能 Run 在 IIS
• 目前內含MVC 6 框架,沒有 WebForm 的框架
• 移除掉原本與Windows & IIS 綁的太緊的組件
• Run Any Host, Any Platform
• DI 相依性注入
• 使用新的 Roslyn (羅斯林) 編譯器
• 開源 (Open Source),並發布在 GitHub 平台
• 引進 Bower & Grunt
• 雲端最佳化 (.NET Core)
Hinweis der Redaktion 以往 .NET Framework 包山包海,每當需要一個縮小版的執行環境,就得推出一個精簡版的 .NET Framework,如之前的 Silverlight、Windows Phone 等,就是一個例子。
之所以會重新設計 ASP.NET 是因為這麼多年以來,.NET Framework 不斷地一直增加功能,而許多應用程式不見得都會使用到 .NET Framework 的所有功能,而且目前的設計似乎如果要使用.NET Framework 來撰寫、或是執行 ASP.NET 的應用程式時,就得在系統中安裝.NET Framework,微軟認為,未來,如果開放會是主流,那麼 .NET Framework 也不該與作業系統綁得太緊,更不應該內建在 Windows 裡, 由這張圖可以看見,目前的 ASP.NET 框架的組成,有 MVC、現有的 Web Form、Web API 等等,相關的底層建構在 HTTP Modules、HTTP Handlers、Request Pipeline、Caching、Session 等機制,這些功能,當然也是由 .NET Framework 內所提供,只是部分功能,[] [] [] 與 IIS 的運作方式相依太深 (也就是 System.Web)。 Cache & Session 不能夠平行擴充,不符合雲端 Scale out 設計理念。 新的 ASP.NET 5 可以看見,輕量化不少,原有 的 .NET CLR 也還存在,全新的 .NET Core CLR 則可以部署在各種平台,Host 是基於 OWIN 所開發的的 (代號為:Katana) 的 Host, 使用了 Katana 增強的以下的特性 .NET Core 的體積變得更小了、你可以為你的每一個應用程式 部署 [專屬] 的 .NET Framework (BCL) ,且用多少,裝多少。 如圖中,這是一個 從 Code 編輯,到 Build (編譯)、Debug 偵錯 的一個過程,這邊我們可以看到 Roslyn 自動將你的 程式碼 編譯 成 IL,接著 ASP.NET 5 會被 下一代的 x64 JIT (RyuJIT) 載入並執行。
.NET代碼生成的團隊一直致力於一個新的,下一代的x64編譯器,代號為RyuJIT。這種新的JIT是快一倍,這意味著與RyuJIT編譯應用程序啟動更快的30%(時間花費在JIT編譯器的啟動時間只有一個組成部分,所以應用程序不能正常啟動快兩次即可,因為JIT的兩倍快)。 有安裝 Visual Studio 2015 CTP 的朋友應該就會發現 ASP.NET 5 的專案結構很不一樣,原本你所熟悉的 web.config 不見了,當然有其他取而代之的項目 project.json & config.json,這是為了支援目前廣泛的 Open Source 的作法。 編譯 CoffeeScript、TypeScript、JavaScript
編譯 LESS 到 CSS
打包/壓縮) 後的 .js 與 .css 的存放位置,下方的 grunt.registerTask("default", ["bower:install"]); 是表示註冊一個 default 的 task 如上 grunt.initConfig 的設定是表示 (打包/壓縮) 後的 .js 與 .css 的存放位置,下方的 grunt.registerTask(“default”, [“bower:install”]); 是表示註冊一個 default 的 task,要執行這個 task 只要在專案目錄下出入 grunt.
那麼它會將 (打包/壓縮) 後的 .js 與 .css 放置在 wwwroot\lib 資料夾下面。 它會將 (打包/壓縮) 後的 .js 與 .css 放置在 wwwroot\lib 資料夾下面 如果 Loader 的對象是 ASP.NET 5 的應用程式,那麼再交由對應的 Host Services 來(執行/掛載)該應用程式。
如要安裝 KRE 你得先安裝 KVM,安裝 KVM 可透過 PowerShell 命令來安裝,或是在命令提示字元裡執行: 他不需要從原本的 Controller 的 ViewResult 一起回傳,甚至可以自己有一個小型的 Controller ,所以 VCs 不會跟主要 View 的 Controller 有相依性,所以他可以解決我們以前用 Partial View 不容易解決的問題
如:
動態的互動選單
互動購物車
登入頁簽
.........等等 IApplicationBuilder
註:在 ASP.NET 5 新的管線服務裡,所會使用到的middleware服務,一切的初始化工作都由 Startup 來進行,且它會先呼叫 ConfigureService 方法後,再呼叫 Configure 方法。
由 ASP.NET 5 框架主動呼叫
比如 A 公司收購了 B 公司
了解一些社會現象 你可以在偵錯時,監控你應用程式內部記憶體的使用量,是否有 Memory Leaks 的情況,甚至是 Dump Memory 下來,這些在以前都是得要依靠另外安裝 Microsoft Debug Tools 才做得到的,現在都在 Visual Studio 中就提供這些功能。 在早期的網頁設計中javascript的重要性很低,通常只是拿來讓網頁下雪阿,彈出個視窗等等並不是很重要的功能,連javascript的發明者都認為javascript是個失敗的產品,但在進入web2.0時代後Javascript 頓時成了顯學,大量的javascript函式庫出現,像是jQuery、extJS等等,javascript 的重要性也比之前提升很多。而因為javascript有一些開發者就開始想像如果有一天整個網頁都能夠只用javascript來開發那一定很棒,因此node.js誕生了。 所以您必須先安裝 node.js,安裝好 node.js 後 npm 工具就包含在其中了。
接著再使用 Node.js command prompt 來安裝 Bower NPM 是 (Node Package Manager) 的縮寫,這是 Node.js 的套件管理員。bower & grunt 這兩個工具可透過 npm 來安裝。
Reference :原本的 NuGet 也還是存在,但改由 project.json 管理套件相依性。所以原本的 Reference 視窗在 ASP.NET 5 的專案結構中不能使用。
由於 Bower 在安裝 Web Package 套件時,是從 Github 下載 Web Package 的,也就是說如果你的 bower 要能夠運作,你得先將 git for Windows 裝起來。 ASP.NET 5導入了一個新的、模組化的HTTP 要求管道(request pipeline),所以您可以只加入所需要的元件(而不用包山包海全部放進來)。 自動判別 Session 該寫到哪 (Cloud First)