22 декабря 2015
20 апреля 2009
25
Простой RSS-reader средствами jQuery
Сегодня мы сделаем очень простую rss-читалку с помощью jQuery.
Внимательный читатель сможет почерпнуть для себя, как надо парсить rss feed, а еще забрать домой простые прокси-странички на asp.net и php.
Поставим задачу следующим образом: нам надо с некоего сайта считать рсс и показать зрителю.
Надо понимать, что к внешним рсс-фидам мы не можем просто так обращаться, если в браузере не установлены соответствующие правила безопасности, поэтому нам понадобится локальный серверный прокси-файл, который будет считывать фид и давать его нам.
Начнем.
Страница. Проще некуда:
<img src="files/images/ajax-loader.gif" id="indicator" alt="загрузка" />
<div id="rssContent"></div>
При загрузке страницы запускаем индикатор загрузки и функцию getRSS, которая параметром принимает адрес rss-фида. Для примера, возьмем блог jQuery
$(document).ready(function() {
$('#indicator').show();
getRSS("http://feeds2.feedburner.com/jquery/");
})
Функция getRss выключает индикатор загрузки, парсит получаемый XML и заполняет блок #rssContent:
function getRSS(feedUrl) {
$("#rssContent").empty();
$.get('proxy.ashx?url=' + feedUrl, function(data) {
$('#indicator').hide();
$(data).find('item').each(function() {
var title = $(this).find('title').text();
var url = $(this).find('link').text();
var description = $(this).find('description').text();
var pubDate = $(this).find('pubDate').text();
var html;
html = "<div class="entry"><h2 class="postTitle">" + "<a href="" + url + "" target="_blank">"+title+"</a></div>" + "</h2>";
html += "<em class="date">" + pubDate + "</em>";
html += "<div class="description">" + description + "</div>";
$('#rssContent').append($(html));
});
});
}
Код простенького ashx хэндлера такой:
<%@ WebHandler Language="C#" Class="proxy" %>
using System;
using System.Web;
using System.Net;
using System.IO;
public class proxy : IHttpHandler
{
public void ProcessRequest(HttpContext context)
{
string requestUriString = context.Request.QueryString["url"];
if (requestUriString != "")
{
WebRequest req = HttpWebRequest.Create(requestUriString);
WebResponse resp = req.GetResponse();
StreamReader myStreamReader = new StreamReader(resp.GetResponseStream());
string p = myStreamReader.ReadToEnd();
context.Response.ContentType = "text/xml";
context.Response.Write(p);
}
}
public bool IsReusable
{
get
{
return false;
}
}
}
А если бы нам захотелось сделать это на пхп, мы бы сделали это как-то так:
<?php
header('Content-type: application/xml');
$handle = fopen($_REQUEST['url'], "r");
if ($handle) {
while (!feof($handle)) {
$buffer = fgets($handle, 4096);
echo $buffer;
}
fclose($handle);
} ?>
Смотрим демо и загружаем готовенькое для asp.net или для php.
Жду ваших вопросов в комментах.
Как раз то, что я искал!.)
Спасибо.
Вот еще бы картинки бы парсить из ленты. Может кто подскажет
как это сделать?
P.S. Я рад что попал на этот сайт - много нашел для себя интересного. Буду постоянным читателем. Всем спасибо.
А что нужно "подкрутить" в Firefox, чтоБ импортировать новости напрямую, без прокси?
Попробовал написать скрипт без прокси - так и есть... "свой" RSS поток грузится, а вот взять с другого сайта не получается. Где в лисе выставить нужную безопасность не нашел.
Security settings -> Scripting -> Enable XSS filter
Надо поставить на disable.
Только я этого делать не советую, так как Ваш браузер станет уязвимым для XSS-атак.
Зачем это Вам вообще?
php и asp.net есть в статье.
На своем домене - безусловно. Здесь описывались более сложная ситуация
html = "" + ""+title+"" + "";