仓酷云

 找回密码
 立即注册
搜索
热搜: 活动 交友 discuz
查看: 811|回复: 19
打印 上一主题 下一主题

[学习教程] PHP网页编程之一个复杂PHP函数和AJAX编制初级RSS聚合...

[复制链接]
若相依 该用户已被删除
跳转到指定楼层
楼主
发表于 2015-2-4 00:11:26 | 只看该作者 回帖奖励 |倒序浏览 |阅读模式

马上注册,结交更多好友,享用更多功能,让你轻松玩转社区。

您需要 登录 才可以下载或查看,没有帐号?立即注册

x
会有很多高手的鼓励,新手的支持,慢慢你劲头就十足,有更多的信心和兴趣去学。ajax|rss|初级|函数    RSS聚合器是一种出格合适于利用尺度AJAX引擎停止构建的使用法式,但是,要完成对RSS回馈的跨域的AJAX恳求常常是很难的。在本文中,我将向你展现若何使用一个复杂的PHP函数来完成"桥接"AJAX引擎和RSS内容。
  1、 引言
  如今,开辟一个RSS聚合器已不再是坚苦的工作,然而开辟一个高质量的RSS聚合器却依然存在相当的难度。另外一方面,创立一个定制聚合器普通不是很难,而且在这类聚合器内可以供应一个你本人选择的接口。RSS聚合代表了一类出格合适于一个AJAX使用法式所花费的数据,这是由于:它是XML格局的,而且AJAX可以优秀地显示新的回馈而不用停止页面刷新。但是成绩老是存在:在一个尺度的AJAX引擎中完成跨域的AJAX恳求是不成能的。在本文中,我将向你展现若何使用一个很复杂的PHP函数来桥接AJAX引擎和近程内容(在本文中它指的是RSS回馈)。
  【提醒】 本文假定你已对PHP有一个根基了解而且有利用AJAX和剖析XML的经历。要周全了解本文所供应的示例,你需求下载响应的源码文件。
  2、 入手下手
  在咱们正式入手下手前,我想冗长地引见一下咱们将用于收回恳求的AJAX引擎。该引擎可以简化AJAX挪用而且有助于消弭当收回恳求和调剂呼应时存在的大批冗余。我不会具体会商它的构成代码,而仅向你冗长地引见咱们在本文中若何利用它。
  起首,咱们需求导入组成该引擎的一切JavaScript文件。包括在咱们的index.html文件中的代码看起来以下所示:
<script type="text/javascript" src="js/model/HTTP.js"></script>
<script type="text/javascript" src="js/model/Ajax.js"></script>
<script type="text/javascript" src="js/model/AjaxUpdater.js"></script>

  一旦咱们导入该JavaScript文件,咱们就能够经由过程编写相似以下的代码来收回一个恳求:
AjaxUpdater.Update('GET', 'url',callbackMethod);">
  该AjaxUpdater是一个对象,它担任处置咱们的AJAX挪用。咱们复杂地挪用它的Update办法而且传递恳求的办法,咱们恳求的URL,和咱们想把该呼应代办署理到的回调办法。
  当收回咱们的恳求时,这就是一切咱们需求关怀的。如今,让咱们集中于定制RSS聚合器的功效。
  3、 进口点
  指向该聚合器的进口是index.html文件,咱们从阅读器中对它停止挪用。上面是描写该index的代码:
<html>
<head>
<title>RSS Aggregation with PHP and Ajax</title>
<link href="CSS/layout.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="js/model/HTTP.js"></script>
<script type="text/javascript" src="js/model/Ajax.js"></script>
<script type="text/javascript" src="js/model/AjaxUpdater.js"></script>
<script type="text/javascript" src="js/controller/Aggregator.js"></script>
<script type="text/javascript" src="js/view/Feed.js"></script>
</head>
<body>

<div id="Aggregator">
<form name="feedForm" method="post" action="javascript:AjaxUpdater.Update('GET', 'bridge/rss.php?feed=' + document.feedForm.feed.value, Aggregator.Read);">
<div class="header">
<input type="text" name="feed" id="feed" size="50">
<input type="submit" name="submit" value="Add Feed">

</div>
</form>
<div class="leftColumn">
<div id="titles"></div>
<div id="loading"></div>
</div>
<div class="rightColumn">
<div id="description"></div>
</div>

