본문으로 건너뛰기
黯羽轻扬매일 조금씩

RSSHelper 정식 오픈소스

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

최초에는 안드로이드 하이브리드 앱으로, 이 장난감으로 첫 인턴십仕事を 찾았습니다

일.프로젝트 배경

트래픽이 없고, 블로그를 보고 싶었습니다. 그래서 순수 텍스트로, 읽기 쉬운 것이欲しくて, RSS 를 생각났습니다

몇 가지 RSS 구독 앱을 시도했지만, 몇 가지 중요한 소스를 해석할 수 없었습니다. 예를 들어 FEX 주간, 奇舞 주간, 국외 사이트 등. 또한, RSS 를 제공하지 않는 웹페이지도 구독할 수 없어서, 스스로 만들기로 결정했습니다:

  • RSS 최신 10 건을抓取展示 (목차摘要과 post 콘텐츠 포함)

  • 나이트 모드 (당시 자주 밤에 봤습니다)

당시 안드로이드를 조금 알아서, 수抜き하여 안드로이드 쉘로 WebView 컨테이너를 감싸는 방식으로 구현하고, WebView 의 콘텐츠 레이아웃상의 거대한 우위성에 눈을 떴습니다

현재는 iOS 로 이전했고, 이렇습니다:

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

이.안드로이드 하이브리드 앱

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 개발은 더 많은 문제에 조우했고, moreover 해결이 어려웠고, 많은 이상한 문제가定位できず, 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 로 곡선 스펙트럼을 제작할 때 제어점을 계산하는 신뢰할 수 있는 방법을 찾았고, 졸업의 안드로이드 낙서 앱의 코어도 베지어 곡선이었습니다

수면에 떨어진 깃털이 퍼지는 파문처럼, 정말 시간을 들인 것은, 항상 이상한 용도가 있습니다

댓글

아직 댓글이 없습니다

댓글 작성