知識點：理解 ASP.NET 的(de)概念和(hé / huò)優勢、 會創建 ASP.NET Web Form 程序、 理解 ASP.NET Web Form 程序的(de)執行階段、 會使用代碼内嵌和(hé / huò)代碼後置兩種方式進行編碼。

1、網站開發基礎了(le／liǎo)解

1.1 網站開發各環節組成

1.2 開發網站需要(yào / yāo)的(de)知識結構

（1）網站開發前台頁面技術

• 頁面設計：HTML、DIV+CSS
• 頁面特效：JavaScript、jQuery

（2）OOP編程核心公共技能

• C#基礎語法與程序邏輯
• 面向對象編程基礎
• SQL Server數據庫開發基礎
• ADO.NET數據訪問技術

（3）網站開發後台專門技術

• ASP.NET開發基礎
• 基于(yú)WebForm開發企業網站
• MVC框架學習
• EF框架學習
• 基于(yú)MVC+EF開發企業網站

2、 ASP.NET概述

通過學習 HTML+CSS我們會制造靜态頁面了(le／liǎo)。靜态頁面的(de)最大(dà)的(de)優點是(shì)速度快，可以(yǐ)跨平台，跨服務器。在(zài)早期網站建設大(dà)多都是(shì)靜态頁面制作的(de)，靜态頁面的(de)網址是(shì)以(yǐ).HTM、HTML 等爲(wéi / wèi)後綴的(de)，在(zài)這(zhè)種靜态網站上(shàng)也(yě)可以(yǐ)由動态效果，像滾動字幕，GIF 格式的(de)動畫，或是(shì)FLASH，這(zhè)些視覺上(shàng)的(de)動态效果并不(bù)就(jiù)是(shì)動态頁面，他(tā)們是(shì)截然不(bù)同的(de)概念。所謂動态網頁，就(jiù)是(shì)說(shuō)該網頁文件不(bù)僅具有 HTML 标記，而(ér)且含有服務器端的(de)腳本程序代碼， 實現操作數據庫、實現交互等功能。動态網頁能根據不(bù)同的(de)時(shí)間，不(bù)同的(de)來(lái)訪者顯示不(bù)同的(de)内容，而(ér)且動态網站更新方便，一般在(zài)後台直接更新的(de)，并不(bù)需要(yào / yāo)人(rén)工手動修改代碼。

制造動态頁面的(de)主要(yào / yāo)技術有 ASP.NET、JSP 、 PHP 等，本課程主要(yào / yāo)講解 ASP.NET 技術。本章，我們初步認識ASP.NET，了(le／liǎo)解它的(de)概念和(hé / huò)優勢，掌握 ASP.NET Web Form 的(de)編碼方式等内容。

2.1 ASP.NET的(de)概念

開發 Web 程序的(de)主要(yào / yāo)技術有 ASP.NET、JSP 和(hé / huò) PHP。其中 ASP.NET 是(shì)微軟公司整個(gè).NET Frame Work 的(de)一部分，使用它可創建動态交互的(de) Web 頁面。其中，ASP 的(de)全稱是(shì) Active Server Pages（動态服務器頁面），是(shì)一種使嵌入在(zài)網頁中的(de)服務器腳本可由服務器執行的(de)技術。

ASP.NET、.NET Frame Work 及對應的(de)集成開發環境 Visual Studio 一直以(yǐ)來(lái)都在(zài)不(bù)斷地(dì / de)更新，這(zhè)些更新包括.NET 框架類庫的(de)不(bù)斷擴充、不(bù)斷納入新的(de)語言特性等。.NET Frame Work 2.0 的(de)出(chū)現标志着.NET Frame Work 真正走向成熟，同時(shí)也(yě)說(shuō)明了(le／liǎo) ASP.NET 技術的(de)成熟與穩定。爲(wéi / wèi)了(le／liǎo) 支持 ASP.NET 的(de)開發，Visual Studio 也(yě)在(zài)不(bù)斷地(dì / de)升級版本。

2.2 ASP.NET的(de)優勢

作爲(wéi / wèi)微軟公司.NET Frame Work 的(de)一部分，ASP.NET 技術延續了(le／liǎo) Microsoft 的(de)一貫優勢，即開發效率高、強大(dà)的(de) IDE（Integrated Development Environment, 集成開發環境）設計工具的(de) 支持。除了(le／liǎo)這(zhè)些，ASP.NET 還具備以(yǐ)下優勢。

1）與浏覽器無關

無論使用何種版本的(de)浏覽器訪問 ASP.NET 應用程序，呈現的(de)結果都一緻。ASP.NET 遵循 W3C标準化組織推薦的(de) XHTML 标準生成頁面的(de)代碼，而(ér) XHTML 标準被目前所有主流浏覽器支持。

