Visual Studio 2010 中的 Web 开发

概述

Microsoft Visual Studio 2010 为 ASP.NET Web 应用程序的开发提供很多新的功能。这些新功能旨在帮助开发人员快速方便地创建和部署质量高且功能全的 Web 应用程序。

目前,Visual Studio 2010 支持 HTML 代码片段。利用这些代码片段,可以生成高质量的代码。Visual Studio 中附带了很多代码片段,开发人员也可以创建自己的代码片段。

Visual Studio 2010 提供的另一个新功能是转换 web.config 文件,以用于部署。Visual Studio 2010 支持一种富配置转换语言,使开发人员可以更改 web.config 文件中的元素,包括连接字符串、文件路径位置和服务地址。

现在,基于 Visual Studio 2010 中的新功能包和部署功能,ASP.NET Web 应用程序的部署更为简洁。可以轻松地将 Web 应用程序发布到构建机器中的特定位置(甚至是 ZIP 文件中),并将其部署到 Visual Studio Web Server 或 Windows Internet Information Server (IIS)。

目标

在本次动手实验中,您将学习如何:

•              使用 HTML 代码片段开发 ASP.NET Web 应用程序页面

•              创建和部署您自己的自定义 HTML 代码片段

•              在跨环境部署 Web 应用程序时,创建和自动转换 web.config。

•              为您的 ASP.NET Web 应用程序创建部署程序包,将应用程序部署到 Visual Studio Development Web 服务器或 Windows Internet Information Server (IIS) 中。

               

练习

本次动手实验由以下练习组成:

•              使用 Visual Studio 2010 中的 HTML 代码片段

•              转换 web.config 文件以便部署

•              打包 Web 应用程序并将其部署到 Visual Studio Development Web Server

•              打包 Web 应用程序并将其部署到 Windows Internet Information Server (IIS)

               

完成本实验的估计时间:60 分钟。

系统要求

您必须拥有以下工具才能完成本实验:

•             Microsoft Visual Studio 2010 Beta 2

•             IIS 7.0

               

               

安装

使用 Configuration Wizard 验证本实验的所有先决条件。要确保正确配置所有内容,请按照以下步骤进行。

注意:要执行安装步骤,您需要使用管理员权限在命令行窗口中运行脚本。

1.            如果之前没有执行,运行 Training Kit 的 Configuration Wizard。为此,运行位于 %TrainingKitInstallationFolder%\Labs\IntroToWF\Setup 文件夹下的 CheckDependencies.cmd 脚本。安装先决条件中没有安装的软件(如有必要请重新扫描),并完成向导。

               

初始材料

这次动手实验包括以下初始材料。

•              Visual Studio 解决方案:本练习为您提供了一个 Visual Studio 解决方案,您可以使用此解决方案作为实验练习的起点。您可以在以下位置找到该解决方案:%TrainingKitInstallFolder%\Labs\WebDevelopment\Source\Ex01-HTMLCodeSnippets\begin\C#\HTMLLab

◦              HTMLLab.sln:本解决方案包含一个简单的 Web 应用程序,该应用程序可用作练习 1 和后续练习的起点。

注意:每个练习都有一个 End 文件夹,其中包含完成练习后生成的解决方案。

注意:在所有包含 <用户名> 标签的路径引用中,用户将使用适当的名称值进行替换。

注意:要验证每个步骤是否正确执行,建议在每次任务结束时生成解决方案。

               

下一步

练习 1:使用 Visual Studio 2010 中的 HTML 代码片段

练习 1:使用 Visual Studio 2010 中的 HTML 代码片段

在本练习中,您将了解如何使用 Visual Studio 2010 中的 HTML 代码片段,还将了解如何创建您自己的自定义 HTML 代码片段。

任务 1 –使用 HTML 代码片段将新 ListView 添加到 HTML 页面中

在本任务中,您将打开一个现有的 ASP.NET Web 应用程序,并使用代码片段将 ListView 控件添加到一个现有 Web 页面中。

1.            导航到 Start | All Programs | Microsoft Visual Studio 2010 | Microsoft Visual Studio 2010。选择 File | Open | Project/Solution…菜单命令。在 Open Project 对话框中,导航到 %TrainingKitInstallFolder%\Labs\WebDevelopment\Source\Ex01-HTMLCodeSnippets\begin\C#\HTMLLab 并选择 HTMLLab.sln 文件。

2.            双击 Solution Explorer 中的 Default.aspx 文件将其打开。查看页面中显示的代码。注意,该页面中包含一个 GridView 控件,其中含有产品 ID。

 

图 1

Default.aspx 中现有的 Grid View 控件

3.            在 Default.aspx 页面中,添加 ListView 控件。将光标放在结束 GridView 标记 (</asp:GridView>) 之后,然后按回车键。按下“<”键调用完成列表。

 

图 2

完成列表

