化繁爲簡,無需後端。巧用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

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章