2011. október havi bejegyzések

Ajaxos táblázatfrissítés ASP.NET MVC-ben JavaScript nélkül

A HTML5 Játéktér fejlesztésénél jött elő a feladat, hogy egy Ajax hívás után frissíteni kell egy táblázatot, pontosabban törölni kell egy sort belőle. Ha az adott sorban a felhasználó rákattint a Törlés gombra, akkor törölni kell a megfelelő rekordot a szerveren, majd a kliens oldalon a táblázatból is, természetesen teljes page postback nélkül. A jó hír az, hogy ezt ASP.NET MVC-ben egyetlen sor JavaScript írása nélkül meg lehet tenni.

Íme a view egy részlete, ami a táblázat egy sorát rendereli:

<tr id="game-@item.Slug">
  <td>
    @Ajax.ActionLink( "Törlés", "Delete", "Game",
      new { slug = item.Slug },
      new AjaxOptions
      {
        Confirm = "Biztos?", 
        InsertionMode = InsertionMode.Replace, 
        UpdateTargetId = "game-" + item.Slug
      },
      new { @class = "button delete" } )
  </td>
</tr>    

A lényeges részeket aláhúztam:

  • Minden sornak generálunk egy egyedi id attribútumot.
  • Az Ajax hívásnál megadjuk, hogy a szervertől érkező válasszal cserélje ki (InsertionMode) az egész sort (UpdateTargetId).

Ha a feladat az aktuális sor eltávolítása, akkor csak arról kell gondoskodnunk, hogy a szerver oldali controller action üres válasszal térjen vissza:

public ActionResult Delete( string slug )
{
  // Ide jön a törlés...

  return new EmptyResult();
}

 

Technorati-címkék: ,,
Reklámok

Kártékony programok eltávolítása – haladóknak

A Microsoft féléves gyakorisággal kiad egy ún. Security Intelligence Reportot (SIR), ami:

“An in-depth perspective on software vulnerabilities and exploits, malicious code threats, and potentially unwanted software”

Az aktuális (már pár hónapja elérhető) a 11. kiadás, ami a 2011. első félévében gyűjtött mérési adatokat foglalja össze csekélynek aligha mondható 168 oldalban (akinek ez túl sok, az persze választhatja a cakkumpakk 19 oldalas “key findings” változatot is). Érdekesek az eredmények és a következtetések is, de az is hasznos információ, hogy milyen és mennyi adat szolgál ezek hátteréül. Lényeg a lényeg, érdemes legalább átfutni annak is, akinek nem a biztonság a fő szakterülete.

Örömmel láttam, hogy ebben a kötetben már külön fejezetet kapott a social engineering, sőt Mark Russinovich is írt egy 16 oldalas fejezetet Advanced Malware Cleaning Techniques for the IT Professional címen. Ő az alábbi 7 lépést javasolja a kártékony programok eltávolítására:

  1. Disconnect from the network
  2. Identify malicious processes and drivers
  3. Suspend and terminate suspicious processes
  4. Identify and delete malware autostarts
  5. Delete malware files
  6. Reboot
  7. Repeat Step 2

Ezek nem egyszerű lépések, sőt évről évre bonyolultabbak, ahogy komplexebbé válnak a támadások, összetettebb a felderítésük és a védekezés is. Szerencsére a Sysinternals eszközök rengeteg segítséget adnak, de csak akkor, ha tudjuk is őket használni. Például egy programot könnyű teljesen megölni, ott a Task Managerben az End Process gomb. Ámde a kártékony programok közül számos túléli az ilyen gyilkolászást és vidáman feltámad. Ütheted, vághatod, mindig visszanő. A megoldás, hogy hagyjuk őt élni, csak éppen elvesszük tőle az összes processzor időt, hogy valójában futni már ne tudjon. Azt meg hogy? Természetesen Process Explorerrel…

 

JavaScript hibakeresés 1×1