注意:每个完成项旁边的小图标表示完成项的类型:

  • 表示完成项也是一个代码片段关键字
    • 表示一个代码片段关键字
      • 表示一个完成条目

4.            从完成列表中选择 ListView,按下 TAB 键两次插入代码片段。

 

图 3

插入的代码段

5.            要继续进行,您需要添加布局,并设置一个临时占位符。输入以下代码,定义 LayoutTemplate:

XML

<LayoutTemplate>

<table id="itemPlaceholderContainer">

<tr runat="server" id="itemPlaceholder">

</tr>

</table>

</LayoutTemplate>

 

图 4

完成的代码片段

注意:在本任务中,键入“<”字符以调出完成列表。另一种显示该列表的方法为使用 CTRL + J 快捷键。但是,还有一种方法是使用 CTRL + K 和 CTRL + X 快捷键来调用代码片段选取器。在某种程度上,这种方法可能占有一定的速度优势,因为您可以对代码片段进行分组,如下所示:

 

通过选择 ASP.NET 文件夹,并按下 TAB 键,您将会看到一系列特定的 ASP.NET 代码片段: 

您可以按 ESC 键中止此操作。此时,请不要在此页面中添加其他控件。

任务 2 –创建自定义的 HTML 代码片段

在此任务中,您将创建一个自定义的 HTML 代码片段,在 Visual Studio 2010 IDE 内部使用。新的代码片段将创建一个标签控件,其中含有预设的默认值。所有已实现的自定义代码片段都将作为 XML 文件存储在已知目录中。

1.            在 Visual Studio 2010 中,从菜单中选择 File | New | File…,打开 New File 对话框。在 New File 对话框中,从 Categories 中选择 General,从 Templates 中选择 XML File,并单击 Add。

2.            要创建代码片段的结构,您将使用一个现有代码片段。在 XML 文件编辑器中,按下 CTRL + K、CTRL + X 显示代码片段列表。

 

图 5

代码片段列表

3.            从列表中选择 Snippet。一个 XML 代码片段将被插入到文件中。

 

图 6

一个代码段列表的 XML 定义

4.            为显示的 XML 元素提供以下值:

字段

标题

“Address Block”

Shortcut

“AddrBlock”

描述

“XML snippet to create a quick address block.”

代码片段选取器使用 Title 值显示代码片段的名称。完成列表使用 Shortcut 值选择代码片段。

5.            在 <SnippetTypes> 节点下,删除第一个包含 SurroundsWith 值的 <SnippetType> XML 元素。请确保保留了包含 Expansion 值的 <SnippetType> XML 元素。

6.            删除整个 Declarations XML 节点。

7.            从代码片段 XML 元素中,删除包含 CDATA 值的 Code XML 节点。

删除文件顶部的 XML 元素。完成这些操作后,您的代码片段将如下图所示:

XML

<CodeSnippet Format="1.0.0" xmlns="http://schemas.microsoft.com/VisualStudio/2005/CodeSnippet">

<Header>

<Title>Address Block</Title>

<Author>author</Author>

<Shortcut>AddrBlock</Shortcut>

<Description>XML Snippet to create a quick address block.</Description>

<SnippetTypes>

<SnippetType>Expansion</SnippetType>

</SnippetTypes>

</head>

<Snippet>

</Snippet>

</CodeSnippet>

注意:从代码片段中删除的各项所提供的功能为代码片段不需要的功能。要了解有关代码片段属性的更多信息,请参见下面的 MSDN 文章:http://msdn.microsoft.com/en-us/library/ms171418.aspx。

8.            在 Snippet 元素中,添加以下代码(添加 Snippet 标签以方便引导)。

XML

<Snippet>

<Code Language="html">

<![CDATA[<label for="CustomerType">Customer Type:</label>

<select>

<option>Federal</option>

<option>State</option>

<option>Corporate</option>

<option>Residtential</option>

</select>

<br />

       

    <label>Name:</label>

<input id="name" name="name"/><br />

       

    <label >Address Line 1:</label>

<input id="AddressLine1" name="AddressLine1"/><br />

   

    <label>Address Line 2:</label>

<input id ="AddressLine2" name="AddressLine2"/><br />

   

<label>City </label> <input id="City" name="City"/><br />

   

<label>State </label><input id="State" name="State"/><br />

   

<label >Zip Code </label>   <input id="zip" name="zip"/><br /><br />

     

$end$]]>

     

</Snippet>

这将添加一个标签控件,其 ID 为 AddrBlock。

9.            使用 Windows Explorer 导航到 C:\Users\<Username>\Documents\ 文件夹。在 C:\Users\<Username>\Documents\ 文件夹中创建一个子文件夹“Snippets”。

注意:有两种方法可以将代码片段部署到环境中。

方法 1:将 XML 另存为一个 .snippet 文件,并存储到 C:\Users\<Username>\Documents\Visual Studio 10\Code Snippets\Visual Web Developer\My HTML Snippets\ 文件夹中。Visual Studio 将自动找到这些代码片段,并将其设置为可用。

