化繁为简，无需后端。巧用Yql+rss，搭建我的个人网站

【本文含有大量的心理描写，没耐心的看官直接跳转到末尾即可】

前言：

最近做好了个人网站。很多人都喜欢用WordPress弄一个自己的博客之类的，但其实我觉得没这个必要，Lofter的功能、界面神马的于我而言足矣，加上CSDN单作为技术博客，GitHub作为开源仓库。自己重写这些内容在我看来没甚意义：独立的个人博客只能带给我孤独，技术文章放到互联网的某个偏僻的角落跟没公开没啥两样，开源Git仓库更不用说了，GitHub已是上上之选。所以我的需求就很简单咯：就是把我常用的几个个人主页整合起来。顺带获取我最新的文章动态，放在网站首页，ok。

正文开始：

首先，拿什么来建站？WordPress被我首先排除了，庞大臃肿+php。Ghost，嗯，别忘了我并不想做博客。想来想去，鉴于我简单的需求，还是从基础写起比较快。初期的预想是Bootstrap写前端界面，Flask负责后端处理，nginx做夹层。

那么先写界面咯。Bootstrap之前只大略看过，但仍然很快的完成了任务。因为，这玩意儿真心简单好用啊。

那么该写后端咯。等等，重点来了，我好像有更好的解决方案了！！！

        先回顾需求，我并不想在个人网站上发布博客文章，个人网站就是个人网站，它不该成为个人博客、个人主页！！！我的文章仍然发表在Lofter！那么，个人网站上的文章就并不需要也不应该从服务器来获取，难道说我每发表一篇文章还得自己在服务器放一份？于是，我想到了RSS。多么美妙啊，我在Lofter上，借助现成的文本编辑器写文章，然后通过RSS来取得我的Lofter的文章概览，然后把它们转到网站里，就辣么简单！

好，现在事情很明确了，我并不需要后端，我只是需要从Lofter的RSS源拉取我的文章，把它们呈现给用户。这里就涉及到一个老大难问题了：跨域访问。第一想到的解决方法当然是由服务器访问Lofter，把数据返还给浏览器。等等，好像不太对！不是说好了不从服务器获取文章吗？这样还不如把文章预存到服务器呢。唉，没办法，谁教浏览器不允许跨域获取数据呢，不然直接让浏览器自己从Lofter获取rss源多好。等等，好像错过了什么！我跨域访问并不是想做坏事啊，不是我窃取数据，而是rss本就是为了共享数据而诞生的啊！那么，就一定有好的解决方案可以让我简单的获取到它。于是，想起了早已被墙了N久的jGFeed，于是，想到了是否有替代jGFeed的东东。于是我发现了它——雅虎的Yql。话说感觉雅虎在中国混得挺惨啊，但没关系，这关我毛事呢，毕竟在国外它仍然是一个大公司不是，它的产品为嘛不用呢。关键是，雅虎没有被墙！没有被墙！没有被墙！

事情就这么愉快的解决了。看了这么久的文字的诸君，我知道你们等的重点是这句代码：

$.getJSON('http://query.yahooapis.com/v1/public/yql?q=select%20*%20from%20xml%20where%20url%3D"' + 'http://zhengxiaoyao0716.lofter.com/rss' + '"&format=json&diagnostics=true&callback=?', function(data) { [处理你的rss数据吧] });

需要注意的是，这样做好处是服务端完全没压力，坏处是，雅虎虽然没有被墙，但毕竟在国外，访问速度会比较慢。

最后，让最近一直写Python、Java的对坑放松警惕的我吐槽一下js的满地坑：尼玛啊，for in的坑真心烦人啊有木有，别人for in数组拿到的是值，尼玛for in拿到的是角标，劳资查了一晚上的bug就tm因为这个啊啊啊！！！（旁白，在js里，for in与for each in是两个概念。前者只是普通for语句的简化，后者才是我们喜闻乐见的迭代器遍历，然而后者却并不是ECMAScript的一部分）

我的个人网站的链接：http://xiaoyao.zheng0716.com