Véleményem szerint ma már nem létezik “szerver oldali webprogramozó”, hiszen szinte minden weboldalhoz tartozik már szerver és kliens oldali logika is. A kliens oldali JavaScript és jQuery kódok debuggolása elsőre nagyon idegen feladatnak tűnhet, de valójában egyáltalán nem ördöngösség és szerencsére már kiváló eszközök is vannak hozzá. Az alábbi videóban a Firebug, a FireQuery és a Visual Studio 2010 JavaScript debuggolási lehetőségei közül a leggyakrabban használtak kerülnek terítékre:

Teljes képernyős nézet, 720p felbontás ajánlott.

 

Visual Studio Database project költöztetése SQL Azure-ra

Nagyon régóta használjuk Visual Studioban a Database project típust, mert nagyon szépen lehet vele kezelni és TFS alatt verziózni az adatbázis objektumokat. Mivel bevált és szeretjük, természetesen ezt használtuk a HTML5 Játéktér fejlesztésekor is, a táblák, elsődleges és idegen kulcsok, kényszerek, indexek, a mezők alapértékeinek és a törzsadatoknak a tárolására. Az üröm az örömben, hogy történeti okokból ez a projekt típus még nem támogatja közvetlenül az SQL Azure-t, így nem lehet az elkészült adatbázist és a szükséges adatrekordokat közvetlenül a felhőbe telepíteni.

Szerencsére van megoldás, az alábbi videóban meg is mutatom, hogyan költözik fel a Studioból az adatbázis az SQL Azure-ra:

720p, teljes képernyős nézet ajánlott

Ráadásként az is kiderül, hogyan lehet a fejlesztés során használt tesztadatokat opcionálisan telepíttetni a kimeneti szkripttel.

 

SQL Server 2012 Developer Training Kit a felhőből

Megjelent az SQL Server 2012 Developer Training Kit előzetes, ami web installeres változatban tölthető le a Microsoft Download Centerből. A mindössze 2.5 MB-os telepítőt elindítva ez a csodás látvány fogad (katt a teljes képért):

sql-server-2012-developer-training-kit

Annyira megtetszett, hogy ilyen barátságos a telepítő, hogy rögtön benéztem a motorháztető alá. A Process Explorer szerint klasszikus WPF-es alkalmazás, ami a netről HTTP-n forgalmaz. Naná, hogy elindítottam a Fiddlert, hogy megnézzem, mi jön át, és azonnal kiderült, hogy egy Azure végponthoz csatlakozik, ahonnan OData-val szedi le a listát:

http://us-contentinstaller.cloudapp.net/api/v1/odata/ContentGroups(‘SQLDenaliUpdateForDevsTrainingKit’)?$expand=Contents/ContentType,%20Contents/LatestVersion/Dependencies

Ha már OData, akkor persze azonnal körülnéztem, hogy mit találok még ott:

http://us-contentinstaller.cloudapp.net/api/v1/odata/ContentGroups/?$select=Name

Kiderült, hogy a VS11 és a Windows Azure training kit-ek is innen dolgoznak. Ejha, van ám itt összefogás!

Sőt, tartozik hozzá egy szép webes felület is, ami ASP.NET MVC-vel, WCF Data Services-zel, Modernizr-rel és jQuery-vel készült: http://us-contentinstaller.cloudapp.net/

 

__doPostBack is undefined

Éljenek a modern böngészők! Tényleg, én szeretem, hogy van változás, jönnek az újak, amelyek biztonságosak és a webes szabványokat is egyre jobban támogatják. Jobb a fejlesztőknek és jobb a felhasználóknak is. Néha azonban beüt a mennykő és egy-egy újabb böngésző alatt elhasal a korábban szépen működő webhelyünk. Például Internet Explorer 10 alatt egy ASP.NET-es alkalmazástól könnyen kaphatjuk ezt a hibaüzenetet:

‘__doPostBack’ is undefined

