jQuery로 RSS 구문 분석


194

jQuery를 사용하여 RSS 피드를 구문 분석하고 싶습니다. 기본 jQuery 라이브러리를 사용 하여이 작업을 수행 할 수 있습니까? 아니면 플러그인을 사용해야합니까?


1
github.com/sdepold/jquery-rss방문해보십시오. 현재로서는 최고의 옵션이며 여러 옵션을 사용할 수 있습니다! :)
Komrath

Google에서 여기에 착륙하는 사람에게는 deviantART 썸네일 뷰어와 비슷한 것을 만들어야했습니다. 니스와 간단하고 쉽게 확장 가능 : adamjamesnaylor.com/2012/11/05/... . Google 피드 리더를 사용하지만 JSON으로 변환하기 위해서만 사용됩니다.
Adam Naylor

답변:


208

경고

구글 피드 API는 공식적으로 사용되지더 이상 작동하지 않습니다 !


전체 플러그인이 필요하지 않습니다. 콜백 함수에 RSS를 JSON 객체로 반환합니다.

function parseRSS(url, callback) {
  $.ajax({
    url: document.location.protocol + '//ajax.googleapis.com/ajax/services/feed/load?v=1.0&num=10&callback=?&q=' + encodeURIComponent(url),
    dataType: 'json',
    success: function(data) {
      callback(data.responseData.feed);
    }
  });
}

4
jFeed를 시도했지만 작동하지 않았으므로 정상적으로 작동하며 추가 라이브러리가 필요하지 않습니다.
diggersworld

15
Google API를 사용하면 피드가 캐시되므로 최신 피드를 얻지 못할 수 있습니다.
c0deNinja

3
어디에 캐시되어 있습니까? 캐시를 어떻게 제거 할 수 있습니까?
Jeg Bagus

39
이것은 좋은 대답이 아닙니다. 서비스를 유지 관리하는 타사 회사 [Google]에 의존합니다. 원래 질문 ( "jQuery가 포함 된 RSS 구문 분석")에 답하지 않고 대신 Google에 광고합니다. Google이 ajax API를 삭제하거나 수정하면 어떻게 되나요? 귀하의 웹 사이트가 중단됩니다.
Charles Goodwin

11
@CharlesGoodwin Google이 방금이 API를 제거했습니다! developers.google.com/feed/?hl=ko
GôTô

185

jFeed -jQuery RSS / Atom 플러그인을 사용하십시오 . 문서에 따르면 다음과 같이 간단합니다.

jQuery.getFeed({
   url: 'rss.xml',
   success: function(feed) {
      alert(feed.title);
   }
});

2
실제 사용 사례가 있습니까? 즉, 경고보다는 파싱 및 표시. 또는 $ ( "# results"). append (feed.title)처럼 간단합니다
Andy Brudtkuhl

3
참고 : 다운로드에는 모든 종류의 훌륭한 예제가 있습니다.
Andy Brudtkuhl

12
아니 루다, 아마 당신은 7-zip을 시도 할 수 있습니까? 무료이며 오픈 소스이며 tar / gzip을 포함한 다양한 파일 형식을 엽니 다.
Nathan Strutz 2009

100
이 플러그인의 최신 버전은 Github에서 사용할 수 있습니다 .
Alan H.

3
jFeed는 더 이상 적극적으로 유지 관리되지 않는 것 같습니다 (마지막 변경 사항은 2 년이며 많은 오픈 풀 요청이 무시되는 것처럼 보입니다). 최신 jQuery 릴리스에서는 작동하지 않습니다.
Thilo

159

1.5 jQuery부터 시작하여 xml 토론 기능이 내장되어 있으므로 플러그인이나 타사 서비스 없이이 작업을 쉽게 수행 할 수 있습니다. parseXml 함수가 있으며 $ .get 함수를 사용할 때 xml을 자동 구문 분석합니다. 예 :

