Chrome拡張機能をつくる #TechLunch

Chrome拡張機能をつくる
2013/11/26 (水) @ Livesense TechLunch
発表者：鈴木 健太

Transcript

1. γεςϜ։ൃ෦ɹϝσΟΞ։ൃୈ̎άϧʔϓ Copyright © LIVESENSE Inc. ླ໦ɹ݈ଠ Chrome֦ுػೳΛ࡞Δ Cybozu Hack
4. 拡張機能でできること
5. •  λϒ •  ͓ؾʹೖΓ •  ݱࡏද͍ࣔͯ͠Δϖʔδ •  όοΫάϥ΢ϯυʹৗற •  ΫϦοϓϘʔυ •  ΫοΩʔ •  σεΫτοϓ௨஌ ͍Ζ͍Ζ͍͡Ε·͢ http://developer.chrome.com/extensions/declare_permissions.html
6. •  Javascript •  HTML •  Css •  ը૾ ඞཁͳ΋ͷ
8. Chromeで確認
9. 作り方
10. manifest.json ઃఆϑΝΠϧ {      "manifest_version":  2,      “name”:  “拡張機能の名前",      “version”:  “バージョン番号",        “descrip8on”:  “この拡張機能はこんなことができます",      "icons":  {...},        "background":  {          “persistent”:  false  //  バックグラウンドに常駐しない      },      “background_page”:  ...,  //  バックグラウンドで色々やってくれるやつ      “permissions”:  [“hCp://*.google.com/”,  ”no8fica8ons“],  //  権限ください     続く…
11. manifest.json ઃఆϑΝΠϧ …続き     "browser_ac8on":  {                  “default_icon”:  “img/icon.png”,  //  表示するアイコン                  “default_popup”:  “popup.html”  //  アイコンをクリックしたときに表示する画面          },                    “op8ons_page”:  “op8ons.html”  //  オプション（設定）画面   }
12. ৭ʑ΍ͬͯΈΔ %&.0
    
13. Chromeͷ֦ுػೳ͕ॏ͍ݪҼͷҰ͕ͭ ʮόοΫάϥ΢ϯυϖʔδ͕ৗʹ։͍͍ͯΔʯ͜ͱ όοΫάϥ΢ϯυʹৗற͠ͳ͍ ඞཁʹԠͯ͡ϖʔδΛ։͍ͯϦιʔεফඅΛ࡟ݮ͢Δ &WFOU
    1BHF
    
14. # 5෼ຖʹόοΫάϥ΢ϯυΛى͜͢ΞϥʔϜΛηοτ chrome.alarms.create(‘alarmName’, { periodInMinutes: 5}); # ΞϥʔϜ͕ͳͬͨͱ͖ͷॲཧ chrome.alarms.onAlarm.addListener(function(alarm) { alert(alarm.name); }, this)); όοΫάϥ΢ϯυ͸ΞϥʔϜͰى͜͞ΕΔ
15. σʔλͷอଘ MPDBM4UPSBHF
    ͍ͭϖʔδ͕ফ͑ͯ΋͍͍Α͏ʹɺσʔλ͸ஞ࣍อଘ
16. CybozuのChrome拡張機能 をつくってみた
17. αΠϘ΢ζ͋Δ͋Δ ༧ఆ͕ೖ͍ͬͯͨͷʹ๨Εͯͨ
18. ということで、 予定の数分前に通知してくれる 拡張機能をつくってみた
19. αΠϘ΢ζ αΠϘ΢ζެࣜΩϟϥΫλʔʮϘ΢ζϚϯʯ͕௨஌ͯ͘͠Ε·͢ɻ
20. αΠϘ΢ζ %&.0
    
21. ͝ਗ਼ௌ͋Γ͕ͱ͏͍͟͝·ͨ͠ɻ