2）編譯後執行，運行效率高

代碼編譯是(shì)指将代碼“翻譯”成機器語言。ASP.NET 先把代碼編譯爲(wéi / wèi)微軟中間語言，然後由即時(shí)編譯器進一步編譯成機器語言。編譯好的(de)代碼再次運行時(shí)不(bù)需要(yào / yāo)重新編譯，極大(dà)地(dì / de)提高了(le／liǎo)Web 應用程序的(de)運行效率。

3）易于(yú)部署

将必要(yào / yāo)的(de)文件複制到(dào) Web 服務器上(shàng)，ASP.NET 應用程序即可以(yǐ)部署到(dào)該服務器上(shàng)。不(bù)需要(yào / yāo)重新啓動服務器，甚至替換運行的(de)編譯代碼時(shí)，也(yě)不(bù)需要(yào / yāo)重新啓動 Web 服務器。

4）豐富的(de)可用資源

ASP.NET 可利用整個(gè).NET 平台的(de)資源，包括.NET 框架類庫和(hé / huò)數據訪問解決方案等。ASP.NET本身提供了(le／liǎo)大(dà)量的(de)控件，包括與傳統 HTML 代碼對應的(de) HTML 控件和(hé / huò)重新封裝的(de) Web 控件。

5）支持多層開發

ASP.NET 支持多層開發,從而(ér)改變原來(lái) Web 項目開發代碼混亂，難以(yǐ)管理的(de)狀況,使得 Web 項目開發邏輯更清晰,管理維護更方便。

6）邏輯代碼和(hé / huò)設計代碼分離

ASP.NET 将邏輯代碼放于(yú)單獨的(de)文件中，将 Web 界面元素和(hé / huò)程序邏輯分開顯示，這(zhè)樣可以(yǐ)是(shì)代碼結構更加清晰，方便維護和(hé / huò)閱讀。

3、創建第一個(gè)ASP.NET程序

3.1 ASP.NET WebForm的(de)概念

ASP.NET WebForm 是(shì)微軟的(de)開發團隊爲(wéi / wèi)開發者設計的(de)一個(gè)在(zài)可視化設計器中拖放控件、編寫代碼響應事件的(de)快速開發環境。在(zài) WebForm 中，微軟将 ASP.NET 的(de)開發模型與 WinForm 統一起來(lái)，提供了(le／liǎo)類似于(yú) WinForm 的(de)控件、事件驅動模型，使 ASP.NET 應用程序的(de)開發體驗與 Win Form應用程序高度一緻。

在(zài).NET Frame Work 3.5 SP1 發布前，ASP.NET WebForm 一直是(shì)微軟官方提供的(de)唯一的(de) ASP.NET開發框架。在(zài).NET Frame Work 3.5 SP1 中，微軟提供了(le／liǎo)另一種 ASP.NET 的(de)開發框架即 ASP.NET MVC。

3.2 創建WebForm應用程序

開發 ASP.NET Web Form 程序的(de)一般過程：創建解決方案(.sln) → 添加網站 → 添加 Web → 窗體 → 編寫代碼 → 調試運行。

創建 ASP.NET Web Form 程序，實現當用戶點擊按鈕，頁面輸出(chū)“Hello World”的(de)功能。實 現步驟如下所述。

步驟 1：打開 Visual Studio 2017，點擊菜單欄【文件】——【新建項目】， 在(zài)彈出(chū)的(de)【新建項目】窗口中，在(zài)左側展開“其他(tā)項目類型”列表，在(zài)列表中選擇“Visual Studio 解決方案”。在(zài)窗口頂端的(de).NET 框架版本下拉列表中選擇“.NET Framework4.5”，輸入解決方案名稱和(hé / huò)位置後， 單擊【确定】按鈕。

步驟 2：在(zài)“解決方案資源管理器”窗口中，右擊“解決方案”，在(zài)快捷菜單中選擇“添加” → “新建項目”，如圖所示。

步驟 3：彈出(chū)【添加新項目】窗口，在(zài)窗口的(de)左側選擇開發語言是(shì)“Visual C#”，在(zài)窗口的(de) 右側選擇“ASP.NET Web應用程序（.NET 應用程序）”，最後給您的(de)Web站點起個(gè)名字，這(zhè)個(gè)案例裏，我們起的(de)是(shì)“HelloWeb”，并浏覽選擇 Web 站點的(de)保存位置後，最後單擊【确定】按鈕

