Wer mit dem Internet Explorer 8 dieses Blog besucht, dem ist vieleicht schon die grüne Schaltfläche in seiner Befehlsleiste aufgefallen die anzeigt, dass hier ein Web Slice verfügbar ist.

WebSlice Button

Nach dem ich heute durch diesen Artikel auf Kay Giza’s Blog, in dem es ja eigentlich um Schnellinfos geht, wieder einmal über Web Slices gestolpert bin, wollte ich mir dieses Feature einmal genauer ansehen. In der MSDN bin ich auf den Artikel Subscribing to Content with Web Slices gestoßen. Wenn man den Artikel so durchliest entsteht sehr schnell der Eindruck, dass dieses Feature sehr einfach in eine bestehende Webanwendung zu implementieren ist.
Der Eindruck täuscht nicht. Um Web Slices in meinem Blog zur Verfügung zu stellen benötigte ich nicht mehr als zwei Div-Tags und einen Link. Doch jetzt der Reihe nach.

Der IE 8 erkennt ein angebotenes Web Slice an einer speziellen Verknüpfung im Header der jeweiligen Webseite.

<link rel="default-slice" type="application/x-hatom" href="#actualPosts" />

Das rel-Attribut muss laut Dokumentation mit “default-slice” belegt werden. Der Typ ist ebenfalls fest vergeben. Die href der Verknüpfung muss auf die ID das Div zeigen, welches den Inhalt des Web Slice enthält. Ab jetzt erkennt der IE 8 ein angebotenes Web Slice in der Seite und aktiviert die Schaltfläche zum hinzufügen des angebotenen Web Slice in der Favoritenleiste.
Wie beim Link muss auch bei den Div’s auf Namenskonventionen geachtet werden. Das umschließende Div muss im class-Attribut den Namen “hslice” erhalten und eine id auf welche die Verknüpfung im Headelement der Seite verweisen kann. Um einen Titel für den Web Slice zur Verfügung zu stellen, muss im verwendetet Titel Element der Wert “entry-title” an das class-Attribut übergeben werden. Der Titel sowie der Inhalt müssen in ein Element eingeschlossen sein, welches ein class-Attribut mit dem Wert "entry-content" enthält.

<!-- begin Web slice -->
<div class="hslice" id="actualPosts" style="display: none">
    <div class="entry-content">
        <div class="panel">
            <h2 class="entry-title">
                klaus_b@.NET (Aktuelle Artikel)
            </h2>
            <div class="sliceContent">
                <kb:newPosts ID="NewPosts1" runat="server" />
            </div>
        </div>
    </div>
</div>
<!-- end Web slice -->

Das umschließende Div class=”hslice” wird mittels CSS ausgeblendet. Der Inhalt, gekennzeichnet mit “entry-content”, wird im Flayout einwandfrei dargestellt. Bei abonniertem Web Slice sieht das im IE 8 dann so aus:

WebSlice Flayout

Eine andere Möglichkeit ist die Nutzung von “entry-content” als Verknüpfung um den Inhalt einer anderen Datei darzustellen. Wenn in dieser externen Datei Links verwendet werden, müssen diese unbedingt mit target=”_blank” versehen werden, da standardmäßig alle Links im Flayout geöffnet werden. Wenn “entry-content” als Link verwendet wird, sollte auch ein Link mit dem rel “bookmark” verwendet werden, der den Open Button des Flayout anweist, was bei einem Klick auf den Button geöffnet werden soll. Auch hier empfiehlt sich ein Link-Target “_blank” zu verwenden um nicht die Zielseite im Flayout zu öffnen.

<!-- begin Web slice -->
<div class="hslice" id="actualPosts" style="display: none">
    <div class="panel">
        <h2 class="entry-title">
            klaus_b@.NET (Aktuelle Artikel)
        </h2>
        <a rel="entry-content" href="<%=VirtualPathUtility.ToAbsolute("~/")+ "themes/klaus_b/Slices.aspx#actualPosts"%>"
            style="display: none"></a>
        <a rel="bookmark" href="<%=VirtualPathUtility.ToAbsolute("~/")%>"
                 style="display: none"></a>
    </div>
</div>
<!-- end Web slice -->

Um immer die aktuelle Version einer externen Seite zu zeigen, empfiehlt hier die Dokumentation das zwischenspeichern der selbigen zu unterbinden. Wenn, wie in meinem Fall, eine aspx-Seite verwendet wird, lässt sich das einfach mit der Methode SetNoStore aus der HttpCachePolicy-Klasse erledigen.

Der einzige Wehrmutstropfen ist das aktualisieren des Web Slice mittels des Button im Flyout. Hier wird immer ein Fehler angezeigt. Ich war schon am verzweifeln, bis ich testweiße den Web Slice von My Msdn abonniert habe. Auch dieser Web Slice erzeugt den selben Fehler beim aktualisieren im Flyout. Da der IE 8 ja noch ein Release Kandidat und die Doku über Web Slices auch noch mit dem preliminary-Hinweis versehen ist, warten wir also ab was bis zur RTM noch so alles passiert. In der Zwischenzeit kann ja fleißig experimentiert werden.

Eine Anmerkung noch zum testen in Visual Studio. Damit der Web Slice auch vom IE 8 beim testen mit dem Webdev-Server erkannt wird, müssen die Intranet Seiten aus der Kompatibilitätsansicht herausgenommen werden.

Technorati-Tags: | |
Wenn ihnen der Artikel gefallen hat oder er für sie hilfreich war, bitten "kicken" sie ihn.
kick it on dotnet-kicks.de