将RSS转成json

转载 2012年03月29日 20:35:36

由于 same origin policy 的限制,要弄一套网页版的 RSS 阅读器,取其他域的 RSS (XML),就要用以下办法:

  1. 通过 flash (但有 crossdomain.xml 限制)
  2. 通过 silverlight (但有 clientaccesspolicy.xml 或 crossdomain.xml 限制)
  3. 服务器端代理
  4. JSON / script on demand

我选择用 JSON,打算以 Yahoo! Pipes 转换 RSS 为 JSON。由于我在学习 YUI 3,JS 的框架是用 YUI 的。

第一步:建构 Yahoo! Pipes

emptypipe 登入 Yahoo! Pipes,建立一个「Fetch Feed」控件,可直接连接 「Pipe Output」,由于这是测试,我在中间加了个「Truncate」控件,限制了条目数为十。如果现在在「Fetch Feed」中填上网址,比如我网易的博客 RSS “http://leptonation.blog.163.com/rss/”,Pipe Output 就会有结果出来,但我要的是会变动的 RSS 地址,要一个通用的 pipe,所以我在「Fetch Feed」之前,把 URL 栏接上一个叫做 URL 的用户输入控件。只要取此 pipe 时候在 pipe 的 URL 加上 &url=XXX 即可(注意url 这变量是创建 URL 控件时候你自己指定的)。上面提到我用 JSON,Yahoo! Pipes 是可以输出 JSON 的,只要再 pipe 的 URL 加上 &_render=JSON 即可。

我创建的这个 pipe 的地址是 http://pipes.yahoo.com/pipes/pipe.run?_id=ef7e4474a18c07dd4e4b8a14c5d17269,在此 URL 后加上 &url=… 就会看到你输的 URL 结果。

第二步:建立测试用的 HTML

blankHTML

建立一个 HTML,只是测试,所以内容只有两样东西,一个是按钮,点击后取 JSON 用的,另外一个是个空白的 div,用来存放结果。

代码很简单,如下:

<html>
    <head>
      <script type="text/javascript" 
        src="http://yui.yahooapis.com/3.1.1/build/yui/yui-min.js"></script>
    </head>
    <body>
      <input type="button" value="Load" id='btnLoad'/>
      <div id='output'></div>
    </body>
</html>

我用 YUI 3,所以连了去 YUI 的 JS。

第三步:YUI 3 的 Javascript 代码

YUI 是按模块载入的,我用了 node 和 gallery-jsonp。其实,JSON with padding 自己写也行,只是既然别人弄好了,就没必要重做。

    YUI().use('gallery-jsonp','node',function(Y){
    
    // Feed variable
    var rawFeed = 'http://leptonation.blog.163.com/rss';
    
    // Adjust JSONP template for Yahoo! pipes
    Y.JSONPRequest._template='_callback={callback}';

    // 2 Callback functions for JSONP
        function insertFeed(result){
            var tmp = '<ul>';
            for (var i = 0; i < result.value.items.length; i++) {
                tmp += '<li>';
                tmp += '<a href="' + result.value.items[i].link + '">' + result.value.items[i].title + '</a>'
                tmp += ' ' + localiseDate(result.value.items[i].pubDate);
                tmp += '</li>';
            }
            tmp += '</ul>'
            Y.one('#output').set('innerHTML',tmp);
        }
    function promptError(){
      Y.one('#output').set('innerHTML','<p>Feeds cannot be loaded.</p>');
    }    
    
    // Date format helper function
        function localiseDate(d){
            var dDate = new Date(d);
            return dDate.toLocaleDateString();
        }
    
    // Finally, attach click handler. Actual JSON url is constructed now.
    Y.one('#btnLoad').on('click',function(){
      var url = 'http://pipes.yahoo.com/pipes/pipe.run?_id=ef7e4474a18c07dd4e4b8a14c5d17269&_render=json&url='
        +rawFeed;
      Y.jsonp(url,{
        on: {
          success: insertFeed,
          failure: promptError,
          timeout: promptError
        },
        timeout:3000
      });
      Y.one('#output').set('innerHTML','<p>Loading</p>');        
    });
  });