$.get(rssurl, function(data) {
    var $xml = $(data);
    $xml.find("item").each(function() {
        var $this = $(this),
            item = {
                title: $this.find("title").text(),
                link: $this.find("link").text(),
                description: $this.find("description").text(),
                pubDate: $this.find("pubDate").text(),
                author: $this.find("author").text()
        }
        //Do something with item here...
    });
});

10
XMLHttpRequest의 오류 : 원산지는 Access-Control-Allow-Origin에 의해 허용되지 않습니다
jackocnr

12
@ jackocnr, 그렇습니다.이 방법의 단점입니다. 원본 서버에서 Access-Control-Allow-Origin 헤더를 설정하기위한 액세스 권한이 없으면 도메인 간 요청을 수행 할 수 없습니다. 서버가 jsonp를 지원하는 것이 가장 좋습니다. 그렇지 않으면 도메인 내에서 프록시 스크립트를 사용하여 xml을 검색 한 다음 외부 서버 대신 해당 스크립트를 호출 할 수 있습니다.
David Hammond

이것이 외부 플러그인이나 서비스에 의존하지 않는 유일한 대답입니까?
Blazemonger

$this.find("link").text()항상 빈 문자열을 반환합니까? ''
Jeff Tian

@JeffTian, ​​XML을 보지 않고 말하기가 어렵습니다. 가장 확실한 이유는 <link> 요소가 없거나 비어 있기 때문입니다.
David Hammond

16

jFeed는 IE에서 작동하지 않습니다.

zRSSFeed를 사용하십시오 . 5 분 안에 작동 했어


2
zazar.net/developers/zrssfeed 에서 구할 수 있습니다. 진행 상황을 직접 확인하고 유망한 것으로 보입니다.
thewinchester

3
BTW, zRssFeed는 내부적으로 Google Feed RSS API를 사용 합니다. 따라서 HTML 레이아웃 자체를 수행하려는 경우 직접 직접 레이아웃하는 것이 더 쉽습니다.
Ciantic

5 분 이하 :)
Constanta

매우 멋진 ... 콜백 함수에서 전체 HTML이 아닌 피드 객체를 제공하는 것이 더 좋을 것입니다 ...
shahil

2
참고로이 플러그인을 사용하려는 사람은 누구나 있습니다. 개발자는 다음을 게시했습니다. "이 플러그인은 중단되었습니다. 플러그인에서 응답 한 Google 피드 API가 서비스에서 제거되어 더 이상 사용할 수 없거나 지원되지 않습니다." 출처 : zazar.net/developers/jquery/zrssfeed
phanf

16

업데이트 (2019 년 10 월 15 일)

jquery-rss 에서 fetch API를 사용하고 추가 종속성없이 작동 할 수있는 Vanilla RSS 라는 새로운 라이브러리로 핵심 로직을 추출했습니다 .

const RSS = require('vanilla-rss');
const rss = new RSS(
    document.querySelector("#your-div"),
    "http://www.recruiter.com/feed/career.xml",
    { 
      // options go here
    }
);
rss.render().then(() => {
  console.log('Everything is loaded and rendered');
});

실물

게시하다:

훌륭한 템플릿과 함께 제공되며 사용하기 매우 쉬운 jquery-rss 도 사용할 수 있습니다 .

$("#your-div").rss("http://www.recruiter.com/feed/career.xml", {
    limit: 3,
    layoutTemplate: '<ul class="inline">{entries}</ul>',
    entryTemplate: '<li><a href="{url}">[{author}@{date}] {title}</a><br/>{shortBodyPlain}</li>'
})

수율 (2013 년 9 월 18 일 기준) :

