Upgrade to Pro — share decks privately, control downloads, hide ads and more …

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

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

Masahiko Sakakibara

November 19, 2022
Tweet

More Decks by Masahiko Sakakibara

Other Decks in Programming

Transcript

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

    8FC"1*ͱ$BQBDJUPSೖ໳

    View full-size slide

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

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

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

    ୅ද

    View full-size slide

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

    View full-size slide

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

    View full-size slide

  5. *POJD%FWFMPQFS&YQFSU

    View full-size slide

  6. 4USJQF$PNNVOJUZ&YQFSU

    View full-size slide

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

    View full-size slide

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

    View full-size slide

  9. ΞϓϦ͕ར༻Ͱ͖Δ"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 full-size slide

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

    View full-size slide

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

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

    View full-size slide

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

    View full-size slide

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

    View full-size slide

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

    View full-size slide

  15. 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 full-size slide

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

    View full-size slide

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

    View full-size slide

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

    View full-size slide

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

    View full-size slide

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

    View full-size slide

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

    View full-size slide

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

    View full-size slide

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

    View full-size slide

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

    View full-size slide

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


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

    View full-size slide

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

    View full-size slide

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

    View full-size slide

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

    View full-size slide

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

    View full-size slide

  30. 5IF4UBUFPG+4

    View full-size slide

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

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

    View full-size slide

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

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

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

    View full-size slide

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

    View full-size slide

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

    View full-size slide