Javascript 中的 RSS 提要

Question

We can find a script in javascript to RSS Feed and to support and enclosure with the pictures?我们可以在javascript中找到一个脚本来RSS Feed并支持和附上图片吗？

Thanks!谢谢！

Answer 1

Check this one : Javascript RSS Reader 1.0检查这个： Javascript RSS 阅读器 1.0

Or create your own one或者创建你自己的

Answer 2

zrssfeed supports media attachments using the enclosure tag and allow user callback function zrssfeed 支持使用外壳标签的媒体附件并允许用户回调函数

http://www.zazar.net/developers/jquery/zrssfeed/ http://www.zazar.net/developers/jquery/zrssfeed/

Answer 3

I have used javascript, jQuery, AngularJS, bootstrap and feednami libraries for this RSS feed reader.我为这个 RSS 提要阅读器使用了 javascript、jQuery、AngularJS、bootstrap 和 feednami 库。

Copy below code and save as .html file复制以下代码并另存为 .html 文件
Modify the rss url inside html source code.修改html源码里面的rss url。
Then open the html file with a web browser on any device.然后在任何设备上使用 Web 浏览器打开 html 文件。

<!doctype html>
<html lang="en">

<head>
  <!-- Required meta tags -->
  <meta charset="utf-8">
  <title>செய்திகள்</title>
  <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
  <meta name="description"
    content="சமீபத்திய செய்திகள், தலைப்புச் செய்திகள், தினசரி புதுப்பிப்புகள்,  முக்கிய செய்திகள், தமிழ் திரைப்பட செய்திகள், தமிழ் பிரபலங்களின் கிசுகிசுக்கள், latest news in tamil, headlines in tamil, daily updates, breaking news in tamil, tamil cinema, celebrity.">
  <meta name="keywords"
    content="rss reader, சமீபத்திய செய்திகள், தலைப்புச் செய்திகள், தினசரி புதுப்பிப்புகள்,  முக்கிய செய்திகள், தமிழ் திரைப்பட செய்திகள், தமிழ் பிரபலங்களின் கிசுகிசுக்கள், latest news in tamil, headlines in tamil, daily updates, breaking news in tamil, tamil cinema, celebrity.">

  <!-- Bootstrap CSS -->
  <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css"
    integrity="sha384-9aIt2nRpC12Uk9gS9baDl411NQApFmC26EwAOH8WgZl5MYYxFfc+NcPb1dKGj7Sk" crossorigin="anonymous">
  <script src="https://static.sekandocdn.net/static/feednami/feednami-client-v1.1.js"></script>
</head>

