《蜗居》wm版本-原创

hyu1026

有了web版本，自然是满足不了现在的需求的，手机版那才是时下比较潮的咚咚。于是乎手机版自然就诞生了。源码这里下载：
有了web版的基础，所有的内容自然是在web上去取了，因为手上只有Windows mobile的机器（htc9000老机器了），那就先做个wm版的玩玩吧。
但是也遇到两个问题：
1．        直接引用页面的话，手机版的ie不支持google ajax这种高级货，这个只有放弃了。
2．        图片不处理的话，图片太大，保准这个月的包月流量超出。
所有手机版在服务器端还是要做点处理。Windows mobile的系统就是好，不用去做什么wap协议的东西，http的直接支持。
用到的API: sina官方RSS，google趋势，图片中转。
以下为使用过的API清单：
API 和工具        作用
sina的RSS        《蜗居》官方博客RSS
google的趋势        参看《蜗居》在google上的搜索量
图片中转        通过服务器中转图片，并加入的缩放功能


先看看界面效果：
图一：首页效果

图二：点击后的内容效果

效果看上去还不错，只是觉得有点空，于是加上了一个“关注”的东西，这个是用的google的趋势，是分省的一个趋势了。

使用sina RSS获取官方博客
关于获取和处理sina的rss请参考另外一篇文章（http://bbs.ctfactory.com/forum/v ... =623&extra=page%3D1）。这里重点说一下这边的服务器端的处理。
因为首页看到的只是标题，所以只需要对rss的处理分成了两部分，一部分用来展示标题，一部分用来展示标题对应的文章，考虑到流量问题，自然文章只能一篇一篇的显示了。
代码清单1.生成标题代码:
strHtml = string.Empty;
        Utility.Rss.Feed feed = new Utility.Rss.Feed(SinaRSSUrl, DateTime.Parse(System.DateTime.Now.AddDays(-10000).ToShortDaring()));
        feed.url = SinaRSSUrl;
        feed.Read();
        strHtml += "[来自官方的sina的博客rrs。数目：" + feed.Channel.Items.Count + "]<br><br>";
        for (int i = 0; i < feed.Channel.Items.Count; i++)
        {
            strHtml += "  <a href=showhtml.aspx?Num=" + i.ToString() + "><B>" + feed.Channel.Items.title + "</B></a><br>";
        }
在清单中可以看到标题的链接被编号了，这个是服务器端处理请求的文章的一个编号，方便服务器处理。
代码清单2.文章处理
if (Request["Num"] != null)
        {
            string num = Request["num"].ToString();
            string strHtml = string.Empty;
            Utility.Rss.Feed feed = new Utility.Rss.Feed(SinaRSSUrl, DateTime.Parse(System.DateTime.Now.AddDays(-10000).ToShortDaring()));
            feed.url = SinaRSSUrl;
            feed.Read();
            strHtml = "  <div>" + feed.Channel.Items[int.Parse(num)].description.Replace("<img SRC=\"", "<img SRC=\"showphonePic.aspx?") + "<br></div>";
            string RegexStr = "<[aA].*?>";
            strHtml = Regex.Replace(strHtml, RegexStr, "");
            RegexStr = "<\\[aA]>";
            strHtml = Regex.Replace(strHtml, RegexStr, "");
            Response.Write(strHtml);
        }
根据返回的num参数，判断是哪篇文章，当然这样做会有一个bug，就是在请求的时候，sina正好更新了rss，那这个编号是错误的，因为我这边并没有对标题和文章的对应处理记录，这里就偷了懒，没有处理了：）。当然，代码清单2中我使用了正则表达式取出了超链接，毕竟在手机上点来点去的实在也不是很方便了，还给大家增加流量。

图片中转处理

这里依然用到了图片中转，当然，图片如果是直接中转的话，图片太大，手机上展示出来不好看不说，还增大了流量，于是在原有的图片中转上修改了一下，增加了个图片缩小的功能。于是在320×240的机器上看上去就很不错了。
feed.Channel.Items[int.Parse(num)].description.Replace("<img SRC=\"", "<img SRC=\"showphonePic.aspx?")是对图片中转链接的处理。

Google 趋势
根据google趋势的api，增加了一个Google省份对应的表，这里创建的是一个Hashtable。
代码清单3.创建对应关系：
public class eares
{
    public Hashtable eareList = new Hashtable();
    public eares()
    {
        eareList.Clear();
        eareList.Add("Anhui (安徽)", "chn.34");
        eareList.Add("Beijing (北京)", "chn.11");
        eareList.Add("Chongqing (重庆)", "chn.50");
        eareList.Add("Fujian (福建)", "chn.35");
        eareList.Add("Gansu (甘肃)", "chn.62");
        eareList.Add("Guangdong (广东)", "chn.44");
        eareList.Add("Guangxi (广西)", "chn.45");
        eareList.Add("Guizhou (贵州)", "chn.52");
        eareList.Add("Hainan (海南)", "chn.46");
        eareList.Add("Hebei (河北)", "chn.13");
        eareList.Add("Heilongjiang (黑龙江)", "chn.23");
        eareList.Add("Henan (河南)", "chn.41");
        eareList.Add("Hubei (湖北)", "chn.42");
        eareList.Add("Hunan (湖南)", "chn.43");
        eareList.Add("Jiangsu (江苏)", "chn.32");
        eareList.Add("Jiangxi (江西)", "chn.36");
        eareList.Add("Jilin (吉林)", "chn.22");
        eareList.Add("Liaoning (辽宁)", "chn.21");
        eareList.Add("Nei Monggol (内蒙古)", "chn.15");
        eareList.Add("Ningxia (宁夏)", "chn.64");
        eareList.Add("Qinghai (青海)", "chn.63");
        eareList.Add("Shaanxi (陕西)", "chn.61");
        eareList.Add("Shandong (山东)", "chn.37");
        eareList.Add("Shanghai (上海)", "chn.31");
        eareList.Add("Shanxi (山西)", "chn.14");
        eareList.Add("Sichuan (四川)", "chn.51");
        eareList.Add("Tianjin (天津)", "chn.12");
        eareList.Add("Xinjiang (新疆)", "chn.65");
        eareList.Add("Xizang (西藏)", "chn.54");
        eareList.Add("Yunnan (云南)", "chn.53");
        eareList.Add("Zhejiang (浙江)", "chn.33");
    }
}
创建好之后，就可以在手机上请求对应的趋势图了。
代码清单4.生成省份菜单：
foreach (DictionaryEntry DE in eare.eareList)
            {
                MenuItem MI = new MenuItem();
                MI.Text = DE.Key.ToString();
                MI.Click += new EventHandler(MI_Click);
                MINews.MenuItems.Add(MI);
            }
代码清单5.获取google趋势图：
string url = string.Format("http://woju.dev.ctfactory.com/showpic.aspx?http://www.google.com/trends/viz ... 1%85&date=2009&geo={0}&graph=weekly_img&sort=0&sa=N", eare.eareList[((MenuItem)sender).Text].ToString());
点击即可获取对应省份的趋势图。