Adatkötés + HtmlEncode

Gyakori feladat, hogy adatbázisból érkező adatokat szeretnénk megjeleníteni egy weboldalon. Mivel nagyon okosak vagyunk és tudjuk mi az a cross-site scripting, ezért szeretnénk bebiztosítani magunkat és becsomagolni a megjelenítendő sztringeket egy-egy Server.HtmlEncode hívásba.

Keressük a lehető legegyszerűbb megoldást:

1. Végigiterálunk az eredményhalmazon és minden mezőre jól meghívjuk a HtmlEncode-ot, majd az így kapott eredményt adatkötjük. Ez azoknak való, akik nem ismerik az adatkötést, de már megtapasztalták, hogy amit a varázsló generál, az működik.

2. Kicsivel jobb megoldás, ha a Control DataBinding vagy hasonló eseménykezelőjébe rakosgatjuk bele HtmlEncode hívásokat. Aki idáig eljut, az már hallott az eseményekről, piros pontot neki.

3. Deklaratívan beleírjuk az ASPX fájlba a Bind után. Sajnos itt explicit módon meg kell hívnunk a ToStringet, mert a Bind és az Eval objectet ad vissza, a HtmlEncodenak meg string bemenet kell. Némi plusszmunka árán deklaratív megoldáshoz jutottunk, ráadásul mivel ez megjelenítéshez kapcsolódó "logika", nem is baj, hogy nem zagyválja össze a code behind fájlunkat. Kedves dizájner és grafikus kollégák, kerüljétek ki, ami <% és %> között van.

4. Mind közül a legjobb, hogy ASP.NET 2.0-tól kezdve a Literal kontroll mindezt helyből tudja. Mit tanultunk a Literalról? Hogy ő a legbutább kontroll, gondolkodás nélkül kiköpi a Text tulajdonságát a HTML kimenetbe. Hát most már nem, ő is második osztályba lépett! Van neki egy Mode tulajdonsága, amit ha LiteralMode.Encode értékre állítunk, akkor a szöveget kódolva írja kimenetbe. Egyébként mindössze ez a sok okosság van a Literal Render metódusában, ez Reflectorban jól látszik:

    protected internal override void Render( HtmlTextWriter writer )
    {
        string text = this.Text;
        if( text.Length != 0 )
        {
            if( this.Mode != LiteralMode.Encode )
            {
                writer.Write( text );
            }
            else
            {
                HttpUtility.HtmlEncode( text, writer );
            }
        }
    }

Kéretik tehát szeretni a Literal kontrollt, mert most már nem csak gyors, de tényleg jól használható. Akkor miért használ mindenki mindenre Labelt? A legtöben azért, mert közvetlenül be lehet állítani a CSS osztályt, amihez egy span fog renderelődni. Ne vicceljünk már, tessék kézzel beleírni az ASPX-be, hacsak nem kell a CssClass tulajdonságot is kötni. Felmentést csak az kap, aki beviteli űrlapon használja, mégpedig az AssociatedControlID tulajdonsággal együtt!

Ennyi szépség után már csak egy dolog bántja a szemem: nem a LiteralModel.Encode az alapértelmezett, hanem a Transform, ami egyrészt a DefaultValue attribútumból, másrészt pedig a getter metódusból látszik:

    public LiteralMode get_Mode()
    {
        object obj2 = this.ViewState[ "Mode" ];
        if( obj2 != null )
        {
            return (LiteralMode) obj2;
        }
        return LiteralMode.Transform;
    }

Na de miért? Miért? Csak egy ötletem van, biztos kompatibilitási okokból, ugyanis a Mode tulajdonság új a .NET 2.0-ban. Na de nézzük, mire jó a Transform az MSDN szerint:

  • Encode: The literal control’s contents are HTML-encoded. 
  • PassThrough: The literal control’s contents are not modified. 
  • Transform: The literal control’s unsupported markup-language elements are removed. If the literal control is rendered on a browser that supports HTML or XHTML, the control’s contents are not modified. 

Magyarul egy normális böngésző esetén Transform=PassThrough, ami viszont tényleg megegyezik a Literal 1.1-beli viselkedésével. Mobil böngésző esetén viszont vigyázat, eltérő lehet a viselkedés!

 

Technorati tags:

Vélemény, hozzászólás?

Adatok megadása vagy bejelentkezés valamelyik ikonnal:

WordPress.com Logo

Hozzászólhat a WordPress.com felhasználói fiók használatával. Kilépés / Módosítás )

Twitter kép

Hozzászólhat a Twitter felhasználói fiók használatával. Kilépés / Módosítás )

Facebook kép

Hozzászólhat a Facebook felhasználói fiók használatával. Kilépés / Módosítás )

Google+ kép

Hozzászólhat a Google+ felhasználói fiók használatával. Kilépés / Módosítás )

Kapcsolódás: %s