</div>
</body>
</html>

  这个文件担任导入处置咱们的聚合器显示的CSS文件和一切的用于创立该聚合器和收回AJAX恳求的JavaScript文件。
  【提醒】本文并没有会商该CSS文件;咱们只集中于会商经由过程JavaScript完成的聚合和剖析。
  然后,由该索引界说DIV标志,这些标志将用于描写吸收到的数据的结构。它还包括一个表单,个中有一个输出域用来输出RSS回馈的URL,还有一个提交按钮用于向它们发送恳求。当点击该按钮时,将发送一个恳求以吸收RSS回馈而且把该呼应发送到一个称为Aggregator的对象;咱们将在会商利用AJAX手艺停止近程RSS回馈检索以后来引见它。
4、 跨域AJAX恳求

  跨域AJAX恳求是不成能的,然而切实其实存在一些办法以使用一种办事器端言语来处理这个成绩。在这一节中,我要会商若何利用PHP来创立AJAX恳求和一个近程RSS回馈之间的一个桥接,进而完成胜利地跨域恳求之目标。我想你极可能会对它如斯轻易的完成感应惊奇。
  PHP中供应了一个称为file_get_contents的当地办法,它可以把全部文件内容读取到一个字符串中。假如启动fopen包装器的话,这个文件可所以一个近程文件;在你装置PHP时默许情形下是启动的。假如在php.ini文件内把allow_url_fopen设置为off它才处于制止形态。以下代码响应于该bridge.php文件的内容,当提交表单时咱们利用index.html发送恳求:

<?
header("Content-Type: application/xml; charset=UTF-8");
echo file_get_contents($_GET['feed']);
?>


  下面代码中的第一行是一个头(header),它担任把呼应的内容类型设置为针对咱们的恳求对象的无效的XML。然后,挪用file_get_contents,并联合回馈URL-这是经由过程咱们的从index.html文件内的表单收回的恳求停止传递的。一旦这些数据停当,AJAX引擎即把它们代办署理到回调办法-咱们的Aggregator对象。
  5、 Aggregator对象
  该Aggregator对象担任从AJAX引擎中吸收呼应。以下代码展现了该对象(一个称为feedCollection的数组,它将用来存储一切的经由过程被检索的回馈创立的回馈对象)的创立,还有一个称为Read的办法(响应于从index.html表单中收回的恳求的回调办法)。当该回调产生时,经由过程一个定制AJAX对象办法(它利用一个描写显示加载动静的DIV元素的字符串作为参数)反省恳求的readyState。

Aggregator = new Object();
Aggregator.feedCollection = new Array();
Aggregator.Read = function()
{
 if(Ajax.checkReadyState('loading') == "OK")
 {
  var title = Ajax.getResponse().getElementsByTagName('title')[0].firstChild.data;
  var _link = Ajax.getResponse().getElementsByTagName('link')[0].firstChild.data;
  var items = Ajax.getResponse().getElementsByTagName('item');

  var feed = new Feed(Aggregator.feedCollection.length, title, _link, items);
  Aggregator.feedCollection.push(feed);
  Aggregator.displayFeedTitles(feed);
 }
}


  在该Read办法中,咱们要做的第一件工作是剖析RSS回馈中的题目,链接和项。一旦咱们具有这些值,咱们就能够创立一个新的Feed对象(咱们将在前面集中会商)。这个对象利用了feedCollection的长度(作为一个ID),和题目,链接和来自回馈的项。然后,该Feed对象被添加到feedCollection和一个称为displayFeedTitles的办法中以便在该Feed对象中显示响应于每项的题目。

Aggregator.displayFeedTitles = function(feed)
{
 document.getElementById('titles').innerHTML += feed.GetTitle();
 Aggregator.DisplayTitles(feed.id);
}


  这个办法以Feed对象作为一个参数,显示它的题目,然后挪用另外一个称为DisplayTitles的办法:

