بررسی معماری فرم های وب

در بخش اول اين مقاله ، مفاهيم اوليه در رابطه با فرم های وب و آماده سازی سيستم بمنظور اجرای صفحات ASP.NET اشاره گرديد. در اين بخش به بررسی معماری فرم های وب خواهيم پرداخت .
يک فرم وب از دو بخش متفاوت تشکيل می گردد :

يک فرم وب ، از لحاظ فيزيکی توسط فايلی با انشعاب aspx . ، ارائه می گردد . در صورتيکه انشعاب صفحات Html ، را به aspx . ، تغيير دهيم ، نتايج يکسانی را مشاهده خواهيم کرد ( فرم های وب بنوعی با صفحات Html سازگار می باشند) .يکی از نکات جالب و قابل توجه فرم های وی ، قابليت تفکيک کد از فرم بوده و شايد به همين دليل است که فرم های وب دارای جايگاهی خاص در رابطه با پياده سازی برنامه های وب می باشند. در اين راستا ، می توان از دو رويکرد متفاوت استفاده کرد :

در هر يک از حالات فوق ، زمانيکه صفحه مربوطه بر روی سرويس دهنده اجراء می گردد ( با توجه به درخواست صفحه فوق ، توسط سرويس گيرندگان ) ، کدهای رابط کاربر اجراء و بصورت پويا خروجی ، توليد می گردد . برای آشنائی عملی با معماری فرم های وب ، می توانيم نسخه Code Behind مثال ارائه شده در بخش اول مقاله ، را با استفاده از روش جداسازی کد از بخش ويژوال ، مجددا" بازنويسی نمائيم . بخش ويژوال اين برنامه بصورت زير است .

بخش ويژوال فرم مشخص شده توسط يک فايل با انشعاب aspx .
HelloCodeBehind.aspx


<%@ Page Language="VB" Src="HelloCodebehind.aspx.vb" Inherits= MyWebPage %>
<HTML dir="rtl" >
<HEAD>
</HEAD>
<BODY>
<FORM RUNAT="SERVER">نام خود را وارد نمائيد : 
<asp:textbox id=txtName Runat="server"></asp:textbox>
<p>
<asp:button id=cmdEcho onclick=cmdEcho_Click Text="نمايش" runat="server" tooltip="بر روی دکمه فوق کليک تا نام شما نمايش داده شود">
</asp:button></p>
<asp:label id=lblGreeting runat="server"></asp:label>
<P></P>
</FORM>
</BODY>
</HTML>

کد رابط کاربر ، در فايلی با نام HelloCodeBehind.aspx.vb ، قرار گيرد . ( صفحه Code Behind مربوط به فرم وب )

کدهای مرتبط با فرم وب، موجود در فايل HelloCodeBehind.aspx.vb

' HelloCodebehind.aspx.vb
Imports System
Imports System.Web
Imports System.Web.UI
Imports System.Web.UI.WebControls
Public Class MyWebPage
Inherits System.Web.UI.Page
Protected txtName As TextBox
Protected cmdEcho As Button
Protected lblGreeting As Label
Protected Sub cmdEcho_Click(Source As Object,e As EventArgs)
lblGreeting.Text="مجددا سلام (اين مرتبه از طريق جداسازی بخش ويژوال و کد) , " & txtName.Text
End Sub
End Class

Page Class
Namespace کليدی در فرم های وب و سرويس های وب ، System.web است . حمايت های لازم در ارتباط با فرم های وب در namespace با نام System.Web.UI و حمايت های لازم در ارتباط با کنترل های سرويس دهنده نظير : TextBox ,Button در namespace با نام System.web.UI.WebControls قرار دارد. کلاسی که بصورت اتوماتيک خروجی را برای يک صفحه aspx . را توليد می نمايد ، Page class ناميده و در namespace با نام System.web.UI قرار داشته و کلاس ها از Page مشتق می شود.( همانگونه که در صفحه Code Behind نشان داده شده است) .

