Tweet
Tweet

Slide 1

Slide 1 text

7BOJMMB+BWB4DSJQU͸ ϚϧνϓϥοτϑΥʔϜͷເΛݟΔ͔ ߐຊޫ੖ :6.&.*HSPX.PCJMF  1

Slide 2

Slide 2 text

ࣗݾ঺հ w ͑΋ͱΈͭ͸Δ w גࣜձࣾΏΊΈJ04ςοΫϦʔυ w ٕज़ಉਓࢽʮΏΊΈେٕྛ`ʯʹهࣄΛدߘ͠·ͨ͠ w ٕॻതʢऴྃʣɺٕज़ॻయͰ഑෍͠·͢ w ిࢠ൛΋͋Γ·͢ 2

Slide 3

Slide 3 text

+BWB4DSJQU.VMUJ1MBUGPSNͷ௅ઓ w ྲྀߦΓͷ,.1Λ࢝Ίͱͨ͠ϚϧνϓϥοτϑΥʔϜ։ൃ w J04"OESPJEͷ྆ํͰ࢖͑Δݴޠ$ ΍+BWB4DSJQU͕͋Δ w ࠓճ͸J04Ͱ+BWB4DSJQU͸ຊ౰ʹಋೖͰ͖Δͷ͔ʁ w ࢖͍ͪ͝͝͸Ͳ͏ͳͷ͔ʁΛௐ΂·ͨ͠ දهͷ஫ҙ w +BWB4DSJQU+4 w ύοέʔδϥΠϒϥϦ 3

Slide 4

Slide 4 text

+4ϥΠϒϥϦͷ४උ w +4ϥΠϒϥϦ͸؅ཧπʔϧOQN͔Β௥Ճ͢Δ͜ͱ͕Ͱ͖·͢ w IUUQTXXXOQNKTDPN w ࢲ͸ZBSO࢖͍ͳͷͰɺ࣍ͷΑ͏ͳײ͡Ͱ४උ͠·ͨ͠ cd js-packages yarn init yarn add hoge 4

Slide 5

Slide 5 text

+4ؔ਺ͷ࣮ߦ w +4$POUFYUͰKTϑΝ ΠϧΛಡΈࠐΉ w ؔ਺໊Λࢦఆͯ͠ɺؔ ਺Λऔಘ࣮ͯ͠ߦ͢Δ w ؔ਺͓Αͼ໭Γ஋͸ +47BMVFͱ͍͏ܕͰ ѻ͏ import JavaScriptCore guard let path = Bundle.main.path(forResource: "bundle", ofType: "js"), let contents = try? String(contentsOfFile: path) else { return } let context: JSContext = JSContext(virtualMachine: JSVirtualMachine()) context.evaluateScript(contents) guard let function = context.objectForKeyedSubscript(name: "func_name") else { return } let arguments = ؔ਺ͷҾ਺ʢจࣈɺ਺ࣈɺ഑ྻͳͲ [Any] ͷܕʣ let result = function.call(withArguments: [arguments]) return result 5

Slide 6

Slide 6 text

ΤϥʔϋϯυϦϯά w +4ϑΝΠϧͷಡΈࠐΈ΍ؔ਺࣮ߦͷΤϥʔ͸εϩʔ͞Εͳ͍ w +4$POUFYUͷΤϥʔϋϯυϦϯάؔ਺ΛཔΓʹݪҼΛ௥ٻͯ͠मਖ਼͢Δ w ஍ຯ͕ͩɺͱͯ΋ॏཁͳϝιουͰ͢ context.exceptionHandler = { context, error in guard let error = error, let message = error.toString() else { return } print("JSContext#exceptionHandler Error: \(message)") } 6

Slide 7

Slide 7 text

+4ϑΝΠϧͱJ04ϓϩδΣΫτ w +4Ͱ͸ʮIPHFJOEFYKTʯ΍ʮQJZPJOEFYKTʯͳͲɺಉ໊ϑΝΠϧ͕ڞ ଘͰ͖Δ͕ɺJ04ΞϓϦͷϓϩδΣΫτͰ͸ಉ໊ϑΝΠϧ͸࢖͑ͳ͍ w ϥΠϒϥϦ͕ଞͷϥΠϒϥϦʹґଘ͍ͯ͠Δ৔߹΋͋Δ w ෳ਺ͷ+4ϥΠϒϥϦΛJ04։ൃϓϩδΣΫτʹ௥Ճ͢Δͷ͸೉͍͠ 7

Slide 8

Slide 8 text

8FCQBDLͰ̍ͭͷϑΝΠϧʹ w ෳ਺ͷϑΝΠϧΛ̍ͭͷϑΝΠϧʹ·ͱΊͯ͘Ε ΔϞδϡʔϧόϯυϥ w ྫ͑͹ɺ#SJEHFͱͳΔJOEFYKTΛ࡞੒ͯ͠ɺͦ ΕΛର৅ʹͯ͠CVOEMFϑΝΠϧΛ࡞੒͢Δ w ઃఆϑΝΠϧXFCQBDLDPO fi HKTͳͲॻ͖ํ͸ল ུʢ෇࿥ͷ63-Λݟ͍ͯͩ͘͞ʣ yarn add -D webpack wepback-cli yarn webpack // index.js import hoge from "hoge" import piyo from "piyo" export class Bridge { static hoge(arg) { return hoge(arg) } static piyo(arg) { return piyo(arg) } } 8

Slide 9

Slide 9 text

Ϟδϡʔϧ࡞੒ޙͷಡΈࠐΈ w όϯυϧϑΝΠϧ͕ϞδϡʔϧԽ͞ΕͨͷͰɺؔ਺औಘ·Ͱͷεςοϓ͕ ૿͕͑ͨɺ͜Ε·Ͱ࢖͍ํͱ͸มΘΒͳ͍ guard let module = context.objectForKeyedSubscript("module_name"), let bridge = module.objectForKeyedSubscript("bridge_name"), let function = bridge.objectForKeyedSubscript("function_name") else { return } let arguments = ؔ਺ͷҾ਺ʢจࣈɺ਺ࣈɺ഑ྻͳͲ [Any] ͷܕʣ let result = function.call(withArguments: [arguments]) return result 9

Slide 10

Slide 10 text

σϞ w +VTUͱ͍͏+4ͷศརϥΠϒϥϦΛJ04 ͷதͰ࢖ͬͯΈͨ w ฏۉܭࢉʢ+VTUNFBOʣ w ཚ਺બ୒ʢ+VTUSBOEPNʣ w ͜͜Ͱɺ+VTU͸ఆ൪ϥΠϒϥϦMPEBTI ͷஔ׵ީิͷ̍ͭͱݺ͹ΕΔϥΠϒϥϦ w IUUQTHJUIVCDPNBOHVTDKVTU 10

Slide 11

Slide 11 text

ධՁɿ,.1ͷΑ͏ʹͳΔʁˠͳΒͳ͍ w +BWB4DSJQU੡ϥΠϒϥϦ͸਺͕ଟ͘ॆ࣮ͯ͠Δͷ͸͔͕֬ͩɺΘ͟Θ͟ J04ͷதͰಈ͔͢ཧ༝͸ബ͍ w +47BMVF͸ԿʹͰ΋ͳΔܕɺؔ਺Ҿ਺͸"OZͳͷͰɺܕ҆શͳ։ൃ͸Ͱ ͖ͳ͍ w ॲཧڞ௨Խ͍ͨ͠৔߹ɺૉ 7BOJMMB ͷ+4Ͱ͸ͳ͘ɺ3FBDU/BUJWFͳͲ ͷϚϧνϓϥοτϑΥʔϜରԠͷϑϨʔϜϫʔΫΛར༻͢ΔͱΑ͍ w ʢλΠτϧճऩʣ 11

Slide 12

Slide 12 text

Ͱ͸ɺͲ͏ͯ͠+4Λಈ͔͍ͨ͠ͷ͔ w ໘നͦ͏͔ͩͬͨΒ w +BWB4DSJQUͰॻ͔Εͨ044ΛJ04ΞϓϦͷதͰಈ͔͔ͨͬͨ͠ w ͱ͋Δௐ΂෺Λ͍ͯͯ͠ɺͦͷศརπʔϧ͕͋Δ͜ͱΛ஌ͬͨ w ͨͩ͠ɺͦΕ͸+BWB4DSJQU੡Ͱ͋Γɺ4XJGUͳͲͷҠ২͸ͳ͔ͬͨ w ͦ͏͍͑͹ɺJ04͸+BWB4DSJQU$PSF͕͋Δͳ͋ʜ͕ΩοΧέ w ಈ࡞֬ೝࡁΈͰɺػձ͕͋Ε͹J04%$ͷύϯϑϨοτهࣄͰॻ͖͍ͨ 12

Slide 13

Slide 13 text

·ͱΊ w ·ͬͨ͘ɺ+4͸࠷ߴͩͥ w IUUQTHJUIVCDPNNJUTVIBSV6TF+BWB4DSJQU1BDLBHFT 13