在(zài)彈出(chū)的(de)【新建ASP.NET Web應用程序 - HelloWeb】窗口中，點擊選擇【空】，然後再單擊【确定】按鈕

在(zài)解決方案中添加了(le／liǎo)名稱爲(wéi / wèi)“HelloWeb”的(de)站點後，解決方案資源管理器中的(de)目錄結構如圖所示。Web.config 是(shì) XML 文件，用于(yú)網站的(de)配置。

步驟 4：在(zài)解決方案裏，右擊“HelloWeb”的(de)網站，在(zài)快捷菜單中選擇“添加” → “Web窗體”。

此時(shí)會彈出(chū)一個(gè)【指定項名稱】，默認名稱WebForm1，單擊【确定】按鈕。

此時(shí)，會自動生成一個(gè)WebForm1.aspx文件，并在(zài)VS程序中打開，“WebForm1.aspx”即爲(wéi / wèi)創建的(de)第一個(gè) Web 頁面。

步驟 5：在(zài)“WebForm1.aspx”頁面，進行html代碼編寫，這(zhè)裏隻簡單的(de)寫了(le／liǎo)title标簽設置網頁标題，并在(zài)body裏輸出(chū)一句話“Hello World”。

步驟 6：啓動運行調試，點擊菜單欄【啓動】

在(zài)浏覽器中查看網頁效果。

3.3 快速創建WebForm應用程序

将上(shàng)面的(de)步驟簡化。

第一步：打開VS後，在(zài)菜單欄單擊【文件】——【新建項目】，在(zài)彈出(chū)的(de)【新建項目】窗口中，依次選擇左側的(de)Visual C#，中間部分的(de).NET 框架版本下拉列表中選擇“.NET Framework4.5”，程序選擇“ASP.NET Web應用程序（.NET 應用程序）”，給自己的(de)項目起個(gè)名字，浏覽好項目存放的(de)位置，可以(yǐ)選擇新創建一個(gè)解決方案，最後單擊【确定】按鈕。

在(zài)彈出(chū)的(de)【新建ASP.NET Web應用程序 - HelloWeb】窗口中，點擊選擇【空】，然後再單擊【确定】按鈕。

第二步：在(zài)解決方案裏，右擊“HelloWorld”的(de)網站，在(zài)快捷菜單中選擇“添加” → “Web窗體”。

此時(shí)會彈出(chū)一個(gè)【指定項名稱】，默認名稱WebForm1，可以(yǐ)根據需要(yào / yāo)自行修改項名稱，這(zhè)裏修改爲(wéi / wèi)“index”，單擊【确定】按鈕。

第三步：在(zài)解決方案裏，右擊“index.aspx”，在(zài)快捷菜單中選擇“查看設計器”。

第四步：在(zài)設計器界面，從工具箱裏依次拖入Label控件和(hé / huò)Button控件，并在(zài)屬性面闆修改他(tā)們的(de)ID屬性、Visible屬性、Text屬性。（注意：如果VS界面沒有找到(dào)工具箱、屬性面闆，可以(yǐ)在(zài)菜單欄視圖裏找到(dào)他(tā)們）

第五步：在(zài)設計器界面，雙擊【确定】按鈕，進入代碼文件，在(zài)按鈕的(de)Click事件中編寫代碼：

        protected void BtnSure_Click(object sender, EventArgs e)
        {
            lblInfo.Visible = true;
            lblInfo.Text = "hello world!";
        }

第六步：啓動運行調試，點擊菜單欄【啓動】

總結：ASP.NET WebForm 的(de)應用程序與大(dà)一所學的(de) WinForm 的(de)應用程序類似，都使用了(le／liǎo)控件+事件驅動模型，這(zhè)正是(shì)使用 ASP.NET WebForm 技術編寫 Web 程序的(de)優秀之(zhī)處。

4、 ASP.NET 程序的(de)運行機制

4.1 ASP.NET 程序的(de)執行階段

ASP.NET 是(shì)一個(gè) Web 開發模型，能創建動态可交互的(de) Web 頁面。ASP.NET 程序的(de)執行方式一般分爲(wéi / wèi)以(yǐ)下幾個(gè)階段：

(1) 使用動态 Web 開發技術,如 ASP.NET，編寫 Web 應用程序，即動态頁面，并部署到(dào) Web服務器端；

(2) 客戶端通過浏覽器請求該動态頁面；

(3) Web 服務器定位該 Web 應用程序；

(4) Web 服務器根據客戶端的(de)請求，對 Web 應用程序進行編譯或解釋，并生成 html 流。将生成的(de) html 以(yǐ)流的(de)形式返回給客戶端；

