WCF und Silverlight in SharePoint. Teil 2: eine Silverlight-Anwendung entwickeln, die den Dienst nutzt

Das ist der zweite Teil einer Serie über eigene WCF-Dienste in SharePoint und deren Nutzung in Silverlight. Im ersten Teil wurde gezeigt, wie der WCF-Dienst entwickelt wurde. Hier wird jetzt die zugehörige Silverlight-Anwendung entwickelt, die diesen Dienst nutzt.

Teil 2: eine Silverlight-Anwendung entwickeln, die den Dienst nutzt

Die grundsätzliche Entwicklung mit Silverlight soll hier nicht gezeigt werden. Auch dafür sollten sich im Web ausreichend Anleitungen finden lassen. Hier geht es nur um eine einfache Silverlight-Anwendung, die unseren im letzten Teil entwickelten WCF-Dienst nutzt.

Bei meinem "echten" Projekt ist noch eine Silverlight-Bibliothek dazwischengeschaltet, weil die gesamte Lösung aus mehreren Silverlight-Anwendungen besteht, die alle denselben Dienst und dieselben Businessdaten nutzen.

Schritt 1: Erstellen des Projekts in Visual Studio

Wir fügen unserer Projektmappe ein neues Projekt vom Typ Silverlight Application hinzu:

Ich habe es SilverlightDemo genannt. Im sich öffnenden Dialog wird die Option zum Erstellen eines Webprojektes (das normalerweise zum Testen der Silverlight-Anwendung dient) abgewählt:

Unsere Silverlight-Anwendung würde wegen Authentifizierungsproblemen im Testprojekt sowieso nicht (ohne Anpassungen) funktionieren und wir wollen sie ja in SharePoint haben. Als Silverlight-Version habe ich 3 gewählt. Version 4 sollte aber ebenso funktionieren.

Dem Silverlight-Projekt fügen wir jetzt noch Verweise auf System.Runtime.Serialization und System.ServiceModel (s. Teil 1) hinzu, damit wir WCF nutzen können. Zusätzlich brauchen wir Verweise auf die beiden Silverlight-Client-Assemblies von SharePoint, damit wir den Kontext bekommen. Die Assemblies heißen Microsoft.SharePoint.Client.Silverlight und Microsoft.SharePoint.Client.Silverlight.Runtime und befinden sich im ClientBin-Ordner:

Außerdem brauchen wir einen Verweis auf unseren Dienst (Rechtsklick auf References -> Add Service Reference):

In diesem Dialog gibt man oben die URL des Dienstes an (mit dem Suffix MEX, wie im Browser am Ende von Teil 1) und klickt dann auf Go. Wenn alles klappt, dann wird der Dienst mit seinen Methoden gefunden und angezeigt. Visual Studio erstellt dann Proxy-Klassen für den Dienst selbst und alle Entitäten, die die Methoden des Dienstes eventuell liefern. Der Namensraum, in dem diese Klassen erstellt werden, kann unten angegeben werden.

Schritt 2: die Silverlight-Oberfläche

Die Oberfläche der Silverlight-Anwendung, d.h. das was die Benutzer später sehen, befindet sich in MainPage.xaml. Ich habe dort einen Button zum Aufruf des Dienstes und einen TextBlock zur Anzeige des Ergebnisses eingefügt. Die Datei sieht dann so aus:

<UserControl x:Class="SilverlightDemo.MainPage"

  xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation&quot;

  xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml&quot;

  xmlns:d="http://schemas.microsoft.com/expression/blend/2008&quot;

  xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006&quot;

  mc:Ignorable="d">

 

  <Grid x:Name="LayoutRoot" Background="White">

    <StackPanel Name="stackPanel1" Orientation="Horizontal">

      <Button Height="30" Width="150" Content="Klick mich" Name="Button1" Click="Button1_Click" />

      <TextBlock Height="30" Text="klick den Button" Name="TextBlock1" Padding="6" />

    </StackPanel>

  </Grid>

</UserControl>

 

Optisch sieht das so aus:

Schritt 3: der Code zum Aufruf des Dienstes

Zuerst müssen wir den Kontext zu SharePoint herstellen. Das geschieht durch Hinzufügen einer Zeile zum Application_Startup-Ereignis, das sich in der Datei App.xaml.cs findet. Der gesamte Ereignishandler sieht dann so aus:

private void Application_Startup(object sender, StartupEventArgs e) {

  ApplicationContext.Init(e.InitParams, SynchronizationContext.Current);

  this.RootVisual = new MainPage();

}

Damit das funktioniert, muß man noch eine using-Direktive oben einfügen:

using Microsoft.SharePoint.Client;

Über die Klasse ApplicationContext, die zum SharePoint-Silverlight-Client gehört, erhält man später Zugriff auf den SharePoint-Kontext.

Jetzt können wir uns dem CodeBehind der eigentlichen Anwendung in MainPage.xaml.cs zuwenden. Im Ereignishandler für den Buttonklick definieren wir zunächst die Umgebung für den Dienst:

BasicHttpBinding binding = new BasicHttpBinding();

binding.Security.Mode = BasicHttpSecurityMode.TransportCredentialOnly;

