Building a Web 2.0 Portal with asp.net ajax 第一章

·   在这本书中，我将会给您展示怎样介绍一个 Ajax，Web 2.0 式的门户。这个门户使用 ASP.NET 3.5 , ASP.NET AJAX 和 .NET 3.5 , 也使用了 LINQ 和 SQL Server 2005.在创建应用程序中，你可以了解到：

o      必须要做的设计决定和 Web 2.0 用户界面中可用性的问题

o      架构的复杂性和丰富的 JavaScript，支持 widget 的站点的开发挑战

o      运行一个高容量的 web 应用程序的生产和维护的挑战

Ajax web 门户属于你可以在网上找到的最极端的客户端技术实现。它们不仅仅使用了大量的 JavaScript，CSS 和 HTML，它们也将 Ajax 和 服务器端的技术推向交互性，性能和可测两性的极限。当您阅读完本书，您将会有足够的技术知识来创建一个你自己的 web 2.0 产品。

我叫这个应用程序的示例 Dropthings，原因马上就会清楚，它是在像 Google 的 iGoogle 或者 PageFlakes 一样的 web 门户中去掉了一些功能之后的原型。你可以部署 Dropthings 在一个产品服务器上，作为你自己的个人站点，小组站点，或者甚至做为公司内部网络。包括可以拖拽的 widgets，完全的个性化支持，在多个页面上构建 widgets 的能力，集中的身份权限验证等等。

正如你通过这本书你将会看到 Dropthings 是怎样构架和实现的。他是一个真是的，鲜活的开源的 Web 门户，你可以在 http://www.dropthings.com 找到。尽管由于代码的质量，功能性，可测量性，性能和产品其他方面的问题，他还不能和真正的 web 门户相比，但是它很好的证明了新生的技术。

然而，你可以将它做为你每天的个人使用，而且，非常欢迎你通过添加更多的功能或者添加新的 widgets 来支持继续开发这个项目。

开源项目 Dropthings 在 http://www.codeplex.com/dropthings . 每个人都能参与贡献。

图 1-1 展示了 Dropthings 站点，在这本书中，你将会学到如何创建它。

 

 

图 1-1. Dropthings 站点是一个支持 widgets 的 web 2.0 门户；你将会使用 ASPNET 3.5，ASP.NET AJAX ，.NET Framework 3.5 和 SQL Server 2005 来创建一个类似的一个用程序。

定义一个 Web 门户

一个 web 门户是一个允许用户自己定制的首页，用户可以通过拖放 widgets 完成定制。这种方式用户可以完全的控制他的首页上面显示什么，在哪里显示，以及如何交互。

一个 widget 分散在页面上，执行各自的功能，同时也有自己独自的界面和特性集。widgets 的例子包括 待办事项，地址簿，联系人列表，RSS，时钟，日历，播放列表，股票代号，天气预报，交通报告，词典，游戏，任何你可以想象到的都能够被打包拖放到一个 web 页面上面。在一个公司的环境中， widgets 能够链接到内部的系统；举个例子，一个支出追踪的 widget 能够直接的访问内部的账户系统。如果你熟悉 SharePoint 门户，你就了解了 widgets，在 SharePoint 和 ASPNET 2.0 中被称为 Web part.

特别的，Ajax web 门户是一个使用 Ajax 技术来为用户创建更丰富体验的 Web 门户。这是领先于上一代门户一步的，包括领先的网站像 MSN 或者 AOL，因为它给你一个最新式的UI界面，通过 widget，animation，弹出窗口，客户端的数据网格，表现的更加像一个 Windows 客户端应用程序，而这些，通常不能再一个非 Ajax 门户上面找到。不足为奇的是，MSN 和 AOL 已经开始接受本书里面讨论的一些方法了。一些最流行的 web 门户包括 iGoogle （www.google.com/ig），My Yahoo（http://my.yahoo.com）和 Pageflakes (www.pageflakes.com; 见图 1-2）

 

