Itek Developer

Programmare è arte

Visuallizzare RSS Feed con asp.net e jqueryUI

Visualizzare i Feeds usando l’oggetto DataSet

Ci sono vari metodi per visualizzare gli RSS Feeds. Quello preso in esame in questo articolo si basa sull ‘ utilizzo dell’oggetto DataSet del .NET Framework. Questo metodo permette di leggere il contenuto del feed in modo molto semplice con poche linee di codice.

Come molti di voi sapranno , l’oggetto DataSet è una classe in grado di contenere in memoria tabelle provenienti dai database ed implementa i vari metodi per gestirne i dati. Un file RSS , che non è altro che un file xml opportunamente formattato , può essere tranquillamente convertito e  memorizzato come una tabella. L’oggetto DataSet  mette a disposizione due funzioni membro DataSet.ReadXml(string url-path) e DataSet.ReadXmlSchema(string file.xsd) che permettono di mappare un file xml all’interno del DataSet esattamente come avviene per le tabelle di un database. Per fare ciò è necessario che il DataSet conosca la stuttura del file file xml. E’ possibile definire la struttura di un qualsiasi file xml tramite un file .xsd ( Xml Schema). Vediamo uu semplice esempo di un file xml e il relativo schema xsd :

File xml :
Esempio di un file RSS

Esempio di un file RSS

 

File xsd :
Relativo file xsd

Relativo file xsd

Come potete notare il file xsd è a sua volta un file xml che va a definire, per ogni nodo del file xml che deve rappresentare , il nome , il tipo del dato che dovrà contenere e la struttura gerarchica ( il file xsd in figura è una semplificazione del file xsd dell’intero standard RSS ).  Con la  creazione di un  file xsd facciamo esattamente ciò che avviene quando andiamo a definire le varie tabelle di un database e i relativi campi. Utilizzando la funzione membro DataSet.ReadXmlSchema(“File.xsd”) nell’oggetto DataSet vengono create le tabelle seguendo quanto definito nel file xsd. Se provate ad aprire con visual studio il file xsd vedrete uno schema che rappresenta tutte le tabelle e i relativi campi definiti nel file xsd.

Schema delle tabelle all’interno di un DataSet generato da un file xsd :

Rappresentazione di un file xsd all'interno di un DataSet

Nella figura potete vedere esattamente ciò che viene creato all’interno del DataSet subito dopo aver eseguito la funzione DataSet.ReadXmlSchema(“File.xsd”).

Una volta creata la struttura tabellare nel DataSet possiamo andare a leggere con la funzione membro DataSet.ReadXml(“File.xml”) i dati che sono appunto contenuti nel file RSS. Il parametro url-path della funzione DataSet.ReadXml(string url-path) rappresenta la stringa che contiene il path ad un file locale o l’ url del server remoto dal quale leggere il file xml.

Passiamo ora ad analizzare il codice. Per prima cosa occorre creare i metodi che vanno a leggere i dati del file RSS. Io ho preferito utilizzare un WebService in modo tale che i metodi implementati possano essere riutilizzati in altre applicazioni. Vediamo il file rssService.asmx :

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Services;
using System.Data;
using System.Xml;
using System.Xml.Schema;