EndpointAddress endpoint = new EndpointAddress(ApplicationContext.Current.Url + "/_vti_bin/WcfDemo/DemoService.svc");

 

Durch Setzen der EndpointAddress auf die aktuelle URL der Website plus den Pfad zu unserem Dienst wird erreicht, daß der Dienst immer im richtigen Kontext aufgerufen wird. Innerhalb des Dienstes kann man so z.B. über SPContext.Current.Site bzw. SPContext.Current.Web auf die aktuelle Websitesammlung bzw. auf die aktuelle Website von SharePoint zugreifen.

Jetzt können wir uns damit eine Instanz des Dienstproxy erzeugen:

DemoServiceClient srv = new DemoServiceClient(binding, endpoint);

In Silverlight können externe Dienstaufrufe immer nur asynchron erfolgen. Visual Studio hat das beim Erzeugen der Proxyklassen berücksichtigt und entsprechende EventHandler und Methodenaufrufe erzeugt. Wir rufen also die Methode GetMessage unseres Dienstes asynchron auf. Sobald der Dienst antwortet, ruft dieser dann den vorher gesetzten EventHandler auf und dort verarbeiten wir dann das Ergebnis:

srv.GetMessageCompleted += GetMessageCompleted;

srv.GetMessageAsync();

Und hier noch der entsprechende EventHandler:

private void GetMessageCompleted(object sender, GetMessageCompletedEventArgs e) {

  TextBlock1.Text = e.Result;

}

Wie man sieht, bekommt man den Rückgabewert der Dienstmethode hier über die Result-Eigenschaft der entsprechenden EventArgs. Man kann sie direkt verwenden und z.B. in einem TextBlock ausgeben. Um die Synchronisierung der verschiedenen Threads kümmert sich der erzeugte Proxy automatisch.

Hier nochmal der gesamte Code von MainPage.xaml.cs:

using System;

using System.Windows;

using System.Windows.Controls;

using System.ServiceModel;

using SilverlightDemo.ServiceProxy;

using Microsoft.SharePoint.Client;

 

namespace SilverlightDemo {

  public partial class MainPage : UserControl {

    public MainPage() {

      InitializeComponent();

    }

 

    private void Button1_Click(object sender, RoutedEventArgs e) {

      BasicHttpBinding binding = new BasicHttpBinding();

      binding.Security.Mode = BasicHttpSecurityMode.TransportCredentialOnly;

      EndpointAddress endpoint = new EndpointAddress(ApplicationContext.Current.Url + "/_vti_bin/WcfDemo/DemoService.svc");

      DemoServiceClient srv = new DemoServiceClient(binding, endpoint);

      srv.GetMessageCompleted += GetMessageCompleted;

      srv.GetMessageAsync();

    }

 

    private void GetMessageCompleted(object sender, GetMessageCompletedEventArgs e) {

      TextBlock1.Text = e.Result;

    }

  }

}

 

Schritt 4: Abschluß und Test

Unser gesamtes Projekt sieht jetzt so aus:

Sobald man das Projekt kompiliert hat, kann es getestet werden. Dazu lädt man die erzeugte SilverlightDemo.xap-Datei (zu finden im Bin\Debug– bzw. Bin\Release-Ordner) in eine beliebige Dokumentbibliothek in SharePoint hoch und merkt sich den Pfad zur Datei (z.B. /site/library/SilverlightDemo.xap). Jetzt fügt man auf einer beliebigen Webpartseite das Silverlight-Webpart, das zu SharePoint 2010 gehört, hinzu:

Im darauf erscheinenden Dialog gibt man jetzt die URL zur vorher hochgeladenen Datei an (absolut oder relativ):

Das Webpart erscheint dann auf der Seite so:

Und nachdem auf den Button geklickt wurde:

Wie man sieht wird der Text aus der web.config des Dienstes ausgegeben. Dieser kann jetzt geändert werden und die Änderung wird dann sofort in Silverlight angezeigt – natürlich nur, wenn man erneut auf den Button klickt 😉

3 Gedanken zu “WCF und Silverlight in SharePoint. Teil 2: eine Silverlight-Anwendung entwickeln, die den Dienst nutzt

  1. In WSS, I’d love to see the WYSIWYG editor ennehcad to make placing images easier. Perhaps have it browse the site’s picture library by default, and add the ability to upload to the library at the time editing is happening. Also enhance the linking functionality to be able to pop links up in a new window by adding the _blank attribute, and also let users browse the document library so that they can add links to documents in the library to their content.Perhaps this exists in the portal server or one of the other pay products, but not having it in WSS requires extra training when showing non technicals how to add content.

    Gefällt mir

Kommentar verfassen

Trage deine Daten unten ein oder klicke ein Icon um dich einzuloggen:

WordPress.com-Logo

Du kommentierst mit Deinem WordPress.com-Konto. Abmelden / Ändern )

Twitter-Bild

Du kommentierst mit Deinem Twitter-Konto. Abmelden / Ändern )

Facebook-Foto

Du kommentierst mit Deinem Facebook-Konto. Abmelden / Ändern )

Google+ Foto

Du kommentierst mit Deinem Google+-Konto. Abmelden / Ändern )

Verbinde mit %s