图 1-2. PageFlakes 使用 widgets 提供功能，包括本地天气，本地新闻，视频，本地照片，播客，股票证券投资，使用 Google Map 看当地时间等等。

一个 web 门户，尤其是一个支持 Ajax 的门户，为用户提供了一个有趣的浏览器互联网的方式。用户可以添加照片，视频，照片，播客和视频博客到他们的起始页上。web 门户 能够变的更有价值，通过在一个页面内检测 Email，阅读新闻，获得天气预报。他们可以通过将日历中安排约会，待办事项，以及地址簿等，来组织他们的数字化的生活。不管在哪里-办公室，家里，或者是机场-只要他们能够接触到网络，用户就能直接的从他们的 web 门户中直接获得这些信息。他像把整个互联网都放进一个单独的页面，完全是按照你想的方式来显示。追逐内容的日子过去了，现在信息等都来主动地找你了。

定义一个 Web 2.0 门户

Web 2.0 为 Web 应用程序定义了一系列的原则和做法，当按照这些做了之后，就可以称之为 Web 2.0. 一个站点如果能够成为一个 Web 2.0 站点，就要：

o      允许用户控制显示在网站上面的数据

o      呈现一个平台，允许混合 (或者整合) 技术和数据

o      允许自己的服务在应用程序外部调用

o      通过以下发挥集体智慧:
— 从不同来源中聚合相关内容
— 用户提供内容
— 通过标签和评级用户组织内容

o      使用流行的技术： Ajax、Flash 和 Silverlight 将交互提升一个等级

Dropthings 做为一个 Web 门户，允许用户按照自己的想法安排页面上的内容。Widget 式架构允许以 widgets 形式整合各种技术。它向外部提供 Web Service。门户从不同的来源来聚合内容，像来自 Flickr 的照片，CNN 的新闻，Weather.com 的天气报告等等。它支持用户提交 RSS 的格式的内容。最终他通过使用 Ajax 技术将 Web 推向下一级。

使用 Web 门户

一个 Web 门户，你的每一个访问你站点的用户都能定制它，并且按照他们想要的样式来设置。最好的是，每一个用户的布局都会被保存下来，所以，在你下次登录的时候，你的主要布局不会改变。另外，访问者可以从一个 widget 目录中添加更多的 widger，按照他们的想法来装饰页面。

Ajax 支持的起始页是怎样不同的

Ajax 和 富客户端体验的优势是，能够使用户通过一个有趣的，令人兴奋的方式来完成他们常规的工作。所有的这些功能都是通过小的，完成一个指定功能的 widget 完成的，像显示一个来自 Exchange 邮件服务器的信息，从一个 SharePoint 列表中分配任务，甚至显示来自内部账户系统的开支。在一个常规的 web 门户，企业用户能够拖动 widgets，将它们放到他们喜欢的地方。举个例子，email 收件箱能够放在左侧，开支费用放在中间，在右边放一个“待拨电话列表”。一个关键的优势就是这些 widgets 可以提供来之不同服务器，不同平台的内容，包括 Linux ，Unix，或者 IBM 的 OS/2 服务器。只要平台支持 HTTP 和 XML，任何功能都能通过 widget 提供。主框架负责身份，权限验证，用户信息，交互，以及所有这些很酷的 Ajax 效果。这样，widget 就是由少量代码组成的轻型的组件，来完成指定的任务。

一个 Ajax Web 门户对小组门户或者社会站点也非常有用。举个例子，你想创建一个 .NET 开发者的小组。你将会从一个空白的页面开始，添加很多的 .NET 资料，添加一个链接的 widget，在里面放有用的 .NET 网站链接，添加一个地址簿 widget 填满联系人，添加一个日历 widget 公布小组的事件，等等。通过这些基本的 widget 和一些安排整理，你将拥有一个动态的，可定制的开发者小组门户，技术和可用性上面都是非常先进的。企业门户特别能从使用 Ajax 的 web 门户中获益。企业门户从多种来源，多种平台获取内容。通过使用 Ajax widget 平台，你能够让整个门户通过小的 widget 来连接不同的系统，为这个页面提供内容。这样的整个门户的复杂性显著见效，因为它仅仅是一个简单的 widget 平台。

