JavaScriptから デバイスの力を100%引き出すための Web APIとCapacitor入門 / power_from_javascript

Transcript

1. +BWB4DSJQU͔ΒσόΠεͷྗΛҾ͖ग़ͨ͢Ίͷ
   

   8FC"1*ͱ$BQBDJUPSೖ໳
   

   View Slide

2. ࣗݾ঺հ
   ࡗݪণ඙
   Ұൠࣾஂ๏ਓϦϨʔγϣϯσβΠϯ
   

   ݚڀॴ୅දཧࣄ
   Ұൠࣾஂ๏ਓΤϦΞɾ
   

   ΠϊϕʔγϣϯɾΞϥΠΞϯε$50
   *POJD+BQBO6TFS(SPVQ
   

   ୅ද
   

   View Slide

3. 
   UJQTZT
   

   View Slide

4. ৯඼දࣔҹ࡮
   εϚϗͱϓϦϯλ͚ͩͰ৯඼දࣔϥ
   ϕϧΛͭ͘ΕΔ೔ຊॳͷઐ༻ΞϓϦ
   

   View Slide

5. XJOFDPEF
   ଟछྨଟ਺ྔͷϫΠϯΛෳ਺ڌ఺Ͱ؅ཧͰ
   ͖Δ೔ຊ།ҰͷΞϓϦɻ
   

   View Slide

6. *POJD%FWFMPQFS&YQFSU
   

   View Slide

7. 4USJQF$PNNVOJUZ&YQFSU
   

   View Slide

8. ϒϥ΢β͸ػೳ੍ݶΛड͚͍ͯΔɻ
   

   View Slide

9. ΞϓϦ͕ར༻Ͱ͖Δ$BQBCJMJUJFT
   ϞόΠϧσόΠε͸ɺΞϓϦͰར༻Ͱ͖Δແ਺ͷ"1*Λఏڙɻ
   ྫʣ9DPEFͰ໌ࣔతʹڐՄ͕ඞཁͳ$BQBCJMJUJJFT
   

   View Slide

10. ΞϓϦ͕ར༻Ͱ͖Δ"1*
    NSCameraUsageDescription
    NSPhotoLibraryAddUsageDescription
    NSPhotoLibraryUsageDescription
    android:name="android.permissi
    on.READ_EXTERNAL_STORAGE"/>
    android:name="android.permissi
    on.WRITE_EXTERNAL_STORAGE" />
    Χϝϥ
    ৼಈ
    NSLocationAlwaysUsageDescription
    NSLocationWhenInUseUsageDescription
    android:name="android.permission
    .ACCESS_COARSE_LOCATION" />
    android:name="android.permission
    .ACCESS_FINE_LOCATION" />
    android:name="android.hardware.l
    ocation.gps" />
    ετϨʔδ ϑΝΠϧγεςϜ ϓογϡ௨஌
    Ґஔ৘ใ
    

    View Slide

11. ϞόΠϧσόΠεΛ௨ͯ͠֎෦σόΠεΛ੍ޚ͢Δ͜ͱ΋Մೳ
    

    View Slide

12. ϞόΠϧϒϥ΢β͸Ұ෦ػೳ͕ڐՄ͞ΕͨʮΞϓϦʯ
    ΞϓϦʹڐՄ͞ΕΔσόΠεͷػೳ܈
    ͦͷҰ෦͕ڐՄ͞Εͨϒϥ΢β
    8FCΞϓϦ͸ϒϥ΢β"1*Λ௨ͯ͠
    

    ͦͷҰ෦ͷػೳʹΞΫηε͍ͯ͠Δ
    ˣ
    Χϝϥ
    Ґஔ৘ใ
    ετϨʔδ
    

    View Slide

13. 18"8FCαΠτͰ΋ΞϓϦͷΑ͏ʹৼΔ෣͍͍ͨʂ
    

    View Slide

14. 18"ʢ1SPHSFTTJWF8FC"QQTʣϗʔϜʹ௥Ճ
    

    View Slide

15. 18"ʢ1SPHSFTTJWF8FC"QQTʣ௨஌ΦϑϥΠϯ
    wϒϥ΢βͷ֎͔ΒϢʔβ͕ΞΫηεͰ͖
    ΔʢϗʔϜʹ௥Ճʣ
    wΞΫςΟϒ͡Όͳ͍ͷʹϢʔβʹΞΫ
    γϣϯ͕Ͱ͖Δʢϓογϡ௨஌ʣ
    wΦϯϥΠϯ͡Όͳ͍ͷʹར༻Ͱ͖Δ
    ౰࣌ɺʮ৽͍͠8FCʯͩͬͨɻ
    

    View Slide

16. 8FC64#"1*8FC#MVFUPPUI"1*
    U
    i n t 8
    A
    r
    r
    a
    y .
    o f
    ( 0
    x 0
    0
    ,
    0
    x 0
    0
    , 0
    x f
    f
    , 0
    x f
    f
    , 0
    x f
    f
    ,
    0
    x 0
    3
    , 0
    x 0
    0
    , 0
    x f
    d
    ,
    0
    x d
    6
    , 0
    x 2
    a
    , 0
    x 0
    1
    ,
    0
    x f
    f
    , 0
    x 0
    0
    )
    
    パケットを自分で組み立
    てれたら楽しいかも？！
    

    View Slide

17. ͳ͓ɺ4BGBSJͰ͸ඇରԠɻ
    

    View Slide

18. ͳ͓ɺ4BGBSJͰ͸ඇରԠɻ
    "QQMFɺϓϥΠόγʔอޢͷ؍఺͔Β4BGBSJ
    ʹͷ8FC"1*Λ࣮૷͢Δ͜ͱΛஅ೦
    

    View Slide

19. .E/8FC"1*௨஌"1*Ͱݴٴ͋ΔϨϕϧ
    

    View Slide

20. ͳͥɺҰ෦͔͠ڐՄ͞Εͳ͍ɹˠɹ8FCΞϓϦ͕৹ࠪΛड͚͍ͯͳ͍͔Β
    w ੍ݶ͞Ε͍ͯΔίϯςϯπ
    w ͳΓ͢·͠
    w ஌తࡒ࢈ݖ
    w ϓϥΠόγʔɺ࠮ٗɺෆਖ਼ར༻
    w ऩӹԽͱ޿ࠂ
    w ετΞͷܝࡌ৘ใͱϓϩϞʔγϣϯ
    w εύϜͱ࠷௿ݶͷػೳ
    w Ϛϧ΢ΣΞ
    w ϞόΠϧͷ๬·͘͠ͳ͍ιϑτ΢ΣΞ
    w ϑΝϛϦʔ
    IUUQTQMBZHPPHMFDPNBCPVU
    EFWFMPQFSDPOUFOUQPMJDZ
    

    View Slide

21. $BQBDJUPS8FCαΠτΛΞϓϦʹͪ͠Ό͑͹͍͍͡Όͳ͍
    

    View Slide

22. ΞϓϦͱͯ͠৹ࠪΛड͚ΔͨΊʹϒϥ΢βΛཧղ͢Δ
    εςʔλεόʔ
    8FC7JFX
    63-όʔ
    σόΠε04͕දࣔɻΞϓϦϨϕϧͰ͸
    ഑৭Λมߋͨ͠ΓɺඇදࣔʹͰ͖Δɻ
    ϒϥ΢βΞϓϦ͕දࣔɻ63-͔Βऔಘ͠
    ͨΞηοτΛϨϯμϦϯά͢Δɻ63-Λ
    ೖྗ͢Δ͜ͱͰͲΜͳαΠτ΋දࣔͰ͖
    ͯ͠·͏ɻ
    ϒϥ΢βΞϓϦ͕දࣔɻ
    

    View Slide

23. ΞϓϦʹ͢Δͱ͍͏͜ͱɻ
    8FC7JFXͷΞϓϦΛͭ͘Δɻ
    ʢ04ʹσϑΥϧτ౥ࡌʣΛ޿͛ͯɺ
    ϩʔΧϧʹ͋Δ8FCΞηοτΛදࣔɻ
    ˞֎෦ίϯςϯπͷ৔߹ɺ৹ࠪΛड͚ͯ
    ͍ͳ͍ୈࡾऀͷίϯςϯπ͕දࣔͰ͖ɺ
    ಉ༷ʹ"1*੍ݶ͕ೖΔͨΊɻ
    8FC7JFX
    

    View Slide

24. "1*ΞΫηεͷߟ͑ํ
    J04 "OESPJE
    J04"1*܈ "OESPJE"1*܈
    4XJGU0CKFDUJWF$$$ +BWB,PUMJO$$
    +4&YQPSU +BWB4DSJQU$PSF
    +BWB4DSJQU*OUFSGBDF
    +BWB4DSJQU +BWB4DSJQU
    

    View Slide

25. +BWB4DSJQU$PSF+BWB4DSJQU*OUFSGBDFͱ͸
    +4&YQPSU +BWB4DSJQU$PSF
    +BWB4DSJQU*OUFSGBDF
    +BWB4DSJQU +BWB4DSJQU
    8JOEPXؔ਺ 8JOEPXؔ਺
    8FC7JFX࡞੒࣌ʹ8JOEPXؔ਺ʹ௥Ճ
    

    View Slide

26. ͭ·Γ͸
    ͜ΕͰ৹ࠪ௨Ε͹ɺ"1*࢖͍͍ͨ์୊ɻ
    

    

    ΑΓϢʔβʹՁ஋͋ΔػೳΛʂ
    

    View Slide

27. $BQBDJUPS
    

    View Slide

28. 8FCΞϓϦΛΫϩεϓϥοτϑΥʔϜʹϒϦοδͤ͞Δ
    888
    8FCΞϓϦ $BQBDJUPS
    

    View Slide

29. w ʮΞϓϦʯͱ͍͏8FC7JFXΛ
    ࢖ͬͯɺ-PDBMͷ8FCΞηοτΛ
    දࣔ
    w /BUJWFػೳʹΞΫηε͢ΔͨΊ
    ͷ"1*͕ར༻Ͱ͖Δ
    $BQBDJUPSΞϓϦͷ࢓૊Έ
    

    View Slide

30. όʔδϣϯ؅ཧωΠςΟϒϑΝΠϧͷߏ଄ʢJ04ͷ৔߹ʣ
    8FCΞηοτ͸͚ͩ͜͜
    ϓϥάΠϯ͸1PE
    fi
    MFͰ؅ཧ
    

    View Slide

31. 8FCΞϓϦ͸଎͘͸ͳ͍ɻ͚Ͳ஗͘͸ͳ͍ɻ
    h t t p
    s
    :
    / / v
    i m
    e o .
    c
    o m
    / 5
    5
    4
    8
    6
    6
    8
    4
    

    View Slide

32. 5IF4UBUFPG+4
    

    View Slide

33. 1SPHSFTTJWF8FC"QQT
    wϞόΠϧͷར༻࣌ؒ͸૿Ճ܏޲
    wεϚϗΞϓϦͷ৽نΠϯετʔϧ
    

    ͸͸ʢϲ݄ʣ
    w͔ͭεϚϗΞϓϦ͸501͕ಠ઎
    wεϚϗΞϓϦʹൺ΂ͯɺ8͸ഒͷτϥϑΟοΫ
    w͍Ζ͍Ζͳ8ʹ๚໰͞ΕΔ
    

    View Slide

34. 1SPHSFTTJWF8FC"QQT
    ΞϓϦΛར༻͢ΔͷʹɺϢʔβ͸
    ̍ɽΞϓϦετΞʹભҠͯ͠
    

    ̎ɽΞϓϦΛΠϯετʔϧͯ͠
    

    ̏ɽΞϓϦΛىಈ͠ͳ͍ͱ͍͚ͳ͍
    

    

    View Slide

35. ࢖͏ϓϥοτϑΥʔϜ͸Ϣʔβ͕ܾΊΔɻ
    

    View Slide

36. 5IFBOTXFS JOBOVUTIFMM JTCFDBVTFUIBU`TXIFSFUIFTBSF
    5IFBOTXFS JOBOVUTIFMM JT
    CFDBVTFUIBU`TXIFSFUIFT
    BSF
    ౴͑͸؆୯ɻͦ͜ʹϢʔ
    β͕͍Δ͔ΒͰ͢ɻ
    ʮͲ͏ͭ͘Δ͔ʯͰ͸ͳ͘ɺʮԿΛͭ͘Δ͔ʯʹ஫ྗ͠Α͏
    

    View Slide