Quantcast
Channel: ppedv Team Blog
Viewing all articles
Browse latest Browse all 1198

ASP.NET Webforms PageMethods modernisiert

$
0
0

ASP.NET Webforms hat einige sehr bequeme Features, die sich unter Umständen gar nicht positiv auswirken. Für den partiellen Austausch von Webinhalten im Zusammenspiel Server und Client hilft zb das UpdatePanel. Hierbei wird der komplette Page Inhalt am Server gerendert, zum Client geschickt und nur der partielle Teil im Updatepanel ausgetauscht. Für klassische Intranet Anwendungen per Q&D Pattern meist kein Problem.

Etwas moderner wirken da die Pagemethods. Dabei wird eine Methode in der ASPX Seite statisch (shared) ausgelegt und per Methodenattribut Webmethod zu einem Miniservice. Der Postback zum Server umfasst dann lediglich minimale Daten. Die Antwort erfolgt mit Json formatierten Daten.

   1:  <WebMethod()>
   2:  PublicSharedFunction do_ss(anz AsInteger) As List(Of dings)
   3:  Dim l AsNew List(Of dings)
   4:          l.Add(New dings With {.id = anz + 1, .text = "somestring"})
   5:  Return l
   6:  End Function

Wer mit ASP.NET Webforms aufgewachsen ist, wird den ScriptManager kennen und nutzen. Dieser generiert den für die Server Control nötigen JavaScript  Code.  Über das Proxy Objekt PageMethods wird die Methode am Server aufgerufen.

   1:  <asp:ScriptManagerID="ScriptManager1"runat="server"
   2:  EnablePageMethods="true">
   3:  </asp:ScriptManager>
   4:  <asp:ButtonID="Button1"runat="server"Text="Button"
   5:  OnClientClick="return meineMethode()"/>
   6:  <asp:LabelID="Label1"runat="server"Text="Label"></asp:Label>
   7:  <script>
   8:  function meineMethode()
   9:              {
  10:  var l = PageMethods.do_ss(1, OnSucceeded, OnFailed);
  11:  returnfalse;
  12:   
  13:              }
  14:   
  15:  function OnSucceeded(result, userContext, methodName) {
  16:                  $get('Label1').innerHTML = result;   }   
  17:  function OnFailed(error, userContext, methodName) {  
  18:                  $get('Label1').innerHTML = "An error occured.";  } 
  19:  </script>

 

Dieser Code verursacht gleich mehrfach Bauchschmerzen. So wird ein ASP.NET Server Button unnötigerweise verwendet. Sogar der übliche Form Postback muss mit dem Return false unterdrückt werden. Bei der Betrachtung des HTTP Verkehrs mit Fiddler, erkennt kann den initalen Request gefolgt von umfangreichen JavaScript Downloads. Der eigentliche Webservice Aufruf erfolgt mit dem Page Methodennamen do_ss am Ender der Url.

image

Die Magie des ScriptManagers ist auch ein wenig unheimlich. Also wird nun auf diesen verzichtet und statt dem ASP.NET Scriptmanager ein XMLHTTPRequest per JQuery JavaScript Bibliothek durchgeführt.

   1:  function meineMethode() {
   2:                  $.ajax({
   3:                      type: "POST",
   4:                      url: "webform32.aspx/do_ss",
   5:                      data: '{anz: 1 }',
   6:                      contentType: "application/json; charset=utf-8",
   7:                      dataType: "json",
   8:                      success: OnSucceeded,
   9:                      failure: OnFailed
  10:                  });
  11:  returnfalse;
  12:   }

Hinweis: wenn Friendlyurls verwendet werden, lassen sich Pagemethods nicht aufrufen. Es ist immer die .aspx Erweiterung im Callback mit anzugeben.

Auch der JavaScript Code wird passend zur API des JQuery Frameworks angepasst.

   1:       $('#Label1').text(result);

 

Die dazu nötige Menge an Requests und Größe reduziert sich dadurch erheblich, wie der Fiddler Trace zeigt.

image

Sollten also Änderungen an bestehenden Webseiten anstehen, könnte dies eine Möglichkeit sein einen kompletten Code rewrite zu umgehen. Aus Logik die für den Server rendering Prozess geschrieben wird, wird per Attribut ein JSON REST Service.


Viewing all articles
Browse latest Browse all 1198

Trending Articles


Vimeo 10.7.1 by Vimeo.com, Inc.


UPDATE SC IDOL: TWO BECOME ONE


KASAMBAHAY BILL IN THE HOUSE


Girasoles para colorear


Presence Quotes – Positive Quotes


EASY COME, EASY GO


Love with Heart Breaking Quotes


Re:Mutton Pies (lleechef)


Ka longiing longsem kaba skhem bad kaba khlain ka pynlong kein ia ka...


Vimeo 10.7.0 by Vimeo.com, Inc.


FORECLOSURE OF REAL ESTATE MORTGAGE


FORTUITOUS EVENT


Pokemon para colorear


Sapos para colorear


Smile Quotes


Letting Go Quotes


Love Song lyrics that marks your Heart


RE: Mutton Pies (frankie241)


Hato lada ym dei namar ka jingpyrshah jong U JJM Nichols Roy (Bah Joy) ngin...


Long Distance Relationship Tagalog Love Quotes