方法 2:将所创建的代码片段 XML 另存为一个 .snippet 文件,并存储于另一位置,然后使用 Code Snippets Manager 将该代码片段添加到 Visual Studio 中。

使用 Code Snippets Manager 添加的代码片段将不会显示在自动完成列表中。

10.          选择 File | Save As 菜单命令。在 File Save As 对话框中,将路径更改为 C:\Users\<Username>\Documents\Snippets 文件夹。将文件名更改为“AddrBlock”,设置 Save as type 下拉列表为 Snippet Files (*.snippet) 并单击 Save。

11.          使用 Tools | Code Snippets Manager…菜单或 CTRL + K、CTRL + B 快捷键打开 Code Snippets Manager。Code Snippets Manager 对话框随即打开。

 

图 7

Code Snippets Manager

12.          在 Language 下拉列表中,选择 HTML。单击 Add 按钮,打开 Code Snippet Directory 对话框。

 

图 8

添加代码片段文件夹

13.     在 Code Snippet Directory 对话框中,导航到您所创建的文件夹 (C:\Users\<Username>\Documents\Snippets\),然后单击 Select Folder 按钮。在代码片段位置列表中,将显示 Snippets 文件夹。

 

图 9

Snippets 文件夹被添加到代码片段位置列表中

               

练习 1:验证

您将验证是否可以在 Visual Studio 2010 中使用自定义的 HTML 代码片段,以及该代码片段是否可以正确呈现 Label 控件。

1.            在 HTMLLab Web 应用程序中,打开 Default.aspx 页的源视图。

2.            将光标置于 ID 为 Listview1 的 ListView XML 标签的末尾,然后按下回车创建新行。

3.            使用 CTRL + K、CTRL + X 快捷键打开代码片段列表。注意,在 Code Snippets Manager 中添加的 Snippets 文件夹现在仍位于列表中。

 

图 10

含有 Snippets 文件夹的代码片段列表

4.            使用鼠标或向下箭头从列表中选择 Snippets,然后按下 TAB 键,查看该文件夹中可用的代码片段列表。

 

图 11

Snippets 文件夹中的代码片段列表

5.            使用鼠标或向下箭头选择 Address Block 代码段,然后按下 TAB 键。代码片段将展开,并将您的 Adress Book 元素添加到页面中:

 

图 12

AddressBlock 代码片段扩展到页面

注意:您并未为代码片段的任何元素指定任何用户输入。可使用 Declaration 部分指定代码片段的行为。每个指定的字段都将突出显示;用户可在各字段间使用 TAB 键切换,完成后按下回车键。

下一步

练习 2:转换 Web.Config 文件以便部署

               

练习 2:转换 Web.Config 文件以便部署

一般来说,在您将 Web 应用程序用于生产环境前,它已经被用于众多环境。这些环境包含开发(开发人员本地计算机)、质量保证 (QA) 以及用户验收测试 (UAT)/暂存/预生产环境。在这些环境中转换应用程序时,配置文件中的很多设置都必须更改。除了数据库连接字符串,很多企业级应用程序也依赖于对日志记录存放位置、文件存放位置共享以及服务端点地址的配置设置。

在 Visual Studio 2010 中,包含一个新的 web.config 转换模型,如果您需要使用 MSDeploy 来生成代码,则可在部署应用程序时使用该模型来自动更改 web.config 文件。

注意:要完成本练习中的任务,您必须完成练习 1 中的所有任务,或使用 %TrainingKitInstallFolder%\Labs\WebDevelopment\Source\Ex02-TransformingWebConfig\begin\C#\HTMLLab 文件夹中的解决方案。

               

任务 1 –在 Visual Studio 2010 中创建暂存配置

1.            打开在上一练习末尾完成的 HTMLLab Web 应用程序。

2.            从菜单中选择 Build | Configuration Manager。出现 Configuration Manager 对话框:

 

图 13

Configuration Manager

3.            从 Active solution configuration 下拉列表中选择 <New…>,打开 New Solution Configuration 对话框。

 

图 14

New Solution Configuration

4.            在 Copy setting from 下拉列表的 Name 字段类型中,键入“Staging”,选择

Release。保留 Create new project configurations 复选框为选中状态。您的对话框应如下图所示:

 

图 15

新 Staging 配置的新解决方案配置

5.            单击 OK 按钮。单击 Close 按钮,关闭 Configuration Manager。

6.       在 Solution Explorer 中,注意 web.config 文件的旁边有一个可展开的节点。单击该节点,展开树视图。注意,web.config 文件下有两个遵循 web.<configuration>.config 命名规则的文件。

 

图 16

Debug 和 Release 配置文件

