AJAX et Silverlight Version 1.0 Z
2 AJAX & Silverlight 01 / 06 / 09 Sommaire 1 Introduction... 3 1.1 Silverlight... 3 1.2 AJAX... 3 2 Silverlight et SharePoint... 4 2.1 Installation Silverlight... 4 3 Ajax et SharePoint... 7 3.1 Installation AJAX... 7 4 Conclusion... 12
3 AJAX & Silverlight 01 / 06 / 09 1 Introduction 1.1 Silverlight L'émancipation de l'internet Riche a provoqué la création de plusieurs technologies dont notamment Flex, XUL ou encore Silverlight qui appartiennent respectivement à Adobe, Mozilla et Microsoft. Le leader en termes de création et de déploiement d'application Internet riche est Adobe Flash. On peut donc voir Silverlight comme une réponse de Microsoft à son concurrent direct Flash, et à sa technologie le Flex. Voilà pourquoi il est souvent décrit comme un " Flash-Killer". Si Microsoft vient se placer sur le marché des RIA c'est tout simplement qu'il est conscient que ce secteur est en pleine construction et qu'il représente un investissement d'avenir. Il apparait donc presque logique que le géant de l'informatique veuille se faire une place sur ce marché, et pas n'importe laquelle avec sa technologie Silverlight, des plus prometteuses. Mais, concrètement, Silverlight c'est quoi? En fait, Silverlight est un plugin pour navigateur. Une de ses caractéristiques est qu'il est multi-navigateur et multiplateforme ce qui signifie qu'il peut être déployé sur tous les navigateurs et surtout les systèmes d'exploitations. (Pour ce qui est de linux se référencer au projet Moonlight, une implémentation open source de Silverlight). Microsoft a beaucoup misé sur l'expérience utilisateur. Une RIA développée avec Silverlight devra donc être intuitive et ergonomique. De plus, Microsoft a aussi mis l'accent sur le multimédia notamment avec le contrôle MediaElement que nous détaillerons dans la suite de ce cours. Quelque exemple de site réalisé en Silverlight : - Le site de la Renault Laguna : http://www.laguna-coupe.com/ - Le site lancé par Microsoft pour faire découvrir Silverlight : http://www.tafiti.com/ - Le site officiel de Silverlight : http://www.microsoft.com/silverlight/ Nous verrons dans ce chapitre l intégration de cette technologie au niveau d un site SharePoint. 1.2 AJAX AJAX n est pas une technologie propre à Microsoft, qui en propose toutefois une implémentation, afin d étendre sa technologie permettant de développer des applications Web, la technologie ASP.NET : - Microsoft ASP.NET AJAX Library : framework JavaScript (nouveaux éléments de syntaxe, bibliothèque de classes complémentaire) - Microsoft ASP.NET AJAX Extensions, présentés sous la forme de nouveaux contrôles serveur ASP.NET, et classes associées - Microsoft ASP.NET AJAX Control Toolkit : un ensemble de contrôles Web enrichis (widgets). La philosophie de Microsoft ASP.NET AJAX, telle qu elle est présentée par Microsoft, est très orientée serveur : dans la continuité de la technologie ASP.NET, elle propose une implémentation basée sur des composants serveurs, Toutefois, cette implémentation est extensible, en nous laissant la possibilité de créer nos propres composants.
4 AJAX & Silverlight 01 / 06 / 09 2 Silverlight et SharePoint 2.1 Installation Silverlight Nous allons voir dans cette partie comment intégrer du Silverlight sur nos sites SharePoint. Pour pouvoir travailler en Silverlight, il faut tout d abord installé une suite de plug-in sur votre machine, pour cela je vous invite à regarder le cours sur Silverlight 3 sur dotnet-france. Une fois l installation de vos Tools et autres, vous allez avoir accès aux contrôles Silverlight dans votre toolbox sous Visual Studio 2008. Si vous avez besoin de contrôle supplémentaire, vous pouvez vous rendre également sur internet. L étapes que nous venons de passé et celle qui nous permet simplement de créer des composants Silverlight, maintenant nous allons voir comment procéder pour intégrer tous cela dans notre SharePoint. Vous allez devoir comme souvent modifier le fichier web.config de vos collections de site. Elles sont relativement lourde alors faites très attention. Voici les étapes à effectuer : Installer la dll disponible dans C:\Program Files\Microsoft SDKs\Silverlight\v2.0\Libraries\Server\System.Web.Silverlight.dll dans le gac (C:\Windows\assembly) Ajouter un type MIME à votre IIS: Extension:.xap MIME type: application/x silverlight app -Tout d abord vous devez placer ce bout de code au niveau de la balise configsection: <sectiongroup name="system.web.extensions" type="system.web.configuration.systemwebextensionssectiongroup, PublicKeyToken=31BF3856AD364E35"> <sectiongroup name="scripting" -Mettre type="system.web.configuration.scriptingsectiongroup, au niveau de l Assemblies le code suivant : <add PublicKeyToken=31BF3856AD364E35"> assembly="system.web.silverlight, Version=2.0.5.0, Culture=neutral, PublicKeyToken=31BF3856AD364E35"/> <section name="scriptresourcehandler" type="system.web.configuration.scriptingscriptresourcehandlersection, -Mettre PublicKeyToken=31BF3856AD364E35" ce bout de code dans la balise Controls requirepermission="false" : allowdefinition="machinetoapplication"/> <sectiongroup name="webservices" type="system.web.configuration.scriptingwebservicessectiongroup, <add tagprefix="asp" namespace="system.web.ui" assembly="system.web.extensions, Version=3.5.0.0, Version=3.5.0.0, Culture=neutral, Culture=neutral, PublicKeyToken=31BF3856AD364E35"/> PublicKeyToken=31BF3856AD364E35"> <add <section tagprefix="asp" name="jsonserialization" namespace="system.web.ui.webcontrols" assembly="system.web.extensions, type="system.web.configuration.scriptingjsonserializationsection, Version=3.5.0.0, Culture=neutral, PublicKeyToken=31BF3856AD364E35"/> PublicKeyToken=31BF3856AD364E35" requirepermission="false" allowdefinition="everywhere"/> -Modification au <section niveau de name="profileservice" la balise Httphandlers : type="system.web.configuration.scriptingprofileservicesection, PublicKeyToken=31BF3856AD364E35" requirepermission="false" allowdefinition="machinetoapplication"/> <section name="authenticationservice" type="system.web.configuration.scriptingauthenticationservicesection, PublicKeyToken=31BF3856AD364E35" requirepermission="false"
5 AJAX & Silverlight 01 / 06 / 09 <remove verb="*" path="*.asmx"/> <add verb="*" path="*.asmx" validate="false" PublicKeyToken=31BF3856AD364E35"/> <add verb="*" path="*_appservice.axd" validate="false" PublicKeyToken=31BF3856AD364E35"/> <add verb="get,head" path="scriptresource.axd" type="system.web.handlers.scriptresourcehandler, System.Web.Extensions, Version=3.5.0.0, Culture=neutral, PublicKeyToken=31BF3856AD364E35" validate="false"/> -Modification au niveau de la balise Httpmodules : <add name="scriptmodule" type="system.web.handlers.scriptmodule, PublicKeyToken=31BF3856AD364E35"/> -Modification au niveau de la balise suivante : <system.webserver> <validation validateintegratedmodeconfiguration="false"/> <modules> <add name="scriptmodule" precondition="integratedmode" type="system.web.handlers.scriptmodule, System.Web.Extensions, Version=3.5.0.0, Culture=neutral, </modules> <handlers> <remove name="webservicehandlerfactory-integrated" /> <add name="scripthandlerfactory" verb="*" path="*.asmx" precondition="integratedmode" <add name="scripthandlerfactoryappservices" verb="*" path="*_appservice.axd" precondition="integratedmode" <add name="scriptresource" precondition="integratedmode" verb="get,head" path="scriptresource.axd" type="system.web.handlers.scriptresourcehandler, System.Web.Extensions, Version=3.5.0.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35" /> </handlers> </system.webserver> -Et pour finir, il faut ajouter des assemblyidentity au niveau de la balise dependentassembly :
6 AJAX & Silverlight 01 / 06 / 09 <dependentassembly> <assemblyidentity name="system.web.extensions" publickeytoken="31bf3856ad364e35"/> <bindingredirect oldversion="1.0.0.0-1.1.0.0" newversion="3.5.0.0"/> </dependentassembly> <dependentassembly> <assemblyidentity name="system.web.extensions.design" publickeytoken="31bf3856ad364e35"/> <bindingredirect oldversion="1.0.0.0-1.1.0.0" newversion="3.5.0.0"/> </dependentassembly>
7 AJAX & Silverlight 01 / 06 / 09 3 Ajax et SharePoint 3.1 Installation AJAX Nous allons voir dans cette partie comment intégrer nos composant AJAX au niveau de notre SharePoint. Dans un premier temps il vous faut vous rendre sur le site suivant pour télécharger ASP.NET AJAX : http://www.asp.net/ajax/downloads ou sur le site de Microsoft : ASP.NET AJAX 1.0. Une fois l installation de votre ASP.NET AJAX vous allez avoir accès aux contrôles AJAX dans votre toolbox sous Visual Studio 2008. Si vous avez besoin de contrôle supplémentaire, vous pouvez vous rendre également sur le site suivant : http://www.asp.net/ajax/ajaxcontroltoolkit/samples. Dans un second temps vous allez devoir modifier votre web.config pour l intégration de l AJAX. Voici les étapes à suivre :
8 AJAX & Silverlight 01 / 06 / 09 Tout d abord vous devez placer ce bout de code au niveau de la balise configsection: <sectiongroup name="system.web.extensions" type="system.web.configuration.systemwebextensionssectiongroup, PublicKeyToken=31bf3856ad364e35"> <sectiongroup name="scripting" type="system.web.configuration.scriptingsectiongroup, PublicKeyToken=31bf3856ad364e35"> <section name="scriptresourcehandler" type="system.web.configuration.scriptingscriptresourcehandlersection, PublicKeyToken=31bf3856ad364e35" requirepermission="false" allowdefinition="machinetoapplication"/> <sectiongroup name="webservices" type="system.web.configuration.scriptingwebservicessectiongroup, PublicKeyToken=31bf3856ad364e35"> <section name="jsonserialization" type="system.web.configuration.scriptingjsonserializationsection, PublicKeyToken=31bf3856ad364e35" requirepermission="false" allowdefinition="everywhere" /> <section name="profileservice" type="system.web.configuration.scriptingprofileservicesection, PublicKeyToken=31bf3856ad364e35" requirepermission="false" allowdefinition="machinetoapplication" /> <section name="authenticationservice" type="system.web.configuration.scriptingauthenticationservicesection, PublicKeyToken=31bf3856ad364e35" requirepermission="false" allowdefinition="machinetoapplication" /> </sectiongroup> </sectiongroup> </sectiongroup> Ajouter ce code dans la balise Page : <controls> <add tagprefix="asp" namespace="system.web.ui" assembly=" </controls> Mettre au niveau de l Assemblies le code suivant : <add assembly="system.web.extensions, Version=1.0.61025.0, Culture=neutral,
9 AJAX & Silverlight 01 / 06 / 09 Modification au niveau de la balise Httphandlers : <add verb="*" path="*.asmx" validate="false" <add verb="*" path="*_appservice.axd" validate="false" <add verb="get,head" path="scriptresource.axd" type="system.web.handlers.scriptresourcehandler, System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35" Modification validate="false"/> au niveau de la balise Httpmodules : <add name="scriptmodule" type="system.web.handlers.scriptmodule, Nous devons ajouter ce bout de code dans la balise SafeControls : <SafeControl Assembly="System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35" Namespace="System.Web.UI" TypeName="*" Safe="True" />
10 AJAX & Silverlight 01 / 06 / 09 Ajoutons dans la balise Webservices ceci : <system.web.extensions> <scripting> <webservices> <!-- Uncomment this line to enable the authentication service. Include requiressl="true" if appropriate. --> <!-- <authenticationservice enabled="true" requiressl = "true false"/> --> <!-- Uncomment these lines to enable the profile service. To allow profile properties to be retrieved and modified in ASP.NET AJAX applications, you need to add each property name to the readaccessproperties and writeaccessproperties attributes. --> <!-- <profileservice enabled="true" readaccessproperties="propertyname1,propertyname2" writeaccessproperties="propertyname1,propertyname2" /> --> </webservices> <!-- <scriptresourcehandler enablecompression="true" enablecaching="true" /> --> </scripting> </system.web.extensions> <system.webserver> <validation validateintegratedmodeconfiguration="false"/> <modules> <add name="scriptmodule" precondition="integratedmode" type="system.web.handlers.scriptmodule, System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, </modules> <handlers> <remove name="webservicehandlerfactory-integrated" /> <add name="scripthandlerfactory" verb="*" path="*.asmx" precondition="integratedmode" <add name="scripthandlerfactoryappservices" verb="*" path="*_appservice.axd" precondition="integratedmode" <add name="scriptresource" precondition="integratedmode" verb="get,head" path="scriptresource.axd" type="system.web.handlers.scriptresourcehandler, System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35" /> </handlers> </system.webserver>
11 AJAX & Silverlight 01 / 06 / 09 Et la dernière étape est d ajouter un script manager a votre Master Page pour pouvoir utilisé cette technologie : <form id="form1" runat="server"> <asp:scriptmanager ID="ScriptManager01" runat="server" /> <div id="container"> <div id="header"> Haut de page </div> <div> <div id="content"> <asp:contentplaceholder id="contentplaceholder1" runat="server"> </asp:contentplaceholder> </div> <div id="footer"> Bas de page </div> </div> </div> </form>
12 AJAX & Silverlight 01 / 06 / 09 4 Conclusion Ce chapitre nous aura permis de faire la configuration de nos fichiers web.config pour l utilisation d AJAX et Silverlight. Le développement d une Webpart en Silverlight et AJAX se fait exactement de la même façon qu une webpart classique, il suffit simplement de maitrisé les technologies correspondantes.