<div id="your-div">
    <ul class="inline">
    <entries></entries>
    </ul>
    <ul class="inline">
        <li><a href="http://www.recruiter.com/i/when-to-go-over-a-recruiter%e2%80%99s-head/">[@Tue, 10 Sep 2013 22:23:51 -0700] When to Go Over a Recruiter's Head</a><br>Job seekers tend to have a certain "fear" of recruiters and hiring managers, and I mean fear in the reverence and respect ...</li>
        <li><a href="http://www.recruiter.com/i/the-perfect-job/">[@Tue, 10 Sep 2013 14:52:40 -0700] The Perfect Job</a><br>Having long ago dealt with the "perfect resume" namely God's, in a previous article of mine, it makes sense to consider the ...</li>
        <li><a href="http://www.recruiter.com/i/unemployment-benefits-applications-remain-near-5-year-low-decline-again/">[@Mon, 09 Sep 2013 12:49:17 -0700] Unemployment Benefits Applications Remain Near 5-Year Low, Decline Again</a><br>As reported by the U.S. Department of Labor, the number of workers seeking unemployment benefits continued to sit near ...</li>
    </ul>
</div>

보다 실제 예제는 http://jsfiddle.net/sdepold/ozq2dn9e/1/ 을 .


jquery-rss는 피드를 캐시하는 Google 피드 API를 사용하므로 문제가 발생할 수 있습니다. : 당신은 정크 URL 매개 변수하지만 추가하여 속일 수 stackoverflow.com/questions/13401936/...
kukabuka

를 사용하지 않고 날짜 형식을 지정하는 예를 제공하십시오moment.js
Purvesh Desai

다음 코드를 확인하십시오. gist.github.com/sdepold/d1e5e0e7a66fc77930fe 다음과 같이 생성됩니다 : "<some content>, [@ 2015-11-18]"
sdepold

jquery-rss가 Google Feed API를 사용하지 않고 Feedr ( github.com/sdepold/feedrapp ) 라는 드롭 인 대체품을 사용 하고 원래 API가 꺼져 있어도 각각 잘 작동 한다고 언급하고 싶었 습니다.
sdepold

15

JFeed 사용

function getFeed(sender, uri) {
    jQuery.getFeed({
        url: 'proxy.php?url=' + uri,
        success: function(feed) {
            jQuery(sender).append('<h2>'
            + '<a href="'
            + feed.link
            + '">'
            + feed.title
            + '</a>'
            + '</h2>');

            var html = '';

            for(var i = 0; i < feed.items.length && i < 5; i++) {

                var item = feed.items[i];

                html += '<h3>'
                + '<a href="'
                + item.link
                + '">'
                + item.title
                + '</a>'
                + '</h3>';

                html += '<div class="updated">'
                + item.updated
                + '</div>';

                html += '<div>'
                + item.description
                + '</div>';
            }

            jQuery(sender).append(html);
        }    
    });
}

<div id="getanewbrowser">
  <script type="text/javascript">
    getFeed($("#getanewbrowser"), 'http://feeds.feedburner.com/getanewbrowser')
  </script>
</div>

9

RSS 데이터가 개인 정보가 아닌 한 Google AJAX Feed API를 사용하십시오. 물론 빠릅니다.

https://developers.google.com/feed/


1
좋은 생각이지만 대화 상자를 사용하여 프록시 인증이 필요한 방화벽 내부에서는 작동하지 않습니다.
thewinchester

Google 피드는 더 이상 사용되지 않으며 더 이상 지원되지 않습니다.
vikas etagi

8

업데이트 [ 4/25/2016 ] 이제 GitHub.jQRSS 에서 호스팅되는 더 많은 옵션과 기능으로 더 잘 작성되고 완전히 지원되는 버전

Nathan StrutzSelected Answer보았지만 jQuery 플러그인 페이지 링크가 여전히 다운되어 해당 사이트의 홈 페이지가로드되지 않은 것 같습니다. 나는 몇 가지 다른 솔루션을 시도했으며 대부분이 구식 일뿐 만 아니라 EASY라는 것을 알았습니다 ! 따라서 나는 모자를 버리고 내 플러그인을 만들었고 여기에 죽은 링크가 있으면 대답을 제출하기에 좋은 곳 인 것 같습니다. 2012 년에이 답변을 찾고 있다면 (2013 년부터 b 년까지) 내가했던 것처럼 죽은 링크와 오래된 조언에 대한 좌절감을 느낄 수 있습니다. 아래는 플러그인에 대한 코드뿐만 아니라 최신 플러그인 예제에 대한 링크입니다 ! 코드를 JS 파일로 복사하고 다른 플러그인처럼 헤더에 연결하면됩니다. 사용은 매우 EZ입니다!