各个环境之间的更改存储在这些 delta 文件中。默认情况下,所有的 Web 应用程序都是以 Debug 和 Release 配置文件开始的。Visual Studio 可以为开发人员创建的新配置添加新的转换。右键单击 web.config 并从菜单中选择 Add Config Transforms。注意,将自动添加新的 Staging 配置文件:

 

图 17

添加部署配置

注意:如果在右键菜单中,Add Config Transforms 已被禁用,请重新编译应用程序。

               

任务 2 –添加代码来用 web.config 中的值填充 EnvName 的文本值

在开始此任务之前,您需要在 default.aspx 页面中添加一个标签,以包含环境变量。下面显示的标签即为完成后的标签。 

XML

当前环境:<asp:Label ID="EnvName" Text="Environment Name" runat="server" />

 

在本任务中,您将从 web.config 文件中获取环境名称,并填充标签的文本属性。

1.            在 HTMLLab Web 应用程序中,打开 web.config 文件。

2.            为 <appSettings > XML 元素添加以下值:

XML      

< key="EnvironmentName" value="Staging" />

</appSettings>

3.            在 Solution Explorer 中,右键单击 Default.aspx 并从菜单中选择 View Code。

4.            找到 Page_Load 方法。添加以下代码,获取键 EnvironmentName 的值,并将其分配给 EnvName 标签的 Text 字段:

C#

EnvName.Text = ConfigurationManager.AppSettings["EnvironmentName"];

5.            运行应用程序,验证 Development 是否以文本形式显示在 EnvName 标签中。

 

图 18

添加部署配置

6.            关闭 Web 浏览器。

               

任务 3 –添加日志数据库连接字符串到 web.config 文件中

在本任务中,您将向数据库的日志应用程序消息中添加一个连接字符串。

1.            在 HTMLLab Web 应用程序中,打开 web.config 文件。

2.            为 <connectionStrings /> XML 元素添加以下值:

XML

<connectionStrings>

<add name="LoggingConnectionString" connectionString="server=(local);database=Logger;Integrated Security=SSPI;" providerName="System.Data.SqlClient"/>

</connectionStrings>

3.            保存 web.config 文件更改。

               

任务 4 –编写转换以更改环境,在暂存 web.config 中记录连接字符串

在本任务中,您将创建一个转换,在使用 MSDeploy 部署应用程序时更新 web.config 部分。在 web.config 文件中,您将环境值更新为“Staging”,并将连接字符串中的服务器名称值更改为与 QA 服务器相关的名称。

1.            要显示具体的配置转换文件,可单击 web.config 文件旁边的加号。打开 Web.Staging.config。

