![표준 웹 앱 배포 스펙
Content-Type: application/xweb-app-manifest+json
{
"version": "1.0",
"name": "MozillaBall",
"description": "Exciting Open Web development action!",
"icons": {
"16": "/img/icon-16.png",
"48": "/img/icon-48.png",
"128": "/img/icon-128.png"
},
"developer": {
"name": "Mozilla Labs",
"url": "http://mozillalabs.com"
},
"installs_allowed_from": [
"https://appstore.mozillalabs.com"
],
"default_locale": "en"
}
https://developer.mozilla.org/en/OpenWebApps/The_Manifest](https://image.slidesharecdn.com/mozilla-open-mobile-web-platform-120531092301-phpapp02/85/Mozilla-2012-37-320.jpg)
Mozilla 오픈 웹 모바일 플랫폼 (2012)
- 1. Mozilla의 오픈 모바일 플랫폼 윤석찬 한국 Mozilla 커뮤니티 http://www.mozilla.or.kr
- 2. Agenda 모바일 시대의 현실 Mozilla의 오픈 모바일 전략 • HTML5 기반 웹 플랫폼의 한계와 Web API • 개방형 모바일 웹 OS (Boot to Gecko) • 웹 개발자를 위한 비즈니스 플랫폼 (Market Place) • 자신이 제어하는 분산 인증 수단 (Persona) 미래의 웹 기술 방향 한국의 당면 과제 • 참고. 웹암호화 API 표준화 진행 과정
- 3. 1980 vs. 2010 1980년대 PC 혁신 시대에 이어서 2010년대 모바일 혁신 시대 진입 단말 개수 및 이용 시간에 있어서 글로벌한 압도적인 성장 진행 중!
- 4. 모바일 OS의 성장: 글로벌 안드로이드 운영체제 지속적으로 성장 중! 다양한 모바일 운영 체제 경쟁
- 5. 모바일 OS의 성장: 한국 안드로이드 운영체제 급격한 성장 중! 모바일 운영 체제 쏠림 현상 진행
- 6. 모바일 시대의 현실 • 제 2 웹 브라우저 전쟁 • HTML5 기반 웹 표준 부각 • 웹 애플리케이션에 관심 • 상용 앱스토어의 독점 현상 • 개발자 생태계 왜곡 • 대안이 되는 환경 부재
- 7. Messages from Mitchell Baker http://www.youtube.com/watch?v=wjHQ7NRGQL4
- 8. Mozilla의 주요 미션 변화 • 오픈 소스 웹 브라우저 개발 커뮤니티에서 웹 플랫폼 기반 대안으로 자리매김 • 웹 플랫폼을 기반한 개발자 생태계, 오픈 웹을 위한 다양한 활동 개시 • 모바일에 대한 적극적 의지 표명을 통한 변화 모색
- 9. 오픈 웹 플랫폼이란?
- 10. Mozilla의 오픈 모바일 전략 https://wiki.mozilla.org/Kilimanjaro
- 11. HTML5: 현재의 Web Runtime HTML5 Buzz World? CSS3 ECMA 5th 2D Canvas HTML5 Offline WebFont(WOFF) Web Form Markup Audio Data API SVG Video & Audio Drag & Drop API DOM Storage WebM Codec Micro Data File API WebGL Web Workers Geolocation Device API Indexed DB XMLHttpRequest 2 Server-Sent Events Web Sockets WebRTC SPDY http://caniuse.com/
- 12. But, HTML – Open Living Standard 웹 브라우저 벤더나 W3C가 아닌 웹 개발자의 웹 개발자를 위한 웹 개발자에 의한 살아 있는 표준 http://www.whatwg.org/specs/web-apps/current-work/multipage/
- 13. 웹 앱의 네가지 문제점 소프트웨어 설치 문제 로컬 저장 공간 문제 인터랙티브한 유저인터페이스 문제 서버 의존성의 문제
- 14. (1) Installable Web App 설치 가능한 웹 애플리케이션! 오프라인에서 사용 가능~ https://developer.mozilla.org/en/Using_Application_Cache
- 15. 지메일 모바일 버전 오프라인에서 사용 가능~
- 16. (2) 로컬 데이터 베이스: DOM Storage sessionStorage.setItem('version',5); sessionStorage.getItem('version'); https://developer.mozilla.org/en/DOM/Storage
- 17. 지메일 모바일 버전 개인 메일 정보를 로컬에 저장
- 18. (3) 인터랙티브 API <input type="file" multiple /> https://developer.mozilla.org/en/Using_files_from_web_applications <div id=“box" draggable></div> https://developer.mozilla.org/en/DragDrop/Drag_and_Drop
- 19. File API & Drag/Drop API 플러그인 없이 파일 첨부 기능 이용 가능~
- 20. (4) HTTP 의존성 탈피- WebSocket Web technology providing for bi-directional, full-duplex communications channels over a single TCP connection. https://developer.mozilla.org/en/WebSockets http://www.youtube.com/watch?v=yt_4zmCfHhg
- 21. WebRTC – 서버 의존성 탈피 P2P 통신으로 화상 회의 및 실시간 채팅 가능! http://www.w3.org/TR/webrtc/ http://webrtc.org
- 22. c.f. 과거 웹 개발 (Web Document) Model Internet DB View Plug-in <! DOCTYPE XHTML…> <title>$title</title> Structure <body> <h1>Hello, Wolrd</h1> </body> </html> Presentation body { font-size: 9pt;} h1 {color:blue;} Function popup(url) { Behavior } window.open(url); Controller
- 23. HTML 5 기반 (Web application) Local Plug-in Storage NoSQL Internet Structure Ajax RESTful {"Name": "Cheeso", "Rank": 7} disk Presentation Cloud Computing Behavior
- 24. 그러나 아직 웹이 못하는 것 디바이스 제어…
- 25. 2. Mozilla Web API HTML5의 미지원 항목? • 통신: WiFi 정보, 모바일 통신, • 각종 센서: 광센서, 근접센서... • 하드웨어 제어: USB, BlueTooth, NFC... Mozilla Web API • HTML5 내 기본 API 이외 웹 기반 API로서 W3C의 Device API와 함께 빠진 표준안을 제정하고 구현. https://wiki.mozilla.org/WebAPI
- 26. Web API의 구현 현황 기존 지원 API • Geolocation (위치 정보), Orientation (가속도 센서), Audio Data API, WebGL (3D 그래픽), Camera API (WebRTC 에 포함) • Android용 Firefox 에서 구현 완료 개발 완료 API • SMS, Telephony, Contacts Settings, Network Information Vibration, Pointer Lock Battery Status, Resource Lock (sleeve 금지) Light Sensor (광센서), Proximity Sensor (근접센서) 개발 중인 API • WebRTC (Camera, P2P 포함) Open Web Apps (앱 관리) Device Storage Idle, Power Management Mobile Connection, WiFi Information (무선 정보),TCP Socket 개발 예정 API • UDB Datagram Socket Bluetooth, USB, NFC WebSocket API, Background Service USB Reading(B2G 전용)
- 28. 3. Boot2Gecko Open Mobile Web OS • 웹 기반 앱의 실행에 최적화 • 폐쇄형 상용 모바일 OS의 대안 주요 구성 • Gaia – 유저인터페이스 • Gecko – 웹 런타임 • Linux – Gonk 기반 임베디드 OS https://wiki.mozilla.org/B2G
- 29. 다양한 디바이스에 포팅 가능! For Hacker 갤럭시S2에 B2G 포팅하기 https://developer.mozilla.org/ko/Mozilla/Boot_to_Gecko /Building_B2G_for_Samsung_Galaxy_S2
- 31. 향후 계획 주요 일정 • 2012/03/09 - M2.1 Dogfood Release • 2012/03/26 - M2.5 Developer Preview Phone JSConf 에서 개발 단말 배포 • 212/06/01 - M3 • 2012/06/29 - M4 제품화 계획 • Telefnica: 올해 중 단말기 출시 (유럽 및 남미) • Deutsche Telekom (T-Mobile) Innovation Labs 개발에 참여. • Adobe, Qualcomm 등도 협력 (PhoneGap 의 B2G 대응) 국내에서도 관심 있는 벤더 있음?
- 32. 대안으로서 오픈 웹 앱스토어 상용 폐쇄 앱 플랫폼
- 33. 4. Mozilla 마켓플레이스 목적: 웹 플랫폼으로서 업계표준 기술로 어디에서라도 동작하는 애플리케이션 환경 구축 단말 및 운영체제 독립적인 웹 앱 스토어 구축 • 인증, 과금, 커뮤니티 기반 심사 시스템 채택 브라우저 비 의존 • Firefox 뿐만 아니라 다른 브라우저에서 이용 가능 및 하위 호환성 제공 Firefox 베타 버전에 탑재 완료 및 올해 정식 릴리스를 예정 https://marketplace.mozilla.org
- 35. 모바일/PC 앱 배포 채널 제공
- 36. 앱 관리: Firefox Home Tab
- 37. 표준 웹 앱 배포 스펙 Content-Type: application/xweb-app-manifest+json { "version": "1.0", "name": "MozillaBall", "description": "Exciting Open Web development action!", "icons": { "16": "/img/icon-16.png", "48": "/img/icon-48.png", "128": "/img/icon-128.png" }, "developer": { "name": "Mozilla Labs", "url": "http://mozillalabs.com" }, "installs_allowed_from": [ "https://appstore.mozillalabs.com" ], "default_locale": "en" } https://developer.mozilla.org/en/OpenWebApps/The_Manifest
- 38. 개발자 앱 등록 방법 https://marketplace.mozilla.org/ko/ecosystem/
- 39. 소셜 웹의 아이덴티티 위험 자신의 개인 정보를 독점 소셜웹 사이트의 서드파티 소셜앱에서 마음대로 사용가능 자신의 아이덴티티 직접 제어하지 못하는 현상 제 2의 ActiveX와 유사
- 40. 6. Mozilla Persona 소셜 웹 시대의 문제점 • Google, Facebook, Twitter... • 소셜앱의 무분별한 정보 수집 • 사용자의 프라이버시 제어 제약 분산형 인증 기술: BrowserID • 브라우저 기반의 간단한 인증 API • 메일 주소 기반 Persona 와 BrowserID • Mozilla Persona: 인증 서비스명 • BrowserID:Persona 의 개발 코드 https://browserid.org/
- 41. c.f. 인증수단 비교표
- 42. Browserid.org
- 43. BrowserID 구현 기술 소개 Veried Email Protocol • 메일 주소의 소유를 확인 • Primary Identity Authority: 메일 서비스 자신이 인증 메일 서버 제공 • Secondary Identity Authority: 제삼자가 인증 서버를 제공 확인 메일을 송신해 소유 확인 구현 코드 <script src="https://browserid.org/include.js"></script> <script> navigator.id.get(function(assertion) { if (assertion) { // 인증 검증 및 처리 } else { // 에러 처리 } }); </script> https://developer.mozilla.org/en/BrowserID/Protocol_Overview
- 44. 미래의 웹 기술 방향 서버가 필요 없는 웹 • DOM Storage, Indexed DB • WebSocket, WebRTC • Offline App Cache 멀티미디어 기반 웹 • Audio/Video, 2D(Canvas/SVG), 3D(WebGL) • CSS3(Transform, Animation, 3D) 디바이스 독립적 웹 • Web API, B2G 비즈니스 플랫폼으로서 웹 • Mozilla Market Place • BrowserID
- 45. 한국의 당면과제 IE 점유율 90%, 크롬 4%, Firefox 2%... • Global: IE 30%, 크롬 30%, Firefox 25%, 기타 10% • 액티브 X 기반 PC 환경 개선 모바일 웹 선도 ▶ PC 웹 환경 개선 • 모바일 기반의 다양한 웹애플리케이션 장려 • 안드로이드 중심 생태계 개선 대안과 다양성에 대한 공론화 ▶ 글로벌 지향
- 46. 참고. 한국의 액티브X
- 47. 브라우저 전쟁의 비표준 기술의 산물 http://msdn.microsoft.com/en- http://docs.oracle.com/cd/E19957- us/library/windows/desktop/aa388154% 01/816-6152-10/sgntxt.htm 28v=vs.85%29.aspx
- 48. 왜 공인 인증은 웹 표준이 없나? 관심이 없어서… 2006년 부터 WHATWG 및 W3C HTML WG에서 제안 http://lists.whatwg.org/htdig.cgi/whatwg-whatwg.org/2006-October/007571.html
- 49. 개인적인 활동의 한계
- 50. 목소리 키우기: Web Crypto API 제안 • http://html5.creation.net/webcrypto-api/ • Focused on certificate services, but issues on identity
- 51. Web Identity 필요성 대두 Mozilla 내부에서 국내 액티브X 이슈화 • 2008년 미첼 베이커 의장 방문 • 2010년 루카스아담스키 보안총괄 방문 BrowserID 및 DOM Crypt (2011) Mozilla의 아이덴티티 기능 필요 • http://identity.mozilla.com/post/7616727542/introduc ing-browserid-a-better-way-to-sign-in 웹 기반 암호화를 통한 인증 기능 필요 • http://lists.whatwg.org/htdig.cgi/whatwg- whatwg.org/2011-May/031741.html • DOM Crypt 표준 작업 진행 및 W3C 표준화 제안 W3C 내에 Web Cryptography W/G • 2011년 11월 결정 및 2012년 3월 생성
- 52. W3C Web Crypto API http://www.w3.org/2012/webcrypto/WebCryptoAPI/
- 53. 향후 진행 과정 올해 하반기 중에 중요 웹 암호 관련 API 구현 완료 2차 구현 기능은 스펙 작업 중 • Web Certificate Service API로 진행 예정 TLS login/out, key management including import/export and signing/verification • 한국의 공인 인증 기능 지원 가능 참여 방법 • Join W3C WebCryptography W/G http://lists.w3.org/Archives/Public/public-webcrypto/ • Join W3C WebCrypto API Community Group http://www.w3.org/community/webcryptoapi/
- 54. 지금 다운로드! Firefox Beta for Android https://play.google.com/store/apps/details?id=org.mozilla.firefox_beta
- 55. The Story of Mozilla 함께 해 주세요! http://www.mozilla.or.kr http://www.youtube.com/watch?v=AQuOhrXINiM
- 56. Reference 1. B2G • GAIA: https://github.com/andreasgal/gaia/ • Build: https://wiki.mozilla.org/Gaia/Hacking#Building_B2G • Device Porting: https://developer.mozilla.org/en/Mozilla/Boot_to_Gecko#Setting_up_building_Boot_t o_Gecko • Developer Phone: https://wiki.mozilla.org/B2G/DeveloperPhone#Advanced_Gaia_Hacking • Mailinglist: https://groups.google.com/forum/#!forum/mozilla.dev.b2g • IRC: irc://irc.mozilla.org #b2g 2. Market Place • App Manifest Standards: http://appmanifest.org • 개발자 문서 https://developer.mozilla.org/en/Apps • 앱 등록 방법 http://hacks.mozilla.org/2012/02/mozillamarketplace-open-for-app- submissions/ 3. BrowserID • 웹 사이트 탑재 방법: https://github.com/mozilla/browserid/wiki/How-to-Use- BrowserID-on-Your-Site
- 57. Thanks for Listening! Q&A @mozillakr @channyun [email protected] http://forums.mozilla.or.kr http://facebook.com/mozillakr