توارث از Page class
عناصر موجود در فايل .aspx ، کدهای موجود در فايل Code Behind ( يا بلاک های اسکريپت ) و کلاس پايه page با يکديگر همکاری تا خروجی مورد نظر را توليد نمايند. اين همکاری توسط ASP.NET بصورت اتوماتيک بخدمت گرفته شده تا يک کلاس برای فايل aspx . که مشتق شده از کلاس Code Behind است که خود نيز از کلاس page مشتق شده است، ايجاد گردد . ارتباط فوق ، توسط خصلت توارث در فايل aspx . ، ايجاد می شود. شکل زير ، سلسله مراتب توارث را نشان می دهد . در اين شکل Mywebpage ، کلاسی است که ما پياده سازی نموده و از کلاس page مشتق شده است .آخرين کلاس مشتق شده page ( در شکل بصورت My .aspx نشان داده شده است ) ، توسط ASP.NET در زمان Runtime بصورت اتوماتيک ايجاد می گردد . کلاس فوق ، باعث توسعه کلاس page شده (در شکل mywebpage نشان داده شده است ) تا از اين طريق ، يکپارچگی کنترل ها و متن HTML در يک فرم وب ، را شاهد باشيم. اين کلاس، ترجمه و به يک فايل اجرائی تبديل و در زمانی که صفحه توسط يک مرورگر درخواست می گردد ، اجراء خواهد شد . کد اجرائی مسئول ايجاد تگ های Html لازم بمنظور ارسال برای مرورگر ، خواهند بود.

چرخه حيات فرم های وب
بمنظور شناخت عميق تر معماری فرم های وب ، چرخه حيات برنامه ارائه شده ( Hellocodebehind.aspx ) را دنبال خواهيم کرد .

1 - کاربر درخواست صفحه وب HelloCodeBehind.aspx را از طريق مرورگر می نمايد .
2 - سرويس دهنده وب ، Page class را از طريق فايل aspx . و صفحه Code Behind مرتبط با آن را ترجمه خواهد کرد . سرويس دهنده وب ، کد را اجراء و تگ های Html را توليد و آنها را برای مرورگر ارسال می نمايد ( کنترل های سرويس دهنده با تگ های Html جايگزين می گردند) . در چنين حالتی ، کد زير برای مرورگر ارسال خواهد شد (،کد فوق ، مشابه کد اوليه موجود بر روی سرويس دهنده نيست).

کدهای ارسالی برای مرورگر

<HTML dir="rtl" >
<HEAD>
</HEAD>
<BODY>
<form name="_ctl0" method="post" action="HelloCodebehind.aspx" id="_ctl0">
<input type="hidden" name="__VIEWSTATE" value="dDw2MjkzODE3NTs7Ppdej/imiZ1bxKfJJN4dIewZmRTv" />
نام خود را وارد نمائيد : 
<input name="txtName" type="text" id="txtName" />
<p>
<input type="submit" name="cmdEcho" value="نمايش" id="cmdEcho" title="بر روی دکمه فوق کليک تا نام شما نمايش داده شود" /></p>
<span id="lblGreeting"></span>
<P></P>
</form>
</BODY>
</HTML>

3 - مرورگر ، تگ های Html را تفسير و يک فرم ساده را نمايش می دهد . با توجه به اينکه اولين مرتبه ای است که فرم نمايش داده می شود ، Textbox خالی است و هيچگونه پيامی نمايش داده نمی شود.

4 - کاربر يک نام را تايپ و دکمه " نمايش" را فعال می نمايد . مرورگر تشخيص می دهد که يک دکمه "Submit" ، فعال شده است ( کليک ) . متد ارسال Post و Action مربوط به صفحه نيز همان صفحه است ( يعنی HelloCodeBehind.aspx ) . در چنين حالتی با واقعيتی بنام Postback مواجه می شويم که باعث می گردد ، مجددا" به فايل اوليه aspx . ، مراجعه گردد.( با فشردن دکمه "نمايش " ، اطلاعات درج شده در فرم برای فايل اوليه aspx . ، ارسال خواهد شد . در حقيقت Action مربوط به صفحه ، همان صفحه در نظر گرفته شده است ) .

5 - سرويس دهنده وب در اين مقطع ، پردازش ها ی لازم در خصوص صفحه را انجام خواهد داد. زمانيکه کاربر بر روی دکمه "نمايش" ، کليک می نمايد ، يک "رويداد" فعال و يک event Handler در کلاس mywebpage صدا زده می شود ( Event Handler ، مسئوليت برخورد با رويداد را برعهده دارد ).

Event Handler مربوط به رويداد کليک دکمه " نمايش"

Protected Sub cmdEcho_Click(Source As Object,e As EventArgs)
lblGreeting.Text="مجددا سلام (اين مرتبه از طريق جداسازی بخش ويژوال و کد) , " & txtName.Text
End Sub

6 - خصلت Text مربوط به کنترل سرويس دهنده Textbox يعنی txtName ، بمنظور خواندن نام درج شده توسط کاربر، استفاده می گردد. يک پيام با آن ترکيب و به کنترل Label نسبت داده می شود. (lblGreeting) ، عمليات نسبت دهی فوق ،مجددا" با استفاده از خصلت Text مربوط به کنترل سرويس دهنده label ، انجام خواهد شد .
7 - سرويس دهنده مجددا" تگ های Html را برای کنترل های سرويس دهنده توليد و آنان را برای مرورگر ارسال می نمايد. شکل زير Html مربوطه را نشان می دهد.

Html ارسالی برای مرورگر

<HTML dir="rtl" >
<HEAD>
</HEAD>
<BODY>
<form name="_ctl0" method="post" action="HelloCodebehind.aspx" id="_ctl0">
<input type="hidden" name="__VIEWSTATE" value="dDw2MjkzODE3NTt0PDtsPGk8Mj47PjtsPHQ8O2w8aTw1Pjs
+O2w8dDxwPHA8bDxUZXh0Oz47bDzZhdis2K/Yr9inINiz2YTYp9mFICj
Yp9mK2YYg2YXYsdiq2KjZhyDYp9iyINi32LHZitmCINis2K/Yp9iz2KfYs
tuMINio2K7YtCDZiNmK2pjZiNin2YQg2Ygg2qnYrykgLCAgINix2LbYpzs
+Pjs+Ozs+Oz4+Oz4+Oz68aL2z9KBk2
+V2CRgUVzgE/7CJMA==" />
نام خود را وارد نمائيد : 
<input name="txtName" type="text" value="رضا" id="txtName" />
<p>
<input type="submit" name="cmdEcho" value="نمايش" id="cmdEcho" title="Click to echo your name" /></p>
<span id="lblGreeting">مجددا سلام (اين مرتبه از طريق جداسازی بخش ويژوال و کد) , رضا</span>
<P></P>
</form>
</BODY>
</HTML>

8 - مرورگر ، صفحه را تفسير و شکل مطابق زير را نمايش خواهد داد .

View State
يکی از خصايص مهم فرم های وب ، بخاطر سپردن تمام اطلاعات درج شده در فرم ها ، توسط سرويس دهنده وب است . با توجه به اينکه پروتکل HTTP ، بصورت Stateless است ،فرآيند نگهداری وضعيت بصورت اتوماتيک انجام نشده و می بايست برنامه نويسی گردد. يکی از ويژگی های منحصر بفرد ASP.NET ، نگهداری اطلاعات فوق ( View State ) ، توسط فريمورک دات نت بصورت اتوماتيک و بکمک يک کنترل مخفی است .

کنترل مخفی بمنظور نگهداری State Information

<input type="hidden" name="__VIEWSTATE" value="dDw2MjkzODE3NTt0PDtsPGk8Mj47PjtsPHQ8O2w8aTw1Pjs
+O2w8dDxwPHA8bDxUZXh0Oz47bDzZhdis2K/Yr9inINiz2YTYp9mFICj
Yp9mK2YYg2YXYsdiq2KjZhyDYp9iyINi32LHZitmCINis2K/Yp9iz2KfYs
tuMINio2K7YtCDZiNmK2pjZiNin2YQg2Ygg2qnYrykgLCAgINix2LbYpzs
+Pjs+Ozs+Oz4+Oz4+Oz68aL2z9KBk2
+V2CRgUVzgE/7CJMA==" />
...

در بخش سوم اين مقاله به بررسی مدل رويدادها در فرم های وب ، خواهيم پرداخت .