namespace zanninoNet
{
    /// <summary>
    /// Summary description for rssServer
    /// </summary>
    [WebService(Namespace = "http://tempuri.org/")]
    [WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
    [System.ComponentModel.ToolboxItem(false)]
    // To allow this Web Service to be called from script, using ASP.NET AJAX, uncomment the following line. 
    [System.Web.Script.Services.ScriptService]
    public class rssServer : System.Web.Services.WebService
    {

        [WebMethod]
        public DataTable GetFeeds(string feedUrl)
        {
            try
            {

                DataSet rssDataSetService = new DataSet();
                DataTable dt = new DataTable();
                string filepath = Server.MapPath("~");
                filepath = filepath + "xmlSchema.xsd";
                rssDataSetService.ReadXmlSchema(filepath);
                rssDataSetService.ReadXml(feedUrl);
                dt = rssDataSetService.Tables["item"];
                return dt;
            }
            catch (Exception ex)
            {

                string msg = ex.Message;
                return null;
            }
        }

        [WebMethod]
        public string GetTitle(string feedUrl)
        {
            try
            {
                XmlSchemaSet xschema = new XmlSchemaSet();

                DataSet rssDataSetService = new DataSet();
                DataTable dt = new DataTable();
                string filepath = Server.MapPath("~");
                filepath = filepath + "xmlSchema.xsd";

                rssDataSetService.ReadXmlSchema(filepath);

                rssDataSetService.ReadXml(feedUrl);

                dt = rssDataSetService.Tables["channel"];
                return dt.Rows[0][0].ToString();
            }
            catch (Exception ex)
            {

                string msg = ex.Message;
                return msg;
            }
        }
    }
}

Il WebMethod  public DataTable GetFeeds(string feedUrl) ha come parametro la stringa feedUrl , che è l’url dal quale leggere il file RSS  , e restituisce un oggetto DataTable che contine la tabella con tutti i dati relativi agli item. Passiamo ad analizzare il corpo del metodo :

Creiamo gli oggeti DataSet e Datatable :

DataSet rssDataSetService = new DataSet();
DataTable dt = new DataTable();

Creiamo la stringa che contiene il Path al file xmlSchema.xsd ( che contiente lo schema completo per un file RSS ) che deve essere presente sul server sul quale viene eseguito il nostro programma :

string filepath = Server.MapPath("~");
filepath = filepath + "xmlSchema.xsd";

Applichiamo lo schema al DataSet e leggiamo i dati :

rssDataSetService.ReadXmlSchema(filepath);
rssDataSetService.ReadXml(feedUrl);

Ora che nel DatSet abbiamo tutte le tabelle e i relativi dati del nostro feed , selezioniamo la tabella “item” nella quale ogni record rappresenta un item del canale RSS :

dt = rssDataSetService.Tables["item"];
return dt;

Il WebMethod public string GetTitle(string feedUrl) restituisce una stringa che contiene il titolo del canale RSS. Sostanzialmente le istruzioni che esegue sono identiche a quelle del metodo GetFeeds() con la differenza che questa volta andiamo a recuperare i dati dalla tabella “channel” :

dt = rssDataSetService.Tables["channel"];
return dt.Rows[0][0].ToString();

Adesso passiamo ad analizzare la parte di codice che permette di visualizzare sul browser i dati che i metodi del WebService ci restituiscono. Ciò avviene all’interno di una pagina aspx di nome Default.aspx. Vediamo la parte di codice html che si occupa di visualizzare gli items del nostro feed :

public string GetTitle(string feedUrl)
<div id="accordion">
    <asp:Repeater ID="rssrepeater" runat="server">
            <ItemTemplate>
                <h3><a href="#"><%# DataBinder.Eval(Container.DataItem, "title") %></a></h3>
                <div  id="item<%# DataBinder.Eval(Container.DataItem, "item_id") %>"  class="rssItem">
                        <a href="<%# DataBinder.Eval(Container.DataItem, "link") %>"><%# DataBinder.Eval(Container.DataItem, "title") %></a>
                        <%# DataBinder.Eval(Container.DataItem, "description") %>
                </div>
            </ItemTemplate>
        </asp:Repeater>
    </div>

Utilizzando un Server Control Repeater possiamo iterare tutti gli items del feed e definire tramite l’ItemTemplate come i dati dovranno essere visulizzare nel browser. Per rendere il layout grafico più accattivante ho deciso di utilizzare le funzionalità della libreria javascript jqueryUI . Di conseguenza ho  predisposto l’ItemTemplate in modo tale da poter applicare  al <div id=accordion> la funzione $(‘#accordion’).accordion().  Per poter utilizzare il DataBinder occorre settare il datasource per il controllo Repeater. Il datasource sarà la tabella che ci viene restituita dal WebMethod GetFeeds() del nostro WebService.  Ciò avviene nel code-behind  . Vediamo il codice :

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using zanninoNet;
using System.Data;
namespace RSSReader
{
    public partial class Default : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {
            if (!IsPostBack)
            {
                rssServer rs = new rssServer();
                DataTable dt = rs.GetFeeds("http://gdata.youtube.com/feeds/base/standardfeeds/IT/top_rated?client=ytapi-youtube-browse&alt=rss&time=today");

                if ((dt != null) && (dt.TableName == "item"))
                {
                    txbUrlStatus.Text = rs.GetTitle("http://gdata.youtube.com/feeds/base/standardfeeds/IT/top_rated?client=ytapi-youtube-browse&alt=rss&time=today");
                    rssrepeater.DataSource = dt;
                    rssrepeater.DataBind();

                }
                else
                {
                    rssrepeater.DataSource = null;
                    rssrepeater.DataBind();
                    txbUrlStatus.Text = "Impossibile connettersi alla risorsa che contiene i feeds : controllare se l'indirizzo inseritto è esatto";
                }
            }
        }

        protected void btnUrl_Click(object sender, EventArgs e)
        {
            rssServer rs = new rssServer();
            DataTable dt = rs.GetFeeds(txbUrl.Text);

            if ((dt != null) && (dt.TableName == "item"))
            {
                txbUrlStatus.Text = rs.GetTitle(txbUrl.Text);
                rssrepeater.DataSource = dt;
                rssrepeater.DataBind();

            }
            else
            {
                  rssrepeater.DataSource = null;
                  rssrepeater.DataBind();
                  txbUrlStatus.Text = "Impossibile connettersi alla risorsa che contiene i feeds : controllare se l'indirizzo inseritto è esatto";
            }
        }

    }
}

Focalizziamoci sull’handler dell’evento Click del bottone “Visualizza” presente all’intero della pagina Default.aspx. Quando premiamo, l’applicazione esegue la funzione protected void btnUrl_Click(object sender, EventArgs e) ed è propio all’interno di questa  che avviane il databinding dei dati provenienti dal WebService ed il datasource del nostro controllo Repeater. Vediamo come :

Creo un’istanza del WebService :

rssServer rs = new rssServer();

Assegno un oggetto DataTadble dt ed assegnoa ad essa la tabella che ritorna la funzione GetFeeds(txbUrl.Text). txbUrl è un server controllo TextBox che si trova all’interno del file Default.aspx e contiene l’url dal quale leggere il file RSS :

DataTable dt = rs.GetFeeds(txbUrl.Text);

Adesso  occorre controllare se il caricamento del file RSS ha avuto successo e in caso positivo procediamo con il databinding del controllo Repeater :

if ((dt != null) && (dt.TableName == "item"))
            {
                txbUrlStatus.Text = rs.GetTitle(txbUrl.Text);
                rssrepeater.DataSource = dt;
                rssrepeater.DataBind();

            }

Nel caso in cui il caricamento dei dati non ha avuto successo settiamo il DataSource del controllo Repeater = null e visulizziamo un messaggio di errore nel Server Cotnrol TextBox txbUrlStatus anch’esso contenuto in nel file  Default.aspx. ( Il controllo TextBox txbUrlStatus viene anche usato , quando il caricamento dei dati è avvenuto con successo , per visualizzare il titolo del canale RSS ) :

else
            {
                  rssrepeater.DataSource = null;
                  rssrepeater.DataBind();
                  txbUrlStatus.Text = "Impossibile connettersi alla risorsa che contiene i feeds : controllare se l'indirizzo inseritto è esatto";
            }

La funzione protected void Page_Load(object sender, EventArgs e) che viene seguita ogni volta che la pagina viene caricata , ripete quanto aviene nella funzione protected void btnUrl_Click(object sender, EventArgs e) con la differenza che l’url da cui caricare il file RSS è impostato all’indirizzo che recupera da youtube i video più cliccati del giorno. Quindi la prima volta che si avvia l’applicazione ci ritroveremo con la pagina del nostro browser che visualizza gli item di un canale di nostro gradimento. Ovviamente potete cambiare l’url in modo che all’avvio venga visualizzato il votro Feed preferito. Ecco dove viene impostato :

public partial class Default : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {
            if (!IsPostBack)
            {
                rssServer rs = new rssServer();
                DataTable dt = rs.GetFeeds("http://gdata.youtube.com/feeds/base/standardfeeds/IT/top_rated?client=ytapi-youtube-browse&alt=rss&time=today");

                if ((dt != null) && (dt.TableName == "item"))
                {
                    txbUrlStatus.Text = rs.GetTitle("http://gdata.youtube.com/feeds/base/standardfeeds/IT/top_rated?client=ytapi-youtube-browse&alt=rss&time=today");

Ecco uno screenshot dell’applicazione in funzione :

RSS Reader screenshot

RSS Reader screenshot

DOWNLOAD DEL CODICE COMPLETO PER IL FRAMEWORK 3.5

About these ads

Rispondi

Inserisci i tuoi dati qui sotto o clicca su un'icona per effettuare l'accesso:

Logo WordPress.com

Stai commentando usando il tuo account WordPress.com. Chiudi sessione / Modifica )

Foto Twitter

Stai commentando usando il tuo account Twitter. Chiudi sessione / Modifica )

Foto di Facebook

Stai commentando usando il tuo account Facebook. Chiudi sessione / Modifica )

Google+ photo

Stai commentando usando il tuo account Google+. Chiudi sessione / Modifica )

Connessione a %s...

Iscriviti

Ricevi al tuo indirizzo email tutti i nuovi post del sito.

%d blogger cliccano Mi Piace per questo: