Sitecore ajaxified – Die Favoritenliste

In einem aktuellen Projekt wollten wir dem (anonymen) Nutzer die Möglichkeit geben einzelne Produkte in eine Favoritenliste abspeichern zu können um diese bei einem späteren Besuch der Webseite wieder abrufen zu können. Das Ganze sollte möglichst ohne reload der Seite realisiert werden.

Mithilfe von .Net 4.0 und jQuery lassen sich ohne großen Aufwand Ajax Funktionalitäten für Sitecore Webseiten umsetzen.

Dazu benötigen wir drei Dinge:

  1. Cookie handling
  2. Einen Sitecore Service
  3. Javascript

Im folgenden Abschnitt wird eine beispielhafte Implementierung der Favoritenliste vorgestellt.

Die Favorites Klasse stellt uns Funktionen zur Verfügung, die uns vereinfachten Zugriff auf die vom HttpContext übergebenen Cookies liefert, bzw. die manipulierten Cookies zurück an den Nutzer liefert.

namespace Namics.Internet.Core
{
    using System.Collections.Generic;
    using Sitecore.Data;
    using System.Web;
    using System.Linq;
    using Sitecore.Data.Items;
 
    public static class Favorites
    {
        private const string FAVORITE_COOKIE_STRING = "FAVORITE_COOKIE";

        private static HttpCookie FavoriteCookie
        {
            get
            {
                if (HttpContext.Current.Request.Cookies[FAVORITE_COOKIE_STRING] == null)
                {
                    HttpContext.Current.Request.Cookies.Add(new HttpCookie(FAVORITE_COOKIE_STRING));
                }

                return HttpContext.Current.Request.Cookies[FAVORITE_COOKIE_STRING];
            }
        }

        public static void Add(Item pItm)
        {
            FavoriteCookie.Values.Add(pItm.ID.ToString(), string.Empty);
            Update();            
        }

        public static void Remove(Item pItm)
        {
            FavoriteCookie.Values.Remove(pItm.ID.ToString());  
            Update();      
        }

        public static void Clear()
        {
            FavoriteCookie.Values.Clear();
            Update();
        }

        public static IEnumerable<Item> GetAll()
        {
            return FavoriteCookie.Values.AllKeys.Select(key => Sitecore.Context.Database.GetItem(ID.Parse(key)));
        }

        private static void Update()
        {
            HttpContext.Current.Response.Cookies.Add(FavoriteCookie);
        }
    }
}

 

Ein Sitecore Service soll nun die Funktionen der Favorites Klasse dem Javascript Client zur Verfügung stellen.
Durch die Einfachheit des Services und nicht für die Öffentlichkeit bestimmten Verwendung der API konnten wir das im .Net 4.0 eingeführte ExpandoObject verwenden um den Code kurz zu halten (und uns z.B. das Schreiben einer serialisierbaren Klasse zu sparen).

namespace Namics.Internet.Core.Handlers
{
    using System.Dynamic;
    using System.Web;
    using Newtonsoft.Json;
    using Sitecore.Data;
    using System.Linq;
   
    public class FavoritesServiceHandler : IHttpHandler
    {
        public bool IsReusable
        {
            get { return true; }
        }

        public void ProcessRequest(HttpContext pContext)
        {
            pContext.Response.ContentType = "application/json";
            dynamic response = new ExpandoObject();

            var command = HttpContext.Current.Request.QueryString["cmd"];
            var idStr = HttpContext.Current.Request.QueryString["id"];        

            if (!string.IsNullOrEmpty(idStr))
            {
                var item = Sitecore.Context.Database.GetItem(ID.Parse(idStr));

                switch (command)
                {
                    case "add":
                        Favorites.Add(item);
                        break;
                    case "remove":
                        Favorites.Remove(item);
                        break;
                }
            }
            else
            {
                switch (command)
                {
                    case "clear":
                        Favorites.Clear();                      
                        break;
                    case "get":
                        response.Result = Favorites.GetAll().ToList();                      
                        break;
                }
            }
           
            response.Success = true;
            pContext.Response.Write(JsonConvert.SerializeObject(response));
        }
    }
}

 

Den Service müssen wir in der Sitecore.config und der Web.config noch wie folgt registrieren.

In der Sitecore.config im Abschnitt

 <customHandlers> 

fügen wir diese Zeile hinzu:

<handler trigger="~/service/favorites" handler="FavoritesServiceHandler.ashx"/> 

und in der Web.config im Abschnitt

 <httpHandlers>
<add verb="*" path="FavoritesServiceHandler.ashx" type="Namics.Internet.Core.Handlers.FavoritesServiceHandler, Namics.Internet.Core" />

 

Nun fehlt noch der Clientseitige Teil, der mit jQuery in wenigen Zeilen umgesetzt werden kann.

$('#clear').bind("click", function () {
 $.ajax({
   url: 'http://mywebsite/service/favorites?cmd=clear',
   success: function (data) {
    if (data.Success) {
     alert("Gelöscht!");
    }
   }
 });
});

 

So konnte die gewünschte Funktionalität in wenigen Schritten und ohne grösseren Aufwand in Sitecore umgesetzt werden.

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.

*

*

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>