(5) 客戶端浏覽器解釋 html 流，并顯示爲(wéi / wèi) Web 頁面。

網站的(de)運行原理：

當請求發送至 Web 服務器并被其接收後，服務器會判斷請求文件的(de)類型：

• 如果是(shì)靜态文件， 如 html、jpg、gif 和(hé / huò) txt 等，服務器會自行根據目錄找到(dào)文件并發送給客戶端。
• 如果是(shì)動态文件， 如 aspx，服務器會通過 aspnet_isapi.dll 将請求轉交給ASP.NET 運行時(shí)環境進行處理。

ASP.NET 會先檢查代碼是(shì)否已經被編譯。如果沒有，則将代碼編譯成 MSIL（Microsoft Intermediate Language， 微軟中間語言），然後由 JIT((Just-in-time：即時(shí))編譯器進一步編譯成機器語言執行。其中，JIT 并非一次完全編譯，而(ér)是(shì)調用哪部分代碼就(jiù)編譯哪部分，這(zhè)樣用戶等待時(shí)間更短。同時(shí)，編譯好的(de)代碼再次請求運行時(shí)不(bù)需要(yào / yāo)重新編譯，極大(dà)提高了(le／liǎo) Web 應用程序的(de)性能。這(zhè)種先将代碼編譯成中間語言，執行時(shí)再編譯成機器語言的(de)過程稱爲(wéi / wèi)二次編譯。

4.2 ASP.NET 的(de)服務器

ASP.NET 程序需要(yào / yāo)使用 Web 服務器作爲(wéi / wèi)發布平台，ASP.NET 使用 IIS 作爲(wéi / wèi) Web 服務器。 IIS(Internet Information Service,Internet 信息服務)是(shì)微軟開發的(de) Web 服務器，它基于(yú) Windows 操作系統，操作方便，功能強大(dà)。

實際上(shàng)，我們在(zài)開發階段并不(bù)用配置 IIS，我們隻需要(yào / yāo)像 WinForms 開發那樣編碼，然後單擊運行就(jiù)可以(yǐ)了(le／liǎo)。微軟在(zài) Visual Studio 中内置了(le／liǎo)一個(gè)輕量級的(de) Web 服務器，運行應用程序時(shí)，将會默認啓動它，并在(zài)狀态欄中出(chū)現圖标，右擊該圖标，在(zài)彈出(chū)的(de)快捷菜單中選擇“顯示 所有應用程序”選項，可以(yǐ)查看當前正在(zài)運行的(de)站點信息，如圖所示。

4.3 ASP.NET WebForm的(de)事件驅動模型

ASP.NET WebForm 和(hé / huò) WinForm 一樣，都使用了(le／liǎo)控件+事件驅動模型。但 ASP.NET WebForm 實現的(de)本質完全不(bù)同。在(zài) ASP.NET WebForm 中由用戶操作引發的(de)事件中，觸發事件的(de)操作在(zài)客戶端，處理有可能在(zài)服務器端。在(zài)實際應用中，客戶端和(hé / huò)服務器端往往是(shì)不(bù)同的(de)機器；而(ér)在(zài) WinForm 中，事件的(de)觸發和(hé / huò)處理都在(zài)執行程序的(de)機器上(shàng)進行。

在(zài) ASP.NET WebForm 中，用戶操作觸發一個(gè)事件有可能會産生一次新的(de) HTTP 請求。如果産生新的(de)請求，那麽服務器端在(zài)對請求應答時(shí),對用戶觸發的(de)事件進行處理,将處理結果生成新的(de)頁面傳遞給浏覽器，浏覽器自動刷新，重新加載整個(gè)新的(de)頁面，我們把這(zhè)個(gè)過程稱爲(wéi / wèi)回發（postback）。

示例練習：WebForm 和(hé / huò) WinForm實現對比

第一步：在(zài)已有的(de)項目中，新添加一個(gè)Web窗口，并在(zài)設計器界面，拖放一個(gè)Button控件，同時(shí)修改ID屬性爲(wéi / wèi)“btnAdd”。再拖放一個(gè)Label控件，修改其ID屬性爲(wéi / wèi)“lblInfo”。

第二步：雙擊【Button】按鈕，進入Click事件代碼編寫

        int i = 0;
        protected void btnAdd_Click(object sender, EventArgs e)
        {
            i++;
            lblInfo.Text = "累計到(dào)：" + i;
        }

第三步：啓動運行程序，在(zài)頁面，單擊【Button】按鈕，觀察累計變化。

第四步：在(zài)當前解決方案中，新添加一個(gè)窗體項目

第五步：在(zài)窗體界面，添加兩個(gè)控件Button和(hé / huò)Label控件

第六步：雙擊Button控件，進入代碼編寫模式

        int i = 0;
        private void button1_Click(object sender, EventArgs e)
        {
            i++;
            label1.Text = "累計到(dào)：" + i;
        }

第七步：在(zài)解決方案資源管理器裏，右鍵單擊“WindowsFormsApp1”，在(zài)彈出(chū)的(de)快捷菜單項裏單擊【設爲(wéi / wèi)啓動項】

第八步：啓動運行，預覽，在(zài)窗體界面，單擊【Button】按鈕，觀察累計變化。

案例思考：在(zài) WinForm 和(hé / huò) WebForm 兩種程序中，輸入同樣的(de)代碼，爲(wéi / wèi)什麽執行的(de)結果不(bù)一樣?

5、 ASP.NET WebForm 的(de)編碼方式

ASP.NET 有兩種編碼方式：代碼内嵌和(hé / huò)代碼後置。

5.1 代碼内嵌

把所有的(de)代碼都寫在(zài).aspx 文件中，不(bù)需要(yào / yāo).cs 文件，然後把 c#代碼寫在(zài)<% %>或者<script language=”c#” runat=”server”></script>之(zhī)間。

示例練習：使用代碼内嵌的(de)方式在(zài)頁面上(shàng)顯示 1 到(dào) 100 之(zhī)間的(de)和(hé / huò)。

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="WebApplication1.WebForm1" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title></title>
</head>
<body>
    <form id="form1" runat="server">
        <div>
            <script language="c#" runat="server">
                int sum = 0;
          </script>
          <%for (int i = 1; i <= 100; i++)
                {
                      sum += i;
                }
            %>
        <h2>1到(dào)100之(zhī)間的(de)和(hé / huò)是(shì)：<span style="color:red"><%=sum %></span></h2>
        </div>
    </form>
</body>
</html>

頁面執行效果：（注意：初次編譯時(shí)，速度會比較慢）

代碼分析：<%=sum %>是(shì)<%Response.Write(sum)%>的(de)簡化，表示在(zài)頁面輸出(chū)變量 sum，Response 是(shì) ASP.NET 的(de)系統對象，會在(zài)下一章學習。

5.2 代碼後置

代碼後置是(shì)微軟的(de)一項技術，是(shì)編寫 ASP.NET 常用的(de)編碼方式。具體方式見本章節的(de)第一個(gè)示例，在(zài)該示例中，頁面文件.aspx 和(hé / huò)代碼文件.cs 兩個(gè)文件關聯構成一個(gè)頁面。一般情況下，.aspx 的(de)源文件中沒有 c#代碼，隻有控件和(hé / huò) HTMl 代碼，而(ér)在(zài).cs 文件中編寫相關的(de)服務器端代碼，這(zhè)種将控件和(hé / huò)布局與代碼進行分離的(de)技術稱爲(wéi / wèi)代碼後置。代碼後置的(de)好處就(jiù)是(shì)代碼和(hé / huò)頁面内容分離，使代碼更清晰。

示例練習：使用後置代碼的(de)方式，在(zài)頁面上(shàng)輸出(chū) 1 到(dào) 100 之(zhī)間的(de)和(hé / huò)。

操作步驟：在(zài)上(shàng)一個(gè)示例中，在(zài)項目方案資源管理器中，新添加一個(gè)Web窗體，并雙擊打開他(tā)對應的(de).cs文件，

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;

namespace WebApplication1
{
    public partial class WebForm2 : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {
            int sum = 0;
            for(int i =1; i<=100; i++)
            {
                sum += i;
            }
            Response.Write("<h2>1到(dào)100之(zhī)間的(de)和(hé / huò)是(shì)：<span style='color: red'>"+sum+"</span></h2>");
        }
    }
}

代碼分析：代碼中“Page_Load”方法是(shì)在(zài)加載頁面時(shí)觸發執行的(de)，即由 Page 對象的(de) Load 事件觸發執行，Page 對象是(shì) ASP.NET 的(de)系統對象，會在(zài)下一章學習。

運行某個(gè)頁面時(shí),可以(yǐ)在(zài)解決方案資源管理器中右鍵單擊頁面，在(zài)彈出(chū)的(de)快捷菜單中選擇“在(zài)浏覽器中查看”；也(yě)可以(yǐ)右鍵單擊需要(yào / yāo)作爲(wéi / wèi)起始頁的(de)文件，在(zài)彈出(chū)的(de)快捷菜單中選擇“設爲(wéi / wèi)起始頁”，按“F5”鍵運行網站。

===========這(zhè)裏是(shì)結束分割線==============