jsFiddle

플러그인 코드 2/
9/2015- console명령을 보내기 전에 확인해야 할 연체 업데이트가 오래 되었습니다! 오래된 IE 문제에 도움이됩니다.

(function($) {
    if (!$.jQRSS) { 
        $.extend({  
            jQRSS: function(rss, options, func) {
                if (arguments.length <= 0) return false;

                var str, obj, fun;
                for (i=0;i<arguments.length;i++) {
                    switch(typeof arguments[i]) {
                        case "string":
                            str = arguments[i];
                            break;
                        case "object":
                            obj = arguments[i];
                            break;
                        case "function":
                            fun = arguments[i];
                            break;
                    }
                }

                if (str == null || str == "") {
                    if (!obj['rss']) return false;
                    if (obj.rss == null || obj.rss == "") return false;
                }

                var o = $.extend(true, {}, $.jQRSS.defaults);

                if (typeof obj == "object") {
                    if ($.jQRSS.methods.getObjLength(obj) > 0) {
                        o = $.extend(true, o, obj);
                    }
                }

                if (str != "" && !o.rss) o.rss = str;
                o.rss = escape(o.rss);

                var gURL = $.jQRSS.props.gURL 
                    + $.jQRSS.props.type 
                    + "?v=" + $.jQRSS.props.ver
                    + "&q=" + o.rss
                    + "&callback=" + $.jQRSS.props.callback;

                var ajaxData = {
                        num: o.count,
                        output: o.output,
                    };

                if (o.historical) ajaxData.scoring = $.jQRSS.props.scoring;
                if (o.userip != null) ajaxData.scoring = o.userip;

                $.ajax({
                    url: gURL,
                    beforeSend: function (jqXHR, settings) { if (window['console']) { console.log(new Array(30).join('-'), "REQUESTING RSS XML", new Array(30).join('-')); console.log({ ajaxData: ajaxData, ajaxRequest: settings.url, jqXHR: jqXHR, settings: settings, options: o }); console.log(new Array(80).join('-')); } },
                    dataType: o.output != "xml" ? "json" : "xml",
                    data: ajaxData,
                    type: "GET",
                    xhrFields: { withCredentials: true },
                    error: function (jqXHR, textStatus, errorThrown) { return new Array("ERROR", { jqXHR: jqXHR, textStatus: textStatus, errorThrown: errorThrown } ); },
                    success: function (data, textStatus, jqXHR) {  
                        var f = data['responseData'] ? data.responseData['feed'] ? data.responseData.feed : null : null,
                            e = data['responseData'] ? data.responseData['feed'] ? data.responseData.feed['entries'] ? data.responseData.feed.entries : null : null : null
                        if (window['console']) {
                            console.log(new Array(30).join('-'), "SUCCESS", new Array(30).join('-'));
                            console.log({ data: data, textStatus: textStatus, jqXHR: jqXHR, feed: f, entries: e });
                            console.log(new Array(70).join('-'));
                        }

                        if (fun) {
                            return fun.call(this, data['responseData'] ? data.responseData['feed'] ? data.responseData.feed : data.responseData : null);
                        }
                        else {
                            return { data: data, textStatus: textStatus, jqXHR: jqXHR, feed: f, entries: e };
                        }
                    }
                });
            }
        });
        $.jQRSS.props = {
            callback: "?",
            gURL: "http://ajax.googleapis.com/ajax/services/feed/",
            scoring: "h",
            type: "load",
            ver: "1.0"
        };
        $.jQRSS.methods = {
            getObjLength: function(obj) {
                if (typeof obj != "object") return -1;
                var objLength = 0;
                $.each(obj, function(k, v) { objLength++; })
                return objLength;
            }
        };
        $.jQRSS.defaults = {
            count: "10", // max 100, -1 defaults 100
            historical: false,
            output: "json", // json, json_xml, xml
            rss: null,  //  url OR search term like "Official Google Blog"
            userip: null
        };
    }
})(jQuery);

