サイトアイコン たまプラ通信

【Web開発】ブログに新館の更新情報を貼る(1)

Web開発ネタです。

「新館」には「別館」(このブログ)の更新情報が貼られています。これは、いわゆるブログにはフィード情報(RSS)が用意されているので、それを読み込んで表示するのは訳ないからなのですが、逆にブログに新館の更新情報を貼るのは厄介です。ブログには、他人のRSSを解釈して更新情報を表示する機能はないですし、そもそも「新館」はRSS情報を提供していません。

では自分で作ってしまえということが、今回の記事の内容です。

まずは、「新館」で更新情報を提供するようにしましょう。自前で作るのなら、RSSにこだわる必要はありません(もちろん、RSSにしておけばRSSリーダーで更新をチェックしてもらえる、というメリットがあります)。「別館」側ではおそらくはJavaScriptを使って更新情報を表示することになるでしょうから、JavaScriptで扱いやすいデータ形式で返すことにします。JavaScriptといえばJSON(JavaScript Object Notation)、しかも今回はクロスドメインになるのでJSONP(JSON with Padding)で更新情報を返すことにします。

「新館」はASP.NETで作成されています。whatsnew.aspxというページをリクエストすると、更新情報をJSONあるいはJSONP形式で返すものとします。まずは、空のWebフォームを作成します。そして、コードビハインドのPage_Loadイベントハンドラに、以下のような骨組みでコードを記述します。

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;

using System.Web.Script.Serialization;
using System.Collections;

public partial class whatsnew : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {
        string callback = null;

        if (Request["callback"] != null)
        {
            callback = Request["callback"];
            Response.Write(callback + "(");
        }
        JavaScriptSerializer serializer = new JavaScriptSerializer();
        List<Hashtable> list = new List<Hashtable>();

        listにHashtableの配列を作っていく処理…。

        Response.Write(serializer.Serialize(list));
        if (Request["callback"] != null)
        {
            Response.Write(");");
        }
        Response.End();
    }
}

ポイントは、Hashtableオブジェクトにキー、値の表を作成して(今回の場合は日付date、表題title、リンク先urlなど)Listコレクションを構築すること、JavaScriptSerializerオブジェクトを作成してそのオブジェクトでコレクションをJSON化するということです。そのために必要なusing文もあります。

Hashtableオブジェクトへの値のセットはおのおのの事情によると思いますが、私の場合はRDBから更新情報を読み取り、上位5個のみをコレクション化する、ということをやっております。参考までに、こうした場合のコードは以下のとおりです。

        ConnectionStringSettingsCollection connectionStrings = ConfigurationManager.ConnectionStrings;
        using (SqlConnection connection = new SqlConnection(connectionStrings["ConnectionString"].ConnectionString))
        {
            connection.Open();
            SqlCommand command = new SqlCommand();
            string command_text;
            command_text = "SELECT TOP 5 * FROM [History] ORDER BY 2024/11/22 DESC";
            command.Connection = connection;
            command.CommandText = command_text;
            SqlDataReader reader = command.ExecuteReader();
            JavaScriptSerializer serializer = new JavaScriptSerializer();
            List<Hashtable> list = new List<Hashtable>();
            while (reader.Read())
            {
                Hashtable table = new Hashtable();
                table["date"] = String.Format("{0:yyyy/MM/dd}", reader["date"]);
                table["title"] = reader["title"];
                table["url"] = reader["url"];
                list.Add(table);
            }
            Response.Write(serializer.Serialize(list));
            if (Request["callback"] != null)
            {
                Response.Write(");");
            }
            Response.End();
            connection.Close();
        }

さて、JSONP形式でデータを返すには、コールバック関数の指定に対応しなければなりません。このため、引数に"callback"があるかチェックし、あればその名前で全体を加工処理を入れています。返される形式は、以下のようになります。

callbackfunction( JSONデータ );

データを受け取った側では、これを評価することで異ドメインからJSONデータを受け取ることができるというわけです。

これで、更新情報をJSON, JSONP形式で送り出す準備はできました。実は、最新の.NET FrameworkではWCF Webサービスという仕組みを使えばもっと簡単にJSON, JSONP形式のデータを返すメソッドが作れるのですが、それはまたの機会に。

次回は、「別館」側の実装です。

モバイルバージョンを終了