بررسی معماری فرم های وب New Page 1



ساير




 

 

 

SAKHA RAVESH CO.

 ا مروز

 دوشنبه  8  خرداد  1396  2017  May  29   Monday ToDay
صفحه اصلی  مقالات نکته هادايره المعارف خودآموزها | تازه ها خود آزمون ها    
  نسخه قابل چاپ  

    5 4 3 2 1 

 عنوان

 نويسنده

  مشاهده

 تعداد آراء

 امتياز

 فرم های وب ( بخش دوم )

 مديريت وب

11197

11

4.1

با توجه به جایگاه داده در عصر حاضر و  لزوم نگاه جامع به این مقوله مهم ، بر آن شدیم تا محوریت فعالیت های خود را بر  روی این موضوع متمرکز نمائیم . از این رو گروه فابک با شعار فناوری اطلاعات برای کسب وکار شکل گرفت و  خدمات خود  را از طریق  سایت www.fabak.ir  به مخاطبان محترم عرضه می نماید

 

فرم های وب ( بخش دوم )

فرم های وب ( بخش دوم )

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

  • محتويات ويژوال که عمدتا" توسط تگ های Html ، مشخص می گردند .

  • کدها  که منطق لازم بمنظور ارتباط با عناصر ويژوال را مشخص می نمايند.

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

  • استقرار کدها در يک فايل مجزاء . با استفاده از روش فوق ، می توان  کدهای مرتبط با بخش ويژوال يک فرم را در فايلی مجزاء و با انشعاب خاص ذخيره نمود. انشعاب فايل فوق ، بستگی به زبان استفاده شده برای نوشتن کدها  دارد . مثلا" در صورتيکه از VB.NET ، استفاده می گردد ، انشعاب اين نوع از فايل ها  vb .  ، و در صورتيکه از زبان سی شارپ ( #C) استفاده می گردد ، انشعاب آن  cs . ، در نظر گرفته می شود .

  • در روش دوم، می توان کدها را مستقيما" در صفحه اصلی و بهمراه بخش ويژوال قرار دارد. بدين منظور از تگ Script استفاده می گردد . بهمراه تگ فوق، از خصلت RUNAT  که دارای مقدار "SERVER" ، است ، استفاده می گردد.

<SCRIPT  RUNAT="SERVER">
  ... 
 </SCRIPT>

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

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

<!-- HelloCodebehind.aspx -->
<%@ Page Language="VB" Src="HelloCodebehind.aspx.vb" Inherits= MyWebPage %>
<HTML dir="rtl" >
<HEAD>
</HEAD>
<BODY>
<FORM RUNAT="SERVER">نام خود را وارد نمائيد :&nbsp;
<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 جايگزين می گردند) . در چنين حالتی ، کد زير برای مرورگر ارسال خواهد شد (،کد فوق ، مشابه کد اوليه موجود بر روی سرويس دهنده نيست).

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

<!-- HelloCodebehind.aspx -->
<HTML dir="rtl" >
<HEAD>
</HEAD>
<BODY>
<form name="_ctl0" method="post" action="HelloCodebehind.aspx" id="_ctl0">
<input type="hidden" name="__VIEWSTATE" value="dDw2MjkzODE3NTs7Ppdej/imiZ1bxKfJJN4dIewZmRTv" />
نام خود را وارد نمائيد :&nbsp;
<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 ارسالی برای مرورگر

<!-- HelloCodebehind.aspx -->
<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==" />

نام خود را وارد نمائيد :&nbsp;
<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==" />
...

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



جستجو

مقالات                 
دايره المعارف       
دوره های آموزشی


 

 

مشاهده گروه ها



              

 

 تهيه شده در شرکت سخا روش -  1382