65.9K
CodeProject 正在变化。 阅读更多。
Home

使用轻量级 JavaScript 在 ASP.NET 中重新利用 ASP 代码

UV2003
starIcon
emptyStarIcon
starIcon
emptyStarIconemptyStarIconemptyStarIcon

1.33/5 (2投票s)

2005 年 5 月 10 日

5分钟阅读

viewsIcon

44598

downloadIcon

179

如何通过将 HTML 打包成 JavaScript，并在渲染时将其写入客户端，来在 ASP.NET 页面中重用现有的 ASP 渲染逻辑。

引言

在将现有 ASP 3.0 应用程序迁移到 ASP.NET 时，许多因素都可能使情况变得复杂。这些因素可能包括如何利用中间层的现有 COM 对象，如何将现有的 UI 代码重构为用户控件等等。有时，不可能一蹴而就地完全过渡到 ASP.NET。相反，在网站分阶段迁移的过程中，现有的 ASP 应用程序可能需要与新的 ASP.NET 应用程序并存相当长一段时间。

如果您不关心虚构的业务场景，请直接跳到“解决方案备选方案”中的代码。

案例研究：国际招聘公司的 Web 职业服务中心

虚构公司国际招聘公司 (ICS) 拥有一个现有的 ASP 3.0 应用程序。它由 Oracle 后端数据库、COM 对象中间层以及服务器端使用 ASP 和 VBScript、浏览器端使用 JavaScript 编写的前端组成。他们的网站模板包括左侧菜单、头部区域和底部区域。这些区域的外观是通过复杂的逻辑构建的，该逻辑会检查登录用户的角色和职责，以确定哪些部分可以访问和适合渲染。

ICS 已决定使用 ASP.NET 来实现其网站的一些新功能，因为他们不想落后于时代，以免程序员流失到其他公司。但是，ICS 预计在新开发完成后，只有 5% 的应用程序 UI 将使用 ASP.NET 完成，而其余部分仍将保留为 ASP。

ICS 很难证明仅仅为了实现 5% 的应用程序而重写整个应用程序的合理性。因此，ICS 希望在条件成熟之前，尽可能多地利用现有代码，并尽量减少重构。

问题陈述

如何将现有 ASP 应用程序中的 UI 渲染逻辑迁移到 ASP.NET 应用程序中？以及如何做到使两个应用程序可以并存，并且对 ASP 应用程序 UI 渲染逻辑的更改能够被 ASP.NET 应用程序继承？

复杂因素

以下是一些复杂因素：

  1. ICS 选择使用一个免费的门户系统作为其新工作的基础，他们可以在其上构建新部分或修改现有部分。这将消除从头开始构建所有所需代码的需要。
  2. 门户系统必须位于其自己的虚拟目录中。
  3. 如前所述，该应用程序有成千上万的不同用户，并且根据他们的角色，每次登录的用户界面都会有所变化。
  4. 预计 ASP 3.0 应用程序将继续并行进行更改。

解决方案备选方案

在这种情况下，有一些想法浮现：

  1. 重写应用程序 UI 逻辑，使其作为 ASP.NET 中的自定义用户控件。
  2. 使用 System.Net.WebClient 类调用现有应用程序，提取用户界面代码并将其放入 HTTP 响应中。
  3. 将界面的 HTML 代码存储在 JavaScript 中，并使用浏览器中的 document.write 方法在渲染时构建页面 GUI。

1 和 2 的问题

选项 1 和 2 一开始看起来很有吸引力，但它们存在一些致命的缺陷。

在选项 1 中，ICS 已经明确表示他们现在不想重新设计一切，因为这需要花费太多时间，而且他们不希望在 ASP 3.0 应用程序持续发生更改的同时维护两个代码库。

在选项 2 中，缺陷在于，由于用户界面对于每个登录用户都不同，因此在服务器上运行的 WebClient 类必须模拟登录用户。虽然这是可能的，但在所有情况下可能并非如此，例如当登录需要数字证书进行身份验证时。

选择的解决方案：使用 JavaScript 输出 HTML

选项 3 是最务实、最简单的方法。原因如下：

  1. 用户必须通过现有 ASP 应用程序进行身份验证，然后才能访问任何 ASP.NET 内容。
  2. 修改 ASP 应用程序以将嵌入在 JavaScript 脚本中的 HTML 片段发送到客户端非常容易。
  3. 未来对 ASP 应用程序界面的更改将自动被 ASP.NET 应用程序继承。

解决方案大纲

解决方案将包含三个部分：

  1. 现有 ASP 应用程序的头部部分，其中包含渲染所有三个模板区域为独立 HTML 片段的函数。
  2. 现有 ASP 应用程序的页面部分，它使用这些函数将这三个片段渲染为 JavaScript 变量。
  3. 一个 ASP.NET 页面，它在 JavaScript SCRIPT 标签中包含对 ASP 页面的引用，然后在渲染时将这些片段写入客户端页面。

原始 ASP 页面的代码

<%
Dim userRole

userRole = "PUBLIC"

If Len(Request.QueryString("userRole")) > 0 Then
    userRole = Request.QueryString("userRole")
End If

Dim strMenuLeft, strMenuTop, strMenuBottom

Dim scriptUrl

scriptUrl = Request.ServerVariables("SCRIPT_NAME") & "?userRole=" & userRole