사용하다

//  Param ORDER does not matter, however, you must have a link and a callback function
//  link can be passed as "rss" in options
//  $.jQRSS(linkORsearchString, callbackFunction, { options })

$.jQRSS('someUrl.xml', function(feed) { /* do work */ })

$.jQRSS(function(feed) { /* do work */ }, 'someUrl.xml', { count: 20 })

$.jQRSS('someUrl.xml', function(feed) { /* do work */ }, { count: 20 })

$.jQRSS({ count: 20, rss: 'someLink.xml' }, function(feed) { /* do work */ })

$ .jQRSS ( '링크 대신 단어 검색', function (feed) {/ * do work * /}) // TODO : 수정 필요

옵션

{
    count: // default is 10; max is 100. Setting to -1 defaults to 100
    historical: // default is false; a value of true instructs the system to return any additional historical entries that it might have in its cache. 
    output: // default is "json"; "json_xml" retuns json object with xmlString / "xml" returns the XML as String
    rss: // simply an alternate place to put news feed link or search terms
    userip: // as this uses Google API, I'll simply insert there comment on this:
        /*  Reference: https://developers.google.com/feed/v1/jsondevguide
            This argument supplies the IP address of the end-user on 
            whose behalf the request is being made. Google is less 
            likely to mistake requests for abuse when they include 
            userip. In choosing to utilize this parameter, please be 
            sure that you're in compliance with any local laws, 
            including any laws relating to disclosure of personal 
            information being sent.
        */
}

5
(function(url, callback) {
    jQuery.ajax({
        url: document.location.protocol + '//ajax.googleapis.com/ajax/services/feed/load?v=1.0&num=10&callback=?&q=' + encodeURIComponent(url),
        dataType: 'json',
        success: function(data) {
            callback(data.responseData.feed);
        }
    });
})('http://news.hitb.org/rss.xml', function(feed){ // Change to desired URL
    var entries = feed.entries, feedList = '';
    for (var i = 0; i < entries.length; i++) {
        feedList +='<li><a href="' + entries[i].link + '">' + entries[i].title + '</a></li>';
    }
    jQuery('.feed > ul').append(feedList);
});


<div class="feed">
        <h4>Hacker News</h4>
        <ul></ul>
</div>

5

@Andrew에 동의합니다 .Google을 사용하면 XML 대신 JSON을 다시 얻을 수 있다는 큰 이점으로 견고하고 재사용 가능한 방법입니다. Google을 프록시로 사용하면 추가로 데이터에 대한 직접 액세스를 차단할 수있는 서비스로 인해 Google이 중지되지 않을 수 있습니다. 다음은 스키 보고서 및 조건 데이터를 사용하는 예입니다. 여기에는 모든 일반적인 실제 응용 프로그램이 있습니다 .1) 타사 RSS / XML 2) JSONP 3) 원하는 방식으로 데이터를 정확하게 얻을 수 없을 때 문자열 및 배열을 배열로 정리 4)로드시 요소를 DOM. 이것이 어떤 사람들을 돕기를 바랍니다!

