Chrome拡張機能をつくる #TechLunch

Transcript

1. γεςϜ։ൃ෦ɹϝσΟΞ։ൃୈ̎άϧʔϓ Copyright © LIVESENSE Inc. ླ໦ɹ݈ଠ Chrome֦ுػೳΛ࡞Δ Cybozu Hack

2. None
3. None

4. 拡張機能でできること

5. •  λϒ •  ͓ؾʹೖΓ •  ݱࡏද͍ࣔͯ͠Δϖʔδ •  όοΫάϥ΢ϯυʹৗற •  ΫϦοϓϘʔυ

   •  ΫοΩʔ •  σεΫτοϓ௨஌ ͍Ζ͍Ζ͍͡Ε·͢ http://developer.chrome.com/extensions/declare_permissions.html

6. •  Javascript •  HTML •  Css •  ը૾ ඞཁͳ΋ͷ

7. None

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. ͝ਗ਼ௌ͋Γ͕ͱ͏͍͟͝·ͨ͠ɻ