strMenuLeft = _
        "<div id='pnlMenu'>" & vblf & _
        "    <b>User Role:" & userRole & "</b>" & vblf & _
        "    <div class='mnuOptions'>" & vblf & _
        "        <div class='mnuTitle'>View</div>" & vblf & _
        "        <div class='mnuItem'><a href='" & scriptUrl & _
        "&cmd=ViewServices'>Services</a></div>" & vblf & _
        "        <div class='mnuItem'><a href='" & scriptUrl & _
        "&cmd=ViewProducts'>Products</a></div>" & vblf & _
        "    </div>" & vblf
If userRole = "EDITOR" Or userRole = "STAFF" Then
    strMenuLeft = strMenuLeft & _
        "    <div class='mnuOptions'>" & vblf & _
        "        <div class='mnuTitle'>Edit</div>" & vblf & _
        "        <div class='mnuItem'><a href='" & scriptUrl & _
        "&cmd=ModifyServices'>Modify Services</a></div>" & vblf & _
        "        <div class='mnuItem'><a href='" & scriptUrl & _
        "&cmd=ModifyProducts'>Modify Products</a></div>" & vblf & _
        "    </div>" & vblf
End If
If userRole = "STAFF" Then
    strMenuLeft = strMenuLeft & _
        "    <div class='mnuOptions'>" & vblf & _
        "        <div class='mnuTitle'>Manage</div>" & vblf & _
        "        <div class='mnuItem'><a href='" & scriptUrl & _
        "&cmd=ManageUsers'>Manage Users</a></div>" & vblf & _
        "        <div class='mnuItem'><a href='" & scriptUrl & _
        "&cmd=ManageSite'>Manage Site</a></div>" & vblf & _
        "    </div>" & vblf
End If
strMenuLeft = strMenuLeft & "</div>"


strMenuTop = "Home | Products | Services | Search | Feedback"
strMenuBottom = "Home | Privacy | Copyright"

%>
<html>
<head>
<title>International Staffing Company</title>

<link rel="stylesheet" type="text/css" href="style.css"></link>

</head>

<body>
    <img src="images/isclogo.gif"><br />
    <table border="0" cellpadding="2" cellspacing="6">
        <tr valign="top">
            <td><%=strMenuLeft%></td>
            <td>
                <table border="0" cellpadding="0" cellspacing="0>
                    <tr valign="top">
                        <td><%=strMenuTop%></td>
                    </tr>
                    <tr valign="top">
                        <td><br /><br /><br />[Content Area]
                           <br /><br /><br /></td>
                    </tr>
                    <tr valign="bottom">
                        <td><%=strMenuBottom%></td>
                    </tr>
                </table>
            </td>
        </tr>
    </table>
</body>
</html>

要添加到原始 ASP 页面的 VBScript 代码，用于将值渲染为 JavaScript

strMenuTop = "Home | Products | Services | Search | Feedback"
strMenuBottom = "Home | Privacy | Copyright"

Dim renderType
renderType = Request.QueryString("renderType")

If renderType = "js" Then
    Response.Write PackageAsJS(strMenuLeft, "strMenuLeft") & vblf
    Response.Write PackageAsJS(strMenuTop, "strMenuTop") & vblf
    Response.Write PackageAsJS(strMenuBottom, "strMenuBottom") & vblf
    Response.End
End If

Function PackageAsJS(str, name)
    str = Replace(str, vblf, "\n")
    str = Replace(str, """", "\""")
    str = Replace(str, vbtab, "\t")
    PackageAsJs = name + " = """ + str + """;"
End Function

重用 ASP 内容的 ASP.NET 页面的代码

<html>
<head>
<title>International Staffing Company</title>

<link rel="stylesheet" type="text/css" href="style.css"></link>
<script type="text/javascript"   src=
  "https:///ASPapp/Menu.asp?userRole=STAFF&cmd=ViewProducts&renderType=js">
  </script>

</head>

<body>
    <img src="images/isclogo.gif"><br />
    <table border="0" cellpadding="2" cellspacing="6">
        <tr valign="top">
            <td>
                <script type="text/javascript">
                <!--
                    document.write(strMenuLeft);
                //-->
                </script>
            </td>
            <td>
                <table border="0" cellpadding="0" cellspacing="0>
                    <tr valign="top">
                        <td>
                            <script type="text/javascript">
                            <!--
                                document.write(strMenuTop);
                            //-->
                            </script>                        
                        </td>
                    </tr>
                    <tr valign="top">
                        <td><br /><br /><br />
                          <form runat="server">
                          <input type="text" runat="server" 
                          value="[Content Area]" />
                          </form><br /><br /><br /></td>
                    </tr>
                    <tr valign="bottom">
                        <td>
                            <script type="text/javascript">
                            <!--
                                document.write(strMenuBottom);
                            //-->
                            </script>
                        </td>
                    </tr>
                </table>
            </td>
        </tr>
    </table>
</body>

</html>

工作原理

.asp 页面顶部的代码会检查用户的角色，然后根据该用户适当地渲染菜单项。稍后，这些动态值将被写入客户端。新代码用于拦截“renderType”参数，如果它等于“js”，则 HTML 将被转义为 JavaScript 字符串，供 .NET 客户端在渲染时应用于客户端。当然，链接是硬编码的，但思路已经说明了。

摘要

虽然从零开始使用最新最好的技术开始项目是很好的，但由于时间和当前投资的限制，有时这是不可能的。相反，分阶段的方法可以缓解技术过时的问题，同时以保持最终用户体验的方式引入新功能。希望您发现这个简单的技术很有用。

© . All rights reserved.