浏览 Dropthings

当你第一次访问 Dropthings，我支持你现在来访问它，你将会得到一个预先设定好了的默认页，你可以按照你的喜好来自己设置它。举个例子，这里有一个 Flickr 的照片 widget，一些 RSS，以及一些提供天气，新闻等等的 widget（看图 1-3）。

 

 

图 1-3.你第一次访问 Dropthings，将会给你一个预先设定好的，可自定义的模板。

在 Dropthings 起始页，你可以添加 widget，删除你不喜欢的 widget，并且通过点击每个 widget 标题的 “编辑”链接来对其进行设置。点击“编辑”链接将会出现“设置”区域，在这里你可以改变它的外观，感觉，以及行为（见图 1-4）。

 

 

图 1-4. 照片 widget 允许你通过点击标题栏的“编辑”链接来修改照片流。

你也可以把 widget 从一列拖放到另一列，并且按照你喜欢的方式重新组织页面。当你回到页面，你的设置一定保存在页面上了，甚至是你没有登录。然而，当你登录之后，你的页面你的页面永久的保存了起来，并且你可以在任何地点访问他们（见 图 1-5）。

允许有多个 标签（页）来放置 widget。这里已经有了一个预先创建的空白的第二个标签，在这里，你可以添加新的 widget。所以，你可以随便添加标签。这个可以帮助你保持每一个标签都整洁和小巧，并且组织相关的 widget 在相同的位置。点击在页面右上方的“添加项目”链接，将会出现一个弹出式的 widget 馆，这个向你展示了可以使用的 widget（见图 1-6）。从这个里表中，你可以点击 widget，并且将其添加到你的页面上面。在添加完之后，你可以通过点击 widget 标题栏的“编辑”链接进一步的设置它。

 

Figure 1-5. 你可以按照你的喜好拖放 widget，并且重新组织页面

Figure 1-6. 创建一个“Photo” 的标签，通过添加项目，添加 Flickr 照片 widget；每一个照片 widget 显示按照各自的设置来显示 Flickr 照片。

在页面的顶部，有一个可以搜索互联网的工具条。搜索是网络上应用最用的功能。因此，门户需要拥有方便的搜索功能；否则，用户就不会将一个 web 门户设置为浏览器的首页。Live.com 搜索条支持“on-site” 搜索功能，这样，搜索的结果会出现在页面的右侧，这样使得用户在进行搜索的时候，可以不用离开 web 门户（见图 1-7）。

 

图 1-7. Live.com 搜索条提供的 on-site 搜索功能

使用站点时，你将会注意到，这里没有一个 PostBack 。通过同步的 PostBack 或者通过 JavaScript 调用浏览器完成操作。你可以不用PostBack或者刷新页面，完成添加/删除 widget，拖放widget，以及切换标签。这使得 Ajax web 门户相比非Ajax 门户更加方便快速。

使用 ASP.NET AJAX

通过 web 门户你将会了解到 怎样通过使用UI层，逻辑层，以及数据层构建一个N层架构的应用程序。你将使用 ASPNET AJAX 来完成 web 门户的 UI 层，包括了首页和 widget 界面。ASPNET AJAX 提供了不使用 PostBack 更新 widgets 的功能（通过 UpdatePanel），也支持通过拖放 widgets 来改变页面的布局。它也提供了很丰富的控件扩展，增添了像淡入/淡出，平滑转变的很酷的效果，也增加了客户端的生机。你可以增添富客户端的体验，通过在文本框上面提供自动完成效果，通过调用 WebService 来进行异步数据加载，客户端的分页，排序，等等。