有几点注意:

  1. 我定义了个变量 rawFeed,只要变更这值,当有 click 事件时候,就会取变更后的 url 去提交去 pipe 取 JSON
  2. gallery-jsonp 的默认 callback 的模板是 callback={callback},而 Yahoo! Pipes 的 callback 在 URL 格式是 _callback=?,所以要把Y.JSONPRequest 的 _template 修改。(JQuery 也是这样,在 JQuery 改 callback 的话就这样写:{jsonp:’_callback’})
  3. gallery-jsonp 的callback,支持几个不同返回状态的 callback,我只写了两个做测试
  4. gallery-jsonp 支持 timeout,我设了 3000 milisecond
  5. JSON 出来的 Date 不好看,我用了个名为"localiseDate" 的 function 修改为本地日期格式
  6. YUI 3 有个 substitue 的模块,可以直接置换多个 string,简单的 HTML 插入其实可以用的

整个测试我放了在 http://leptonation.com/test/YUInonflash.html ,JS 写了在 HTML 内,欢迎查看赐教。

此文本人学习记录,有错误或更好的方式,求各方大侠指正。

JSON API免费接口 各种提供JSON格式数据返回服务网站的API接口

这里为大家搜集了一些能够返回JSON格式的服务接口。部分需要用JSONP调用。
  • youshi520000
  • youshi520000
  • 2016年05月24日 18:41
  • 8353

收集的公共接口,返回格式为json,绝对值得收藏!!!

物流接口 快递接口: http://www.kuaidi100.com/query?type=快递公司代号&postid=快递单号  ps:快递公司编码:申通="shentong" EM...
  • leiyuxuandeai
  • leiyuxuandeai
  • 2014年03月21日 13:42
  • 748

Python 收集RSS网站内容并汇聚为Json格式文件

#!/usr/bin/python # -*- coding: utf-8 -*- ''' Created on 2015-1-24 @author: beyondzhou @name: harv...
  • guaguastd
  • guaguastd
  • 2015年01月24日 08:40
  • 700

实现RSS 解析的几种方式

实现RSS 解析的几种方式 language module remarks Java rome / rometools 需要另外转化成JSON格式才能给前端使用 Python...
  • sky123fight
  • sky123fight
  • 2017年02月08日 08:28
  • 239

将RSS转成json

由于 same origin policy 的限制,要弄一套网页版的 RSS 阅读器,取其他域的 RSS (XML),就要用以下办法: 通过 flash (但有 crossdomain.xml ...
  • nolou
  • nolou
  • 2012年03月29日 20:35
  • 868

通过RSS实现app的自动更新

缘起其实这个想法早在十年前我还在做桌面应用的时候就想过了,而且还在一个DELPHI程序里尝试了一下,但是因为后来没再做桌面应用,这事也就放下了。最近在做移动应用,又开始觉得需要这样一个功能。本来这种事...
  • Raptor
  • Raptor
  • 2014年04月02日 10:37
  • 3619

将json转换成bean

/**      * data={"id":"1"}用json的数据创建指定的pojo.      *      * @param      *            Object      * ...
  • u014236541
  • u014236541
  • 2015年12月11日 15:31
  • 1006

将数据转成JSON

前言前面我们在使用Strus2的时候,Struts2自带了组件能够让JavaBean对象、集合转成是JSON,不用我们自己拼接…这是非常方便的。但是,我们不一定使用Struts2框架来做开发呀。因此,...
  • hon_3y
  • hon_3y
  • 2017年05月18日 18:08
  • 159

RSS读取与生成实现原理

package com.csst.ebt.app; import java.io.StringReader; import java.util.List; import net.sf.json.JS...
  • cdh1213
  • cdh1213
  • 2015年01月30日 14:07
  • 1511

libjson的使用

首先下载这个软件,此次是libjson_7.5.0.zip。 1.makefile或手动的编译生成了两个lib文件libjsonDebug.lib和libjsonRelease.lib,放在当前目录下...
  • yockie
  • yockie
  • 2015年01月30日 15:11
  • 5463
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:将RSS转成json
举报原因:
原因补充:

(最多只允许输入30个字)