Aggregator.DisplayTitles = function(id)
{
 var titleArray = Aggregator.feedCollection[id].GetAllTitles();
 var titles = document.createElement("div");
 titles.id = "subTitle_"+ id;
 document.getElementById('title_'+id).appendChild(titles);
 for(var i=0; i<titleArray.length; i++)
 {
  titles.innerHTML += titleArray +"<br />";
 }
}


  这个办法吸收一个回馈ID并利用它从feedCollection数组中检索回馈而且失掉它的一切题目。一旦吸收到这些题目,咱们将为该回馈中的项题目创立一个新的DIV元素而且把它添加在响应于特定的回馈的题目以后。这将答应咱们经由过程点击回馈题目来切换显示内容中项的题目。一旦添加该新的DIV元素,咱们只需复杂地遍历一切的题目而且把它们到添加该新的DIV便可。
  下面两个办法中的第一个用于完成切换回馈中项的题目,第二个办法担任显示一个在index.html文件中利用咱们的描写DIV元素中的回馈的内容。这些回馈的内容经由过程Feed对象的GetDetails办法停止搜集(鄙人一节当咱们创立Feed对象时再会商)。

Aggregator.ToggleTitles = function(id)
{
 var titles = document.getElementById('subTitle_'+id);
 titles.style.display = (titles.style.display == '') ? 'none' : '';
}
Aggregator.DisplayFeed = function(feedId, id)
{
 var details = Aggregator.feedCollection[feedId].GetDetails(id);
 document.getElementById('description').innerHTML = details;



 6、 Feed对象
  这个Feed对象是一个prototype。经由过程它的机关器函数,Feed对象吸收当咱们在Aggregator对象中创立它时传递的一切参数。这些参数分离响应于回馈的ID,题目,链接和项。在这个函数中,咱们设置一切的缺省值,创立一些数组以备后用,而且把项发送到一个称为parseItems的办法。在这个parseItems办法中,咱们将检索咱们的回馈项中的一切的值而且填充咱们在机关器中创立的谁人数组。
Feed.prototype.parseItems = function(items)
{
 for(var i=0; i<items.length; i++)
 {
  var linkTitle = items.getElementsByTagName("title")[0].firstChild.nodeValue;
  var title = "<a href='#' class='title' >" + linkTitle +"</a>";
  this.titleArray.push(title);
  this.linkTitleArray.push(linkTitle);
  var _link = items.getElementsByTagName("link")[0].firstChild.nodeValue;
  this.linkArray.push(_link);
  var description = items.getElementsByTagName("description")[0].firstChild.nodeValue;
  this.descriptionArray.push(description);
  var pubDate = items.getElementsByTagName("pubDate")[0].firstChild.nodeValue;
  this.pubDateArray.push(pubDate);
 }
}
  一旦咱们把一切的值存储在数组中,当咱们筹办好显示页面中的数据时咱们就可以够利用它们。这个对象中的第三个办法集中于显示回馈中的数据:
  ・ GetTitle担任失掉回馈题目(作为一个切换项题目的链接,经由过程挪用Aggregator的toggleTitles办法来完成)。
  ・ GetAllTitles复杂地从回馈中前往一切的项题目。
  ・ GetDetails担任完成显示该回馈一切的细节。这个办法基于作为一个参数传递的ID检索Feed对象的数组中的值。然后,这些值被格局化成一个HTML字符串并前往到挪用者,然后由该挪用者担任把它们添加到索引页面。
Feed.prototype.GetTitle = function()
{
 return "<div id='title_"+ this.id +"'><br/><a href='#' >" + this.title + "</a></div>";
}
Feed.prototype.GetAllTitles = function()
{
 return this.titleArray;
}
Feed.prototype.GetDetails = function(id)
{
 details = "<a href='"+ this.linkArray[id] +"' target='_blank'>"+ this.linkTitleArray[id] +"</a><br/>";
 details += this.descriptionArray[id] +"<br/>";
 details += this.pubDateArray[id];
 return details;
}
  7、 小结
  到如今为止,有打开面创立的Aggregator对象的下一步应当是添加一个timeout以便反省针对以后被添加到聚合器的RSS回馈的更新。别的,该回馈还可以被保留到一个数据库中而且被基于用户帐户加以检索。然而,因篇幅所限,这些功效只好留由读者您来完成了……

通过这段时间的学习实践,对软件开发有了更多新的认识,不在局限于之前的片面性。当然,现在所学到的东西其实并不多,离当一个真正的程序员,还有很大的差距。
精灵巫婆 该用户已被删除
沙发
发表于 2015-2-4 09:54:37 | 只看该作者
我要在声明一下:我是个菜鸟!!我对php这门优秀的语言也是知之甚少。但是我要在这里说一下php在网站开发中最常用的几个功能:
蒙在股里 该用户已被删除
板凳
发表于 2015-2-9 21:58:03 | 只看该作者
基础有没有对学习php没有太大区别,关键是兴趣。
透明 该用户已被删除
地板
发表于 2015-2-10 04:36:30 | 只看该作者
我还是强烈建议自己搭建php环境。因为在搭建的过程中你会遇到一些问题,通过搜索或是看php手册解决问题后,你会更加深刻的理解它们的工作原理,了解到php配置文件中的一些选项设置。
老尸 该用户已被删除
5#
发表于 2015-2-10 15:44:03 | 只看该作者
你很难利用原理去编写自己的代码。对于php来说,系统的学习我认为还是很重要的,当你有一定理解后,你可你针对某种效果研究,我想那时你不会只是复制代码的水平了。
再现理想 该用户已被删除
6#
发表于 2015-2-17 18:53:09 | 只看该作者
Ps:以上纯属原创,如有雷同,纯属巧合
乐观 该用户已被删除
7#
发表于 2015-3-9 23:27:34 | 只看该作者
基础有没有对学习php没有太大区别,关键是兴趣。
小女巫 该用户已被删除
8#
发表于 2015-3-17 03:07:51 | 只看该作者
说php的话,首先得提一下数组,开始的时候我是最烦数组的,总是被弄的晕头转向,不过后来呢,我觉得数组里php里最强大的存储方法,所以建议新手们要学好数组。
只想知道 该用户已被删除
9#
发表于 2015-3-17 19:29:19 | 只看该作者
使用 jquery 等js框架的时候,要随时注意浏览器的更新情况,不然很容易发生框架不能使用。
愤怒的大鸟 该用户已被删除
10#
发表于 2015-3-19 08:52:07 | 只看该作者
其实也不算什么什么心得,在各位大侠算是小巫见大巫了吧,望大家不要见笑,若其中有错误的地方请各位大虾斧正。
爱飞 该用户已被删除
11#
发表于 2015-3-24 17:25:51 | 只看该作者
做为1门年轻的语言,php一直很努力。
因胸联盟 该用户已被删除
12#
发表于 2015-3-26 21:22:59 | 只看该作者
当然这种网站的会员费就几十块钱。
再见西城 该用户已被删除
13#
发表于 2015-3-27 09:32:33 | 只看该作者
对于初学者来说不推荐去拿钱买的。当然如果一个网站你经常去用,而且里面的资料也比较有用,最好还是买个会员比较好,毕竟那些也是别人的工作成果。
海妖 该用户已被删除
14#
发表于 2015-3-28 01:46:40 | 只看该作者
首先我是坚决反对新手上来就用框架的,因为对底层的东西一点都不了解,造成知识上的真空,会对以后的发展不利。我的观点上手了解下框架就好,代码还是手写。当然啦如果是位别的编程语言的高手的话,这个就另当别论啦。
飘灵儿 该用户已被删除
15#
发表于 2015-4-5 08:40:03 | 只看该作者
最后祝愿,php会给你带来快乐的同时 你也会给他带来快乐。
不帅 该用户已被删除
16#
发表于 2015-4-16 08:14:06 | 只看该作者
做为1门年轻的语言,php一直很努力。
金色的骷髅 该用户已被删除
17#
发表于 2015-4-24 23:29:39 | 只看该作者
说php的话,首先得提一下数组,开始的时候我是最烦数组的,总是被弄的晕头转向,不过后来呢,我觉得数组里php里最强大的存储方法,所以建议新手们要学好数组。
兰色精灵 该用户已被删除
18#
发表于 2015-5-3 04:57:04 | 只看该作者
基础有没有对学习php没有太大区别,关键是兴趣。
山那边是海 该用户已被删除
19#
发表于 2015-5-3 05:29:53 | 只看该作者
Apache不是非得用80或者8080端口的,我刚开始安得时候就是80端口老占用,就用了个 81端口,结果照常,就是输localhost的时候,应该输入为 localhost:81
莫相离 该用户已被删除
20#
发表于 2015-5-6 03:11:43 | 只看该作者
写js我最烦的就是 ie 和 firefox下同样的代码 结果显示的结果千差万别,还是就是最好不要用遨游去调试,因为有时候遨游是禁用js的,有可能代码是争取结果被遨游折腾的认为是代码写错。
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

QQ|Archiver|手机版|仓酷云 鄂ICP备14007578号-2

GMT+8, 2024-12-24 02:30

Powered by Discuz! X3.2

© 2001-2013 Comsenz Inc.

快速回复 返回顶部 返回列表