2.            此转换文件是一个 XML 文件,您可使用该文件来指定 Visual Studio 可在节点、节以及属性上执行的操作(添加、删除、更新)。此文件包含对 XML Document Transform 命名空间 (http://schemas.microsoft.com/XML-Document-Transform) 的引用。此架构中有两种属性:Transform 和 Locator。Transform 将对节点和属性进行更改,Locator 可查找 web.config 中的特定转换节点和属性。

注意:有关 Transform 和 Locator 属性的完整参考信息,可访问 MSDN。

Staging 配置转换文件中已含有一个节点,表示对 web.config 文件 system.web 节所做的更改,特别是对 debug 属性的删除。

XML

<?xml version="1.0"?>

<configuration xmlns:xdt="http://schemas.microsoft.com/XML-Document-Transfrom">

...

<system.web>

<compilation xdt:Transform="RemoveAttributes(debug)" />

<system.web>

</configuration>

在 system.web 节点下,添加以下代码。

XML

<appSettings>

             <add key="EnvironmentName" value="Staging" xdt:Transform="SetAttributes(value)" xdt:Locator="Match(key)" />

</appSettings>

部署完成后,上面的转换将指导进行 MSBuild 进程,找到 appSettings XML 节点中的 EnvironmentName 节点,然后使用下面定义的一个值替换值属性:“Staging”。

3.            可使用相同的方法,通过添加以下代码来转换连接字符串 XML:

XML

<connectionStrings>

                <add name="LoggingConnectionString" connectionString="Server=QADatabaseServer;Database=Logging;Integrated Security=SSPI" providerName="System.Data.SqlClient” xdt:Transform="Replace" xdt:Locator="Match(name)" />

</connectionStrings>

在此代码中,connectionString 从(本地)服务器转换到 QADatabaseServer,以进行日志记录。

注意:  

xdt:Transform=”Replace”替换第一个匹配的节点。

xdt:Transform=”SetAttribute(attributeName)”创建或更改现有属性的值。

               

任务 5 –通过命令行生成已转换的 web.config 文件

在此任务中,您将使用 MSBuild 命令行工具创建一个内部版本,并根据构建过程中的 Staging 配置转换 web.config 文件。

1.            导航到 Start | All Programs | Microsoft Visual Studio 2010 | Visual Studio Tools。要打开 Visual Studio Command Prompt,请单击 Visual Studio 2010 Command Prompt。

2.            将目录更改为 HTMLLab 项目目录。例如,如果您仍在使用练习 1 的初始解决方案,请键入:

cd %TrainingKitInstallFolder%\Labs\WebDevelopment\Source\Ex01-HTMLCodeSnippets\begin\C#\HTMLLab

3.            在命令提示符中,键入以下内容来调用 MSBuild:

MSBuild HTMLLab.csproj /t:TransformWebConfig /p:Configuration=Staging 

然后按下回车键。

MSBuild 将根据 Staging 转换规则构建应用程序并转换 web.config 文件。输出文件的位置为 HTMLLab\obj\Staging\TransformWebConfig\ 文件夹。

 

图 19

MSBuild 输出

4.            在 Visual Studio 中,选择 File | Open | File 菜单命令,并导航到项目目录下的 obj\Staging\TransformWebConfig 文件夹。选择 web.config 文件并单击 Open。

注意,在 web.config 文件中,密钥 EnvironmentName 的值已更改为 Staging,并且连接字符串已从(本地)更新为 QADatabaseServer。

XML

<appSettings>

<add key="EnvironmentName" value="Staging" />

</appSettings>

<connectionStrings>

<add name="LoggingConnectionString"       connectionString="Server=QADatabaseServer;Database=Logger;Integrated Security=SSPI;" providerName="System.Data.SqlClient"/>

</connectionStrings>

5.            关闭 web.config 文件。

               

任务 6 –通过 Visual Studio 生成已转换的 web.config 文件

在此任务中,您将使用 Visual Studio 创建一个内部版本,并将 web.config 文件作为该内部版本的一部分进行转换。

1.            在 Solution Explorer 中,右键单击 HTMLLab 项目,并选择 Properties。

2.            在项目属性页中,单击 Package/Publish 选项卡。

3.            在属性页顶部,确保将活动配置设置为 Staging:

 

图 20

验证是否已选择 Staging 配置。

4.            在属性页底部,取消选择 Create web package as a ZIP file 复选框。

 

图 21

取消选中以 ZIP 文件方式部署的复选框

注意:如果仍选中了 Create web package as a ZIP file 复选框,则仍会使用同一个内部版本,但 Visual Studio 还会创建一个 ZIP 文件。

注意软件包的位置。

图 22

软件包位置

此目录为 Visual Studio 创建软件包的目录,该软件包中包含可部署的 Web 应用程序映像,包括已修改的 web.config 文件。

5.            使用 Windows Explorer,导航到 HTMLLab\obj\Staging\TransformWebConfig 文件夹。删除该文件夹中存储的 web.config 文件(如果有)。

6.            在 Visual Studio 中,选择 Project 菜单并单击 Package -> Create Package。Visual Studio 将为 Web 应用程序重新构建并创建一个部署软件包。

 

图 23

创建软件包

               

下一步

练习 2:验证

练习 2:验证

要验证是否正确执行了所有练习的步骤,执行以下步骤

1.            在 Visual Studio 2010 中,从菜单中选择 File | Open | File…,打开  File 对话框。导航到 HTMLLab 项目目录下的 obj\Staging\TransformWebConfig 文件夹。选择 web.config 文件并单击 Open。

2.            注意,在 web.config 文件中,EnvironmentName 的值已更改为 Staging。

XML

<appSettings>

<add key="EnvironmentName" value="Staging" />

</appSettings>

3.            在 web.config 文件中找到连接字符串,并验证数据库服务器名称是否已更新为 QADatabaseServer。

XML

<connectionStrings>

<add name="LoggingConnectionString"       connectionString="Server=QADatabaseServer;Database=Logger;Integrated Security=SSPI;" providerName="System.Data.SqlClient"/>

</connectionStrings>

4.            关闭 web.config 文件。

               

下一步

练习 3:打包和部署用于 Visual Studio Development Web Server 的 Web 应用程序

练习 3:打包和部署用于 Visual Studio Development Web Server 的 Web 应用程序

大多数网站中都含有很多工件和资源,以便网站能够正常运行。正确部署所有这些内容,并不是一件繁琐的事情。Visual Studio 2010 中包含一种新的功能,利用这种功能,您可以创建名为 Web Package 的 ZIP 文件,该文件为自描述实体,包含应通过 MSDeploy 部署到服务器的所有资产和资源。

在本练习中,您将使用这种新功能将 Web 应用程序部署到 VS Development Web Server。

注意:要完成本练习中的任务,您必须完成练习 2 中的所有任务,或使用 %TrainingKitInstallFolder%\Labs\WebDevelopment\Source\Ex03-PackageDeployDevServer\begin\C#\HTMLLab 文件夹中的解决方案。

任务 1 –打开项目属性发布页面并创建一个软件包。

在本任务中,您将打开产品的属性页面,检查某些可用的功能和设置。

1.            右键单击 HTMLLab 项目并从菜单中选择 Properties,打开项目的属性页。单击 Package/Publish 选项卡

2.            选中 Create web package as a ZIP file(如果未选中)。注意 Package Location 中的路径。这是创建软件包后,该软件包的放置位置。

 

图 24

将包创建为 ZIP 文件和输出路径

3.            使用 Windows 资源管理器,导航到 HTMLLab 项目目录下的 obj 文件夹,然后删除该文件夹中的所有内容(如果该文件夹存在)。

4.            验证是否已通过构建选项菜单将活动构建配置设置为 Staging

 

5.            选择 Project 菜单,并单击 Package -> Create Package。在 Output 窗口中查看构建和发布过程是否成功。

 

图 25

成功构建和发布

6.            使用 Windows 资源管理器,导航到在上面提到的 Package Location 文本框中指定的相对路径。注意,对选定的配置创建了一个新的文件夹。双击该文件夹。双击 Package 文件夹将其打开。

 

图 26

打包的 web 应用程序

注意,此文件夹中包含以下项:

◦         PackageTmp 文件夹 – 包含所有用于运行 Web 应用程序的文件。此文件夹中的内容已发布到 Web 软件包中。Visual Studio 使用此文件夹来构建增量软件包。

◦              HTMLLab.deploy.cmd – 由 Visual Studio 生成的一个批处理文件,可用于在目标服务器上安装 Web 应用程序。

◦              HTMLLab.parameters.txt – 此文件提供了安装程序。默认情况下,此文件指向在 Destination ISS Application Path 文本框中指定的路径。如果您选择安装其他软件包,您将需要更改此文件中的路径。

◦              HTMLLab.DestManifest.xml – 此文件与 HTMLLab.parameters.txt 文件的功能相同,但其用法目前已被淘汰。

◦              HTMLLab.SourceManifest.xml – Visual Studio 在内部使用此文件创建软件包。本实验忽略此文件。

◦              HTMLLab.zip – 可部署的 Web 软件包。

               

注意:大多数情况下,您会将您的应用程序部署到与您构建软件包的计算机不同的机器上。这样,您需要移动到目标计算机的三个文件为 ProjectName.deploy.cmd、ProjectName.parameters.txt 和 ProjectName.zip 文件。

               

               

任务 2 –准备 Web Server 以便部署

在本任务中,您将在 Web 服务器上创建并部署一个新的应用程序。

1.            使用 Windows 资源管理器,创建一个新的文件夹“C:\HTMLWebApp”

2.            导航到 Start | All Programs | Accessories 并单击 run。在run 框类型中:“inetmgr”然后按下回车键,随即出现 Internet Information Services Manager。

3.            在左边的 Connections 树视图中,展开本地机器节点。在该节点中,展开站点节点。您现在可以看到一个网站列表:

 

图 27

本地网站列表

4.            右键单击 Default Web Site 并选择 Add Application。

5.            在 Add Application 对话框中,将 Alias 设置为“HTMLWebApp”,将 Physical path 设置为“C:\HTMLWebApp”。注意 Physical path,因为您将在此处部署软件包。单击 OK 按钮关闭对话框。

 

图 28

本地网站列表

6.            在 IIS Manager 中,右键单击 HTMLWebApp Web 应用程序,并从菜单中选择 Manage Application | Advanced Settings…。出现 Advanced Settings 对话框。

 

图 29

Web 应用程序高级设置

注意,Application Pool 设置为 DefaultAppPool。

7.            单击 Application Pool,然后单击 DefaultAppPool 旁边的按钮,出现 Select Application Pool 对话框。

 

图 30

选择应用程序池

8.            使用标有 Application pool 的下拉列表框选择 ASP.NET v4.0。单击 OK 关闭 Select Application Pool 对话框。单击 OK 关闭 Advanced Settings 对话框。

               

任务 3 –部署包

在该任务中,您将包部署到上一个任务中创建的 web 应用程序中。

1.            要将软件包部署到以前指定的物理设备中,您将需要更改 HTMLLab.SetParameters.xml 文件。在 Windows 资源管理器中,选择 HTMLLab.SetParameters.xml 文件,并使用 Visual Studio 将其打开。当前的文件内容应如下所示:

XML

<?xml version="1.0" encoding="utf-8" ?>

<parameters>

<setParameter name="IIS Web Application Name" value="Default Web Site/HTMLLab_deploy" />

<setParameter name="ConnectionString LoggingConnectionString" value="Server=QADatabaseServer;Database=Logging;Integrated Security=SSPI" />

</parameters>

将 ISS Web Application Name 元素替换为以下内容:

XML

<setParameter name="IIS Web Application Name" value="C:\HTMLWebApp" />

注意: HTMLLab.SetParameters.xml 文件将位于 HTMLLab 项目的 obj\Staging\Package\ 文件夹中。

2.            单击 File | Save 保存 HTMLLab.SetParameters.xml 文件。

3.            接下来,您将在 Trial 模式下部署应用程序。

注意:Trial 或 What If 模式不实际执行部署,但如果安装软件包,则会为您显示所执行的操作。这在将包转手给部署团队或服务器管理员时非常有用。这样,团队或管理员可在 What If 模式中运行软件包,查看其对服务器造成的影响。

导航到 Start | All Programs | Microsoft Visual Studio 10 | Visual Studio Tools,然后单击 Visual Studio 2010 Command Prompt 打开命令提示符。

4.            在命令提示符中键入以下命令,将当前目录更改为 C:\Program Files\IIS\Microsoft Web Deploy\:

                cd "C:\Program Files\IIS\Microsoft Web Deploy\"

5.            使用 /t 标志(表示 Trial)执行 HTMLLab.deploy.cmd 批处理文件。例如,如果您还在使用练习 1 中的 HTMLLab 项目,则键入:

                "%TrainingKitInstallFolder%\Labs\WebDevelopment\Source\Ex01-HTMLCodeSnippets\begin\C#\HTMLLab\obj\Staging\Package\HTMLLab.deploy.cmd" /t

 

图 31

在 Trial 模式下执行部署命令行批处理文件

6.            查看 Trial 部署的输出。

 

图 32

Trial 部署的结果

MSDeploy 已将另外五个文件添加到指定位置。

7.            重新运行 HTMLLab.deploy.cmd 批处理文件,执行部署。在此实例中,删除 /t(表示 trail)标志并将其替换为 /y(表示 Yes)标签,方法为键入以下内容:

                "%TrainingKitInstallFolder%\Labs\WebDevelopment\Source\Ex01-HTMLCodeSnippets\begin\C#\HTMLLab\obj\Staging\Package\HTMLLab.deploy.cmd" /y

 

图 33

在 Yes 模式下执行部署命令行批处理文件

8.            查看部署的输出。

 

图 34

在 Yes 模式下执行部署命令行批处理文件

MSBuild 已在指定物理位置中部署了软件包。

 

图 35

已部署的 Web 应用程序软件包

               

下一步

练习 3:验证

               

练习 3:验证

在此验证中,您将验证 Web 应用程序是否已成功部署。

1.            在 IIS Manager 中,右键单击 HTMLWebApp Web 应用程序,并从菜单中选择 Switch to Content View。随即出现 HTMLWebApp 的内容视图。

 

图 36

HTMLWebApp 内容视图

2.            右键单击 Default.aspx文件,并从菜单中选择 Browse。

3.            验证 Default.aspx 页是否加载了 HTMLWebApp。

 

图 37

部署 web 应用程序

               

下一步

练习 4:为 Internet Information Server (IIS) 打包和部署 web 应用程序

               

练习 4:为 Internet Information Server (IIS) 打包和部署 web 应用程序

在前面的练习中,您已经在 Visual Studio Development Studio 中部署了一个 Web 应用程序。在本练习中,您将在 IIS 中部署同一个 Web 应用程序。要完成本练习,您需要以管理员身份启动 Visual Studio,方法是在开始菜单中右键单击 Visual Studio 2010 图标,并选择 Run as Administrator。

注意:要完成本练习中的任务,您必须完成练习 3 中的所有任务,或使用 %TrainingKitInstallFolder%\Labs\WebDevelopment\Source\Ex04-PackageDeployIIS\begin\C#\HTMLLab 文件夹中的解决方案。

               

任务 1 –打开项目属性发布页,设置 Web 应用程序以使用 IIS 并创建软件包。

在本任务中,您将打开产品的属性页面,设置 Web 应用程序以使用 IIS,检查某些可用的功能和设置。

1.            使用 Windows 资源管理器,创建一个新的文件夹“C:\HTMLLab”

2.            在 Visual Studio 中,右键单击 HTMLLab 项目并从菜单中选择 Properties,打开 HTMLLab 项目的属性页。

3.            单击 Web 选项卡。

4.            在属性页的 Server 部分,单击单选按钮 Use Local IIS Web Server:

 

图 38

设置 Web 应用程序以使用本地 IIS 服务器

5.            单击 Create Virtual Directory 按钮,在 IIS 的本地实例上创建一个虚拟目录。

6.            单击 Package/Publish 选项卡在 Web Deployment Tool Settings 部分,查看是否选中了 Include all the IIS settings for this web project as configured in IIS Manager 复选框。

 

图 39

IIS 设置已启用

选中此框,确保 MSBuild 打包了 Web 应用程序的所有 IIS 设置。

7.            选中 Include all the IIS settings for this web project as configured in IIS Manager 复选框以及 Include Application Pool 设置。

8.            选中 Create web package as a ZIP file 复选框。注意 Package Location 文本框中的路径。构建过程将在这里创建软件包。

9.            将 C:\HTMLLab\ 设置为目标应用程序物理路径

 

图 40

将包创建为 ZIP 文件和输出路径

10.          确保将活动配置设置为 Staging,然后选择 Project 菜单并单击 Package -> Create Package。在 Output 窗口中查看构建和发布过程是否成功。

 

图 41

成功构建和发布

11.          使用 Windows 资源管理器,导航到在上面提到的 Package Location 文本框中的相对路径。例如,如果您仍使用练习 1 中的 HTMLLab 项目,则导航到 %TrainingKitInstallFolder%\Labs\WebDevelopment\Source\Ex01-HTMLCodeSnippets\begin\C#\HTMLLab\obj 文件夹。

12.          注意,已为选中的配置 (Staging) 创建了文件夹。双击该文件夹。在该文件夹中,创建一个新的文件夹 Package。双击 Package 文件夹将其打开。

 

图 42

打包的 web 应用程序

注意,此文件夹中包含的内容与前面练习中包含的内容相同。

               

任务 2 –部署包

在该任务中,您将包部署到上一个任务中创建的 web 应用程序中。

1.            导航到 Start | All Programs | Accessories 并单击 run。在 run 框类型中:“inetmgr”然后单击 OK ,出现 Internet Information Services Manager。

2.            在左边的 Connections 树视图中,展开本地机器节点。在该节点中,展开站点节点。

 

图 43

本地网站列表

3.            展开 Default Web Site 节点。验证其中是否列出了 HTMLLab Web 应用程序(在前面的任务中,单击 Create Virtual Directory 按钮后,将创建此应用程序。)

 

图 44

创建的 HTMLLab 虚拟目录

4.            接下来您将在 Trial 模式下部署应用程序。

注意:Trial 或 What If 模式不实际执行部署,但如果安装软件包,则会为您显示所执行的操作。这在将包转手给部署团队或服务器管理员时非常有用。这样,团队或管理员可在 Trial 模式中运行软件包,查看其对服务器造成的影响。

导航到 Start | All Programs | Microsoft Visual Studio 2010 | Visual Studio Tools。右键单击 Visual Studio 2010 Command Prompt 并选择 Run as Administrator,打开命令提示符。

5.            在命令提示符中键入以下命令,将当前目录更改为 C:\Program Files\IIS\Microsoft Web Deploy\:

                cd "C:\Program Files\IIS\Microsoft Web Deploy\"

6.            使用 /t 标志(表示 Trial)执行 HTMLLab.deploy.cmd 批处理文件。例如,如果您还在使用练习 1 中的 HTMLLab 项目,则键入:

                "%TrainingKitInstallFolder%\Labs\WebDevelopment\Source\Ex01-HTMLCodeSnippets\begin\C#\HTMLLab\obj\Staging\Package\HTMLLab.deploy.cmd" /t

 

图 45

在 Trial 模式下执行部署命令行批处理文件

7.            查看 Trial 部署的输出。

 

图 46

Trial 模式部署的结果

在本例中,可以看到 MSDeploy 对服务器做了 9 处改动。

8.            重新运行 HTMLLab.deploy.cmd 批处理文件,执行部署。在此实例中,删除 /t(表示 trail)标签并将其替换为 /y(表示 Yes)标签。. 例如,如果您还在使用练习 1 中的 HTMLLab 项目,则键入:

                "%TrainingKitInstallFolder%\Labs\WebDevelopment\Source\Ex01-HTMLCodeSnippets\begin\C#\HTMLLab\obj\Staging\Package\HTMLLab.deploy.cmd" /y

 

图 47

在 Yes 模式下执行部署命令行批处理文件

9.            查看部署的输出。

 

图 48

在 Yes 模式下执行部署命令行批处理文件

MSBuild 已在指定物理位置中部署了软件包。

               

下一步

练习 4:验证

               

练习 4:验证

在此验证中,您将验证 Web 应用程序是否已成功部署。

1.            在 IIS Manager 中,选择 Default Web Site 并在窗口右侧的 Actions 窗格中单击 Refresh。

2.            这样,您就会在默认的网站下看到一个 HTMLLab_deploy 目录。

3.            右键单击 HTMLLab_deploy 应用程序,并从菜单中选择 Switch to Content View。出现 HTMLLab_deploy 应用程序的内容视图:

 

图 49

HTMLLab 内容视图

4.            右键单击 Default.aspx文件,并从菜单中选择 Browse。

5.            验证是否出现了 HTMLLab_deploy 应用程序的默认页。

 

图 50

部署 web 应用程序

               

下一步

总结

               

总结

在本实验中,您了解了如何使用 HTML 代码片段来提高 Web 应用程序的开发速度,并创建了您自己的自定义代码片段。您还创建了一个 XML 转换文件,该文件可针对您 Web 应用程序的 web.config 文件进行一系列适当的更改,因此被推荐用于各种环境中。最后,您还了解了 ASP.NET Web 应用程序的新的打包和发布功能。