Az aláhúzás-aláhúzás kezdetű dolgokról tudjuk, hogy az ASP.NET belső működéséhez tartoznak, így ez már messziről komolynak tűnik. Pedig mindössze arról van szó, hogy az ASP.NET down-level böngészőként értelmezi a legújabb IE verziót, ami szerinte nem kezeli a JavaScriptet. Firefox 5+ alatt hasonló a helyzet, ugyanebből az okból kifolyólag ott a görgetősáv visszaállítással kapcsolatos MaintainScrollbackPositionOnPostBack tulajdonság hal meg. Mindkét hiba annak köszönhető, hogy egy hiba csúszott a .NET 2.0 és 4.0-hoz tartozó böngésző definíciós fájlokba.

A browser caps egy karbantartási rémálom. Az alapötlet jó (vagy talán egyszerűen nincs jobb), de rengeteg munka követni a változásokat. Bár Microsoft ad ki időnként frissített browsercaps fájlt, sajnos más források gyakrabban frissülnek, különösen a mobil eszközök és böngészők területén. Szerencsére a mechanizmus rugalmassága lehetővé tette, hogy a Microsoft most gyorsan javítsa ezt a hibát, amit mi NuGet csomag formájában tudunk alkalmazni a saját webalkalmazásunkban:

Jobb klikk a Solution Explorerben a projekten, majd Manage NuGet Packages…

Manage NuGet Packages

Az Online kategóriában keressünk arra, hogy app_browser:

Manage Packages - App_Browser

Két csomag fog megjelenni:

Telepítsük a kiválasztott csomagot, ami mindössze két .browser fájlt fog eredményezni az App_Browsers mappában:

App_BrowsersUpdate csomag telepítve

Ezzel természetesen csak egy alkalmazást javítottunk meg. Ha a szerveren lévő összes alkalmazásra szeretnénk alkalmazni a javítást, akkor az alábbi tudásbázis cikkek segíthetnek:

  • KB2600088 – .NET 4
  • KB2600100 – .NET 2.0 Windows 7 SP1, Windows Server 2008 R2 SP1, Windows Vista/Server 2008, Windows XP/Server 2003
  • KB2608565 – .NET 2.0 Windows 7 és Windows Server 2008 R2 RTM

A javítások be fognak kerülni a .NET Framework következő nagyobb javítócsomagjába, ami a következő év elejére várható.

 

Technorati-címkék: ,,,,

ASP.NET MVC remote validation

A model validation az egyik kedvencem az ASP.NET MVC-ben. Egy helyre kerül minden, ami a validáláshoz kell, ráadásul a jQuery validationnek köszönhetően a beépített “validátorok” nagyon jól működnek kliens oldalon is.

Legyen mondjuk egy klasszikus Person modell osztályunk, amire könnyen felaggathatom a validálási szabályokat leíró attribútumokat:

public class Person
{
    [DisplayName( "E-mail cím:" )]
    [Required( ErrorMessage = "Az e-mail cím megadása kötelező! ")]
    public string Email { get; set; }

    [DisplayName( "Felhasználónév:" )]
    [Required( ErrorMessage = "A felhasználónév megadása kötelező! " )]
    public string UserName { get; set; }

    [DisplayName( "Jelszó:" )]
    [Required( ErrorMessage = "A jelszó megadása kötelező! " )]
    public string Password { get; set; }
}

A view-ba pedig csak @Html.ValidationMessageFor hívások kellenek a hibaüzenetek megjelenítéséhez (amiket egyébként a VS le is generál magától):

@using( Html.BeginForm() )
{
    @Html.ValidationSummary( true )
    <fieldset>
        <legend>Regisztráció</legend>
        <div class="editor-label">
            @Html.LabelFor( model => model.Email )
        </div>
        <div class="editor-field">
            @Html.EditorFor( model => model.Email )
            @Html.ValidationMessageFor( model => model.Email )
        </div>
        <div class="editor-label">
            @Html.LabelFor( model => model.UserName )
        </div>
        <div class="editor-field">
            @Html.EditorFor( model => model.UserName )
            @Html.ValidationMessageFor( model => model.UserName )
        </div>
        <div class="editor-label">
            @Html.LabelFor( model => model.Password )
        </div>
        <div class="editor-field">
            @Html.EditorFor( model => model.Password )
            @Html.ValidationMessageFor( model => model.Password )
        </div>
        <p>
            <input type="submit" value="Mehet" />
        </p>
    </fieldset>
}

