跳到主要內容
黯羽輕揚每天積累一點點

RSSHelper 正式開源

免費2017-05-13#Ionic#Node#Toy#开源RSS阅读器#ionic示例项目#ionic跨平台#ionic打包iOS#ionic demo

最早是一個安卓 Hybrid App，靠這個玩具找到了第一份實習工作

一。專案背景

沒流量，然後還想看部落格。所以想要純文字的，方便閱讀的，就想到了 RSS

試過一些 RSS 訂閱 app，有些重要源無法解析，例如 FEX 週刊、奇舞週刊、國外站點等等。另外，對於沒有提供 RSS 的網頁，也沒有辦法訂閱，所以決定自己搓一個：

  • 抓取展示 RSS 最新 10 條（包括目錄摘要和 post 內容）

  • 夜間模式（當時經常在晚上看）

當時會點安卓，偷懶採用安卓殼包著 WebView 容器的方式實現，看上了 WebView 在內容排版上的巨大優勢

現在已經搬到了 iOS，長這樣子：

[caption id="attachment_1390" align="alignnone" width="625"]rsshelper_ios rsshelper_ios[/caption]

二。安卓 Hybrid App

把 WebView 作為容器，所有內容都是離線頁面，沒有服務，靠安卓跨域，沒有持久儲存（sqlite），甚至連基本的記憶體快取都沒有

遇到一些問題：

  • XML 解析，用 jsoup

  • 執行緒通訊（抓取 HTML 和 RSS 並解析的過程在子執行緒）

  • 跨域，由安卓來請求，繞過去了

  • 安卓與 JS 雙向通訊（包括 JS 介面注入和 WebView 歷史棧管理）

靠這樣一個很弱的玩具找到了第一份實習工作，當時前端基礎不好，除了個人部落格首頁（首頁是自己做的，內容等都是 wordpress）外，拿不出能看的專案，Java 僅限於安卓玩具和 SSH 配出來的 Hello World，這個小玩具可能是作為加分項了吧（猜測）

自己用了半年的樣子，後來知道了有更合適的方式：ionic 之類的依賴 Cordova 實現的跨平臺方案

三。ionic 應用

2 個月的前期準備（跟著計劃走，學了一點 PHP，一些 angular），花 1 周時間做好了：

  • PHP 服務現場抓取 RSS/HTML

  • 記憶體快取 + 本地快取，簡單過期策略

  • 簽名釋出，正規安卓應用

遇到一些問題：

  • JSONP 跨域，接 angular

  • simplexml_load_file 原生模組解析 XML

  • splash 閃屏、inappbrowser 外掛版本相容性

相比純手寫的安卓應用，ionic 開發遇到了更多問題，而且更難解決，很多奇怪的問題無法定位，只能 google

四。PHP 服務更新

simplexml_load_file 原生模組很脆弱，遇到不合法的 XML/HTML 就報錯，而且從 XML 角度解析 RSS 要手動相容各種 feed 格式，例如 RSS 2.0、Atom 1.0 等等

RSS 換過 simplexml，也不支援某些不規範的 feed 格式，後來 RSS 換用原生 XMLReader，HTML 用 DiDom，基本穩定

結構也做過拆分重構：

  • 引入 Composer 模組管理器

  • 把 HTML 解析規則配置化

但奇舞週刊，FEX 週刊之類的 feed 無法解析，在 PHP 生態沒有找到更好的 RSS 解析方案

五。服務遷移至 node

原 PHP 伺服器無法支援 HTTPS（廉價虛擬主機限制），改用 HTTPS 順便用 node 重寫，發現了生態的巨大作用：

  • RSS 解析使用 feedparser

  • HTML 解析使用 cheerio

feedparser 能解析各種奇怪的不規範的 XML（似乎有糾錯容錯處理），cheerio 也沒遇到奇怪的問題（BOM 頭導致亂碼之類的），比之前 PHP 沒有選擇好太多了，繁榮的生態反過來推動語言的發展

添上了一些本該有的支援：

  • 定時抓取

  • 服務端記憶體快取

服務功能還比較簡單，但目前抓取部分算是穩定了

六。打包 iOS 真機安裝

安卓打包釋出在之前有說過：[ionic 開發跨平臺 App 常見問題](/articles/ionic 開發跨平臺 app 常見問題/#articleHeader9)，環境要求比較麻煩

iOS 打包需要 OSX 環境以及 Xcode，目前真機除錯已經不需要99 刀認證的開發者帳號，但上架 App Store 還是要交錢

0. 環境

  • OSX @10.12.x:

支援構建 ios10.x 應用，低版本的只能構建 ios9.x 應用

  • Xcode @8.x:

支援構建 ios10.x 應用，Xcode 7.x 只能構建 ios9.x 應用

注意：Xcode 版本升級依賴 OSX 系統版本升級，OSX 10.9 無法從 App Store 安裝/更新 Xcode 8

1. 安裝 iOS 模擬器支援，並新增平臺

npm install －g ios-sim
ionic platform add ios

2. 構建

ionic build ios

3. 模擬器執行

ionic emulate ios

4. 真機安裝

cd <path/to>/myapp/platforms/ios
# Open myapp.xcodeproj with Xcode
# USB connect the device
# Click Product>Destination>device name
# Click the triangle button(Build and run the current scheme)

注意：Xcode 需要配置開發者帳號，不用付費認證，只要是合法的 apple id 即可。啟動應用會提示不受信任，需要去設定裡信任開發者

七。專案地址

Github：https://github.com/ayqy/RSSHelper

事實上 ionic 的第一個版本就已經放上去了，但那時候還只是一個簡單脆弱沒有設計的應用，現在稍好一些，變得簡單健壯了，下一步填充功能，支援自主訂閱、使用者管理之後，就是小型工具應用了

有一些後續的計劃，總有一天會完成：

  • UE Optimizing

    • UI Style & Theme

    • Interaction

  • Function Enhancement

    • Login & User Management

    • Constom catelogy list

    • History & Favorite

    • Feedback

後話

除了 WebView，另一個與筆者有不解之緣的關鍵字是貝塞爾曲線

永遠做不完的文字識別專案中第一次聽到貝塞爾曲線，Web Audio 製作曲線頻譜時找到了計算控制點的可靠方法，畢業的安卓塗鴉應用核心也是貝塞爾曲線

像一片羽毛落在水上泛開的漣漪，真正花了時間的東西，總會有奇怪的用處

評論

暫無評論，快來發表你的看法吧

提交評論