ASPNET AJAX 运行时提供了一个框架，使用这个框架你可以在 widget 里面进行 XML HTTP 调用。它通过使用 Custom Extenders 提供了一个构建客户端效果的框架。widget 的拖放动作就是作为 Extender实现的。你也可以复用一些来自 Ajax Control Toolkit （ACT）的扩展来增强你的客户端体验。

ASPNET AJAX 提供了一个方便的 API，通过这个API 访问 ASPNET Membership 程序服务。很好的是，ASPNET Membership API 完全兼容 ASPNET AJAX ，还有 Membership 的 Provider 和 Profile 属性等都和 ASPNET AJAX 兼容；在一个 ASPNET 站点中，他们按照相同的方式工作。这意味着你可以不用 PostBack 来做客户端登录、注册和修改用户信息。

使用 C# 3.0 和 .NET 3.5

Dropthings 的业务逻辑层通过 .NET 引入的 Windows Worflow Foundation（WF）来创建。主要的操作，像用户第一次访问，一个用户的随后的访问，添加一个新的 widget，创建一个新的页面等等，都是使用 workflow。workflow 包含了所有的业务规则，以及在每一个操作后需要完成的动作。举个例子，一个新用户访问工作流创建用户账号，将用户信息填充为默认值，创建一些默认页面，弹出指定的 widgets，等等。这样复合的操作很适合通过 workflow 创建，workflow 允许你将完整的操作分成更小的部分，成为活动。每一个活动完成小量的工作。它和数据访问层交互，执行任务。数据访问层通过 .NET 3.5 使用 LINQ to SQL，在你的应用程序中，LINQ to SQL 大大简化了查询数据库的代码。

web 工程和 widgets 很好的利用了 .NET 3.5 提供的新功能， lambda 表达式，LINQ to SQL 和LINQ to XML。你将使用 LINQ 来查询集合以及数据库。 Widget 很好的利用 LINQ to XML 来使用来自外部数据源的XML。

应用程序使用一个典型的 N 层架构，在 UI，业务逻辑和数据之间，有一个明确的分离（见图 1-8）。举个例子：

web 层
   由页面， WebService，资源（像图片，CSS，JavaScript 和 .resx文件），还有配置设置
业务层
   提供实体类，业务逻辑，数据的中间缓存层，以减少数据库交互
数据访问层
  封装了数据库访问，提供了数据库和数据源独立的接口。也提供了从数据库列中创建实体类的对象工厂，and vice versa。

图 1-8, 每层中使用的技术 

 

本书中的 Web 应用程序试用了一些最新的 .NET 3.0 和 .NET 3.5技术。web 层使用 ASPNET AJAX 来增加用户体验，业务层使用 WF 来组织复杂的操作。所有的三层中，使用 LINQ 来处理数据结构。

C# 3.0 语言扩展和 LINQ 查询 在所有层中被用来处理集合，数据库和XML。WF 被用来在逻辑层中处理复杂的操作，就像工作流。 LINQ to SQL 是数据访问层和业务逻辑层的一部分。尽管插入，更新和删除操作大部分都在数据访问层中封装好了，但是一些查询操作，在逻辑层中直接完成，可以更加迅速。这就是为什么 LINQ to SQL 也是逻辑层的一部分。

总结

Ajax web 门户，将Aajx技术推向极致。微软的ASPNET AJAX 提供了一个丰富的 AJAX 组件以及一个强壮的跨浏览器兼容框架，为 web 门户提供了 Ajax 的技术动力。.NET 3.0 和 3.5框架的新特性允许架构师和开发者使用 Workflow，LINQ to SQL 和 LINQ to XML。在这章中，提供了一个概要，解释了什么是 Ajax web 门户以及开发这样的项目需要引入的技术。下一章，将会讨论架构的挑战，性能问题以及比典型的 web 应用程序更加有挑战的安全问题。

 

 本文转自：http://blog.ncuhome.cn/llj098/Logs/2008/12/10/25369.html