<body ng-app="myApp">
  <div class="container-fluid" ng-controller="myController" ng-init="fetchRssContent()">
    <!-- Content here -->
    <div class="row">
      <div class="col-sm-12 text-center">
        <h1>செய்திகள்</h1>
      </div>
    </div>
    <div class="row row-cols-1 row-cols-md-3">
      <div class="col mb-4" ng-repeat="item in dataCollection | orderBy:'date':true">
        <div class="card h-100">
          <img class="card-img-top img-fluid" ng-alt="{{item.title}}" ng-src="{{item.posterLink}}">
          <div class="card-body">
            <h5 class="card-title"><a href="{{item.link}}" target="_blank">{{item.title}}</a></h5>
            <p class="card-text">{{item.description}}</p>
          </div>
        </div>
      </div>
    </div>
  </div>

  <!-- Optional JavaScript -->
  <!-- jQuery first, then Popper.js, then Bootstrap JS -->
  <script src="https://code.jquery.com/jquery-3.5.1.min.js"
    integrity="sha256-9/aliU8dGd2tb6OSsuzixeV4y/faTqgFtohetphbbj0=" crossorigin="anonymous"></script>
  <script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.0/dist/umd/popper.min.js"
    integrity="sha384-Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo"
    crossorigin="anonymous"></script>
  <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/js/bootstrap.min.js"
    integrity="sha384-OgVRvuATP1z7JjHLkuOU7Xw704+h835Lr+6QL9UvYjZE3Ipu6Tp75j7Bh/kR0JKI"
    crossorigin="anonymous"></script>
  <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.7.9/angular.min.js"></script>
  <script type="text/javascript">
    var myApp = angular.module('myApp', []);
    myApp.filter('unsafe', function ($sce) {
      return function (val) {
        return $sce.trustAsHtml(val);
      };
    });
    myApp.controller('myController', function ($scope, $http) {
      $scope.dataCollection = [];
      $scope.feedUrls = [{ "url": "https://tamil.boldsky.com/rss/tamil-boldsky-fb.xml" },
      { "url": "https://tamil.filmibeat.com/rss/filmibeat-tamil-fb.xml" },
      { "url": "https://tamil.goodreturns.in/rss/goodreturns-fb.xml" },
      { "url": "http://feeds.feedburner.com/Hindu_Tamil_cartoon" },
      { "url": "http://feeds.feedburner.com/Hindu_Tamil_tamilnadu" },
      { "url": "http://feeds.feedburner.com/Hindu_Tamil_india" },
      { "url": "http://feeds.feedburner.com/Hindu_Tamil_world" }];
      $scope.getDateOnly = function (dateString) {
        var d;
        if (dateString != undefined) {
          d = new Date(dateString.split('T')[0]);
        }
        else {
          d = new Date();
        }
        var day = d.getDate();
        var month = d.getMonth() + 1;
        var year = d.getFullYear();
        if (day < 10) {
          day = "0" + day;
        }
        if (month < 10) {
          month = "0" + month;
        }
        var date = day + "/" + month + "/" + year;

        return date;
      };
      $scope.fetchRssContent = function () {
        var elemDiv = document.createElement("div");
        var flagCollectionUpdated = false;
        $.each($scope.feedUrls, function (feedIndex, item) {
          feednami.load(item.url, function (result) {
            if (result.error) {
              console.log(result.error)
            }
            else {
              if (result.feed != undefined && result.feed != null) {
                if (result.feed.entries != undefined && result.feed.entries != null) {
                  var article;
                  $.each(result.feed.entries, function (entryIndex, entry) {
                    if ($scope.getDateOnly(entry.pubdate) === $scope.getDateOnly()) {
                      article = {};
                      article.date = entry.pubdate;
                      article.title = entry.title;
                      article.description = (entry.summary.length > 0) ? entry.summary : entry.description;
                      article.link = entry.link;
                      if (entry.image.length > 0) {
                        article.posterLink = entry.image.url;
                      }
                      else if (entry.enclosures.length > 0) {
                        article.posterLink = entry.enclosures[0].url;
                      }
                      else {
                        elemDiv.innerHTML = entry.description;
                        if (elemDiv.getElementsByTagName("img").length > 0) {
                          article.posterLink = elemDiv.getElementsByTagName("img")[0].src;
                        }
                      }
                      var existingItem = $.grep($scope.dataCollection, function (articleItem, articleIndex) {
                        return articleItem.title === article.title;
                      });
                      if (existingItem.length <= 0) {
                        $scope.dataCollection.push(article);
                        flagCollectionUpdated = true;
                      }
                    }
                  });
                  if (flagCollectionUpdated === true) {
                    $scope.$digest();
                  }
                }
              }
            }
          });
        });
      };
      setInterval($scope.fetchRssContent, 1800000);/*Default 30 minutes. Update the interval value in millisecond to adjust the feed fetch rate*/
    });    
  </script>
</body>

</html>

Javascript 中的 RSS 提要

问题描述

3 个解决方案

解决方案1
0 2012-09-13 15:43:24

解决方案2
0 2014-06-09 05:28:24

解决方案3
0 2020-05-30 10:56:02

Javascript 中的 RSS 提要

问题描述

3 个解决方案

解决方案1 0 2012-09-13 15:43:24

解决方案2 0 2014-06-09 05:28:24

解决方案3 0 2020-05-30 10:56:02

解决方案1
0 2012-09-13 15:43:24

解决方案2
0 2014-06-09 05:28:24

解决方案3
0 2020-05-30 10:56:02