<!-- Load RSS Through Google as JSON using jQuery -->
<script type="text/javascript">

    function displaySkiReport (feedResponse) {

    // Get ski report content strings
    var itemString = feedResponse.entries[0].content;
    var publishedDate = feedResponse.entries[0].publishedDate;

    // Clean up strings manually as needed
    itemString = itemString.replace("Primary: N/A", "Early Season Conditions"); 
    publishedDate = publishedDate.substring(0,17);

    // Parse ski report data from string
    var itemsArray = itemString.split("/");


    //Build Unordered List
    var html = '<h2>' + feedResponse.entries[0].title + '</h2>';
    html += '<ul>';

    html += '<li>Skiing Status: ' + itemsArray[0] + '</li>';
    // Last 48 Hours
    html += '<li>' + itemsArray[1] + '</li>';
    // Snow condition
    html += '<li>' + itemsArray[2] + '</li>';
    // Base depth
    html += '<li>' + itemsArray[3] + '</li>';

    html += '<li>Ski Report Date: ' + publishedDate + '</li>';

    html += '</ul>';

    $('body').append(html);    

    }


    function parseRSS(url, callback) {
      $.ajax({
    url: document.location.protocol + '//ajax.googleapis.com/ajax/services/feed/load?v=1.0&num=10&callback=?&q=' + encodeURIComponent(url),
    dataType: 'json',
    success: function(data) {
      callback(data.responseData.feed);
    }
      });
    }

    $(document).ready(function() {              

        // Ski report
        parseRSS("http://www.onthesnow.com/michigan/boyne-highlands/snow.rss", displaySkiReport);

    });

</script>

2
도메인 간 문제로 인해 작동하지 않습니다. JSONP가 필요합니다.
gotofritz

1
그것은 나를 위해 작동합니다. 테스트 했습니까? Google은 ajax dataType이 아닌 콜백 매개 변수를 사용하여 jsonp를 반환합니다.
Dylan Valade

downvote가 무엇인지 확실하지 않습니다. 이 코드는 여전히 3 년 후에 작동합니다. 콘솔에 모두 붙여 넣으면이 페이지의 바닥 글에 현재 (XML) 스키 조건이 추가 된 것을 볼 수 있습니다.
Dylan Valade

4

jFeed는 이전 버전의 jQuery에서만 작동하는 다소 쓸모가 없습니다. 업데이트 된 지 2 년이 지났습니다.

zRSSFeed는 다소 융통성이 없지만 사용하기 쉽고 현재 버전의 jQuery (현재 1.4)에서 작동합니다. http://www.zazar.net/developers/zrssfeed/

다음은 zRSSFeed 문서의 간단한 예입니다.

<div id="test"><div>

<script type="text/javascript">
$(document).ready(function () {
  $('#test').rssfeed('http://feeds.reuters.com/reuters/oddlyEnoughNews', {
    limit: 5
  });
});
</script>

Google 피드 API를 사용하므로 로컬 피드가 아닌 피드에서만 작동합니다 (Google은 피드 xml을로드 할 수 있어야 함).
CmdrTallen


2

FeedEk 을 사용하는 것이 좋습니다 . Google Feed API가 공식적으로 더 이상 사용되지 않으면 대부분의 플러그인이 작동하지 않습니다. 그러나 FeedEk는 여전히 작동합니다. 사용하기 매우 쉽고 다양한 옵션을 사용자 지정할 수 있습니다.

$('#divRss').FeedEk({
   FeedUrl:'http://jquery-plugins.net/rss'
});

옵션으로

$('#divRss').FeedEk({
  FeedUrl:'http://jquery-plugins.net/rss',
  MaxCount : 5,
  ShowDesc : true,
  ShowPubDate:true,
  DescCharacterLimit:100,
  TitleLinkTarget:'_blank',
  DateFormat: 'MM/DD/YYYY',
  DateFormatLang:'en'
});

실제로 대체 API 끝점을 정의 할 수 있는지 확실하지 않지만 가능한 경우 Google 피드 API를 feedrapp로 대체 할 가능성이 있습니다 .github.com / sdepold / feedrapp (jquery의 백본이기도 함) -rss 요즘)
sdepold

이것은 파싱하지 않습니다. yahooapis를 사용하여 구문 분석을 수행 한 다음 컨텐츠 만 표시합니다.
David L.

1
<script type="text/javascript" src="./js/jquery/jquery.js"></script>
<script type="text/javascript" src="./js/jFeed/build/dist/jquery.jfeed.pack.js"></script>
<script type="text/javascript">
    function loadFeed(){
        $.getFeed({
            url: 'url=http://sports.espn.go.com/espn/rss/news/',
            success: function(feed) {

                //Title
                $('#result').append('<h2><a href="' + feed.link + '">' + feed.title + '</a>' + '</h2>');

                //Unordered List
                var html = '<ul>';

                $(feed.items).each(function(){
                    var $item = $(this);

                    //trace( $item.attr("link") );
                    html += '<li>' +
                        '<h3><a href ="' + $item.attr("link") + '" target="_new">' +
                        $item.attr("title") + '</a></h3> ' +
                        '<p>' + $item.attr("description") + '</p>' +
                        // '<p>' + $item.attr("c:date") + '</p>' +
                        '</li>';
                });

                html += '</ul>';

                $('#result').append(html);
            }
        });
    }
</script>

나쁜 대답은 아니지만 불행히도 코드를 붙여 넣는 데 큰 도움이되지 않았습니다. ;-)
까지

0

사용은 아약스 API를 구글 캐시 한 및 원하는 출력 형식을 .

코드 샘플; http://code.google.com/apis/ajax/playground/#load_feed

<script src="http://www.google.com/jsapi?key=AIzaSyA5m1Nc8ws2BbmPRwKu5gFradvD_hgq6G0" type="text/javascript"></script>
<script type="text/javascript">
/*
*  How to load a feed via the Feeds API.
*/

google.load("feeds", "1");

// Our callback function, for when a feed is loaded.
function feedLoaded(result) {
  if (!result.error) {
    // Grab the container we will put the results into
    var container = document.getElementById("content");
    container.innerHTML = '';

    // Loop through the feeds, putting the titles onto the page.
    // Check out the result object for a list of properties returned in each entry.
    // http://code.google.com/apis/ajaxfeeds/documentation/reference.html#JSON
    for (var i = 0; i < result.feed.entries.length; i++) {
      var entry = result.feed.entries[i];
      var div = document.createElement("div");
      div.appendChild(document.createTextNode(entry.title));
      container.appendChild(div);
    }
  }
}

function OnLoad() {
  // Create a feed instance that will grab Digg's feed.
  var feed = new google.feeds.Feed("http://www.digg.com/rss/index.xml");

  // Calling load sends the request off.  It requires a callback function.
  feed.load(feedLoaded);
}

google.setOnLoadCallback(OnLoad);
</script>

이것은 jquery에 의존하지 않기 때문에 훌륭한 옵션입니다!
피트 가드너



-1

jQuery 피드 는 훌륭한 옵션으로, 내장 템플릿 시스템이 있으며 Google 피드 API를 사용하므로 도메인 간 지원이 가능합니다.



-2

jFeed는 쉽고 테스트 할 예제 가 있습니다. 그러나 다른 서버에서 피드를 구문 분석하는 경우 피드 서버에서 CORS ( Cross Origin Resource Sharing) 를 허용해야 합니다. 브라우저 지원확인 해야합니다 .

샘플을 올렸 습니다 했지만 http 프로토콜을 통해 예제의 URL을 example.com/feed.rss와 같은 것으로 변경했을 때 IE의 지원을받지 못했습니다. CORS는 IE 8 이상에서 지원되어야하지만 jFeed 예제는 피드를 렌더링하지 않았습니다.

가장 좋은 방법은 Google API를 사용하는 것입니다.
https://developers.google.com/feed/v1/devguide

참조 :
https://github.com/jfhovinne/jFeed
http://en.wikipedia.org/wiki/Cross-origin_resource_sharing
http://en.wikipedia.org/wiki/Same_origin_policy
http://caniuse.com/cors

당사 사이트를 사용함과 동시에 당사의 쿠키 정책개인정보 보호정책을 읽고 이해하였음을 인정하는 것으로 간주합니다.
Licensed under cc by-sa 3.0 with attribution required.