A helyzet akkor kezd bonyolódni, amikor kliens oldalon szeretnénk validálni, de az input ellenőrzési logika vagy a hozzá szükséges egyéb adatok szerver oldalon vannak, például egy adatbázisban. Még kellemetlenebb a helyzet, ha ráadásul nem is egyetlen mező értékét kell ellenőriznünk, hanem több adat együttállását kell vizsgálnunk. Ezt megoldhatnánk egy postback után a controllerben, de sokkal felhasználóbarátabb, ha Ajaxosan oldjuk meg, hiszen így már az űrlap kitöltése közben tudjuk figyelmeztetni a felhasználót, hogy javítsa ki a beírt értékeket. Szerencsére erre a problémára van közvetlen megoldás az ASP.NET MVC-ben, úgy hívják, hogy remote validation. Így kell beizzítani:

A modellben adjunk egy Remote attribútumot a validálandó mezőhöz:

[Remote( "ValidateUserNameAndEmail", "Home", AdditionalFields = "Email" )]
public string UserName { get; set; }

Itt meg kell adnunk, hogy melyik controller action lesz az Ajax hívás szerver oldali végpontja. Ha több mező értékére van szükségünk szerver oldalon, akkor használhatjuk az AdditionalFields paramétert. A fenti példában a validálás akkor fog megtörténni, amikor a UserName mező értéke megváltozik és a szerverhez el fog jutni az Email mező értéke is, az esetleges hibaüzenet pedig a UserName mező mellett fog megjelenni. Szerencsére semmi akadálya annak, hogy ugyanezt az attribútumot ráakasszuk az Email mezőre is, AdditionParameterkent a UserName mezőt adva meg.

Már csak a hivatkozott controller actiont kell megírnunk, például így:

[OutputCache( NoStore = true, Location = OutputCacheLocation.None )]
public JsonResult ValidateUserNameAndEmail( string userName, string email )
{
    return this.IsValid( userName, email ) ? 
        this.Json( true, JsonRequestBehavior.AllowGet ) : 
        this.Json( "Ezzel a névvel és e-mail címmel már létezik regisztráció!", 
            JsonRequestBehavior.AllowGet );
}

A valódi ellenőrző logikát áttettem egy IsValid függvénybe, hogy itt ne zavarjon. A lényeg:

  • Klasszikus controller action azokkal a paraméterekkel, amiket ellenőrizni szeretnénk. Ha van a modellben AdditionalFields, akkor mindet.
  • Válaszként egy JsonResult típussal kell visszatérnünk.
  • Ha az adat helyes, akkor a válasz true, ha hibás, akkor a hibaüzenet.
  • Meg kell adni a JsonRequestBehavior.AllowGet paramétert, anélkül nem fog menni.
  • Célszerű az OutputCache-t kikapcsolni, hogy a böngésző ne gyorsítótárazza a választ.

A hibaüzenet a Html.ValidationMessageFor helyén fog megjelenni, tehát a view-n nem kell változtatnunk. Ha nem a Studio generálta a markupot, hanem mi írtuk, akkor arra érdemes figyelni, hogy legyen benne Html.BeginForm, mezei <form> elemre tapasztalataim szerint nem működik.

Mindössze ennyi, az Ajaxos bűvészkedést az ASP.NET megcsinálja helyettünk. Íme az eredmény:

aspnet-mvc-remote-validation

Akit szeretné lerántani a leplet a varázslatról, az nézze meg a generált markupban a data-val-remote- attribútumokat és figyelje meg a HTTP forgalmat például Fiddlerrel. Érdemes!

 

Technorati-címkék: ,,,,,