Monaca、WKWebViewに移行しようぜ！

https://monacaug.connpass.com/event/170995/ の発表資料

Transcript

1. MonacaɺWKWebViewʹҠߦ͠Α ͏ͥʂ Daisuke Kishino Monaca UG ONLINE #1 2020.4.2
2. ࣗݾ঺հ • ϐʔϓϧιϑτ΢ΣΞגࣜձࣾ • ؛໺ େี(@kishisuke) • Ԭࢁݝ૔ෑࢢࡏॅ • ͜͜2೥൒͸BaaS@rakuza+MonacaΞϓϦͷ։ൃ (Vue.jsϝΠϯ) • Monaca UG OKAYAMA΍ͬͯ·͢ • ࠷ۙ͸FlutterΞϓϦ΋࡞ͬͯ·͢
3. ൃ୺ https://developer.apple.com/news/?id=12232019b ”App Store͸ɺ2020೥4݄Ҏ߱ɺUIWebViewΛ࢖༻͢Δ৽͍͠Ξ ϓϦɺ͓Αͼ2020೥12݄Ҏ߱ɺUIWebViewΛ࢖༻͢ΔΞϓϦͷ ΞοϓσʔτΛड͚෇͚ͳ͘ͳΓ·͢ɻ”
5. Ͳ͏͢Ε͹ྑ͍ͷʁ • UIWebViewΛ࡟আ͢Δ • ͔ΘΓʹWKWebViewΛ࢖͏ • Ҏ্ʂ
6. WKWebView is Կ • iOS 8͔Βొ৔ͨ͠৽͍͠WebView • ϨϯμϦϯά΍JSͷ࣮ߦ͕ߴ଎ • ϓϩηε͕ΞϓϦͱ෼཭͍ͯ͠ΔʢΫϥογϡ͠ʹ͍͘ʣ • ηΩϡϦςΟ͕ݫ֨
7. 
   J04ϦϦʔεɻ8,8FC7JFX͕ొ৔ 
   J04ϦϦʔεɻ6*8FC7JFX͕ඇਪ঑ʹͳΔ 
   ͍ۙকདྷ6*8FC7JFXΛؚΉΞϓϦͷਃ੥͕Ͱ͖ͳ͘ͳΔܯࠂ͕௨஌ ͞ΕΔʢ*5.4ʣ
   
   ৽ن͸ɺطଘ͸ʹ6*8FC7JFXΛؚΉΞϓϦͷਃ ੥͕Ͱ͖ͳ͘ͳΔ͜ͱ͕௨஌͞ΕΔ
   
   .POBDB͕8,8FC7JFXͷαϙʔτΛ։࢝ 
   6*8FC7JFXΛؚΉ৽نΞϓϦͷਃ੥͕Ͱ͖ͳ͘ͳΔˡΠϚίί 
   6*8FC7JFXΛؚΉطଘΞϓϦͷਃ੥͕Ͱ͖ͳ͘ͳΔ
8. UIWebViewΛར༻͍ͯ͠Δ͔֬ೝ͢Δํ๏ • UIWebViewΛ࣮ࡍʹը໘ʹද͍ࣔͯ͠ͳ͘ͱ΋ɺϦϯΫ͍ͯ͠Δ৔߹͸ϦδΣΫτ͞ ΕΔՄೳੑ͕͋Δ • UIWebView͕ϦϯΫ͞Ε͍ͯΔ͔͸nmίϚϯυͰ֬ೝՄೳ • ※όΠφϦϑΝΠϧͷύε͸ҎԼͰ֬ೝ 1. ipaϑΝΠϧΛղౚ͢Δʢ֦ுࢠΛzipʹมߋͯ͠ɺzipܗࣜͱͯ͠ղౚʣ 2. {ϑΝΠϧ໊}/Payload/{ϑΝΠϧ໊}.app/{ϑΝΠϧ໊} nm <όΠφϦϑΝΠϧͷύε> | grep UIWebView
9. UIWebViewΛར༻͍ͯ͠Δ͔֬ೝ͢Δํ๏ • ݁ՌྫʢԿ΋දࣔ͞Εͳ͔ͬͨΒOKʣ U _OBJC_CLASS_$_UIWebView U _OBJC_METACLASS_$_UIWebView U _OBJC_CLASS_$_UIWebView U _OBJC_METACLASS_$_UIWebView
10. جຊతͳରԠํ๏
11. WebViewͷEngineΛWKWebViewʹมߋ
12. WebViewΛWKWebViewʹมߋ WKWebView ʹมߋ
13. PlatformͱXcodeΛมߋ iOS 5.1.1 ʹมߋ Xcode11.3 ʹมߋ
14. WKWebView൛ΧελϜσόοΨʔʹରԠ Monaca Core UtilityΛ Ұ୴࡟আ
15. WKWebView൛ΧελϜσόοΨʔʹରԠ ௥Ճ 2.1.0 ΛΠϯετʔϧ
16. αʔυύʔςΟϓϥάΠϯͷରԠ
17. αʔυύʔςΟϓϥάΠϯͷରԠ • αʔυύʔςΟͷϓϥάΠϯͰ΋UIWebViewΛϦϯΫ͍ͯ͠ΔՄೳ ੑ͕͋Δɻ • ͦͷ৔߹ɺϓϥάΠϯΛΞοϓσʔτ·ͨ͸࡟আʢඞཁͰ͋Ε͹୅ ସ࣮૷ʹҠߦʣ͢Δ
18. ରԠྫ • InAppBrowser • WKWebViewʹରԠ͓ͯ͠ΓɺUIWebViewͷඇϦϯΫԽ΋3.2.0͔ΒରԠ • Firebase SDK • 6.8.0ͱ6.8.1͔ΒUIWebViewͷඇϦϯΫԽʹରԠʢ6.8.1ະຬͷ৔߹͸ཁ Ξοϓσʔτʣ • AFNetworking • 3.xͰ͸UIWebView͕ϦϯΫ͞Ε͍ͯΔɻ4ͰରԠ൛ΛϦϦʔε༧ఆ
19. ϋϚͬͨ఺
20. LocalStorage
21. LocalStorageͷσʔλอଘ৔ॴ Ҡߦલ Ҡߦޙ Library !"" WebKit !"" LocalStorage !"" file__0.localstorage Library !"" WebKit #"" LocalStorage $ !"" file__0.localstorage $ !"" WebsiteData !"" LocalStorage !"" file__0.localstorage WKWebView͕ ࢀর ࢀর͞Εͳ͘ͳΔ ʢফ༷͑ͨʹݟ͑Δʣ
22. LocalStorageͷσʔλΛҠߦ͢Δ • cordova-plugin-migrate-localstorageΛΠϯετʔϧ͢Δ͚ͩ • ϓϥάΠϯͷॳظԽ࣌ʹWebKit/LocalStorage/file__0.localstorage͔ΒWebKit/ WebsiteData/LocalStorage/file__0.localstorageʹϑΝΠϧΛίϐʔ͢Δ • Ωϟογϡσʔλ͔͠LocalStorageʹอଘ͍ͯ͠ͳ͍৔߹͸ɺ͋͑ͯҠߦ͢Δඞཁ͸ ͳ͍͔΋ • ςετ͸ೖ೦ʹ͢ΔʢGoogle Chrome 79ͷ൵ܶΛ܁Γฦͯ͠͸͍͚ͳ͍..ʣ
23. CordovaͰXHR͕ΤϥʔʹͳΔ
24. HTTP(S)΁ͷΞΫηε MonacaΞϓϦ ʢfile://…ʣ API ʢhttps://example.com/…ʣ WKWebView͸ ಉҰੜ੒ݩϙϦγʔʹΑΓ XHRͰΞΫηεͰ͖ͳ͍ ϒϥ΢βͱಉ༷ʹ CORSରԠ͕ඞཁ
25. ϩʔΧϧϦιʔε΁ͷΞΫηε MonacaΞϓϦ ʢfile://…ʣ MonacaΞϓϦ ʢfile://…/page.htmlʣ WKWebView͸ fileεΩʔϜͷϩʔΧϧϦιʔε ʹXHRͰΞΫηεͰ͖ͳ͍
26. ղܾࡦᶃ: cordova-plugin-wkwebview-file-xhr • cordova-plugin-wkwebview-file-xhr • XHRͷॲཧΛϑοΫͯ͠ɺωΠςΟϒଆʢNSURLSessionʣͰϩʔ ΧϧϑΝΠϧʹΞΫηεͯ݁͠ՌΛฦ͢ • ϓϥάΠϯͷॳظԽ׬ྃ͠ͳ͍ͱXHRϦΫΤετͰ͖ͳ͍఺ʹ஫ҙ
27. ղܾࡦᶄ: Custom SchemeϓϥάΠϯ • ϩʔΧϧϦιʔεʹXHRͰΞΫηε͢ΔͨΊͷMonacaެࣜͷϓϥάΠϯʢ3/31ϦϦʔεʣ • wwwσΟϨΫτϦ഑ԼͷϑΝΠϧશମΛΧελϜεΩʔϜΛ௨ͯ͡ΞΫηε͢Δ • fileεΩʔϜͰ͸ͳ͍ͷͰΞΫηε੍ݶͳ͠ • cordova-plugin-wkwebview-file-xhrͱҟͳΓɺϓϥάΠϯͷॳظԽΛ଴ͭඞཁͳ͠ monaca-app://monaca.io/www/index.html
28. ղܾࡦᶄ: Custom SchemeϓϥάΠϯ • ஫ҙ఺ • WKURLSchemeHandlerΛ࢖͍ͬͯΔʢϋζʣͳͷͰɺiOS11Ҏ߱ͷΈରԠ • publicͳnpmϨδετϦͰެ։͞Ε͍ͯͳ͍ͨΊɺϩʔΧϧ؀ڥͰ͸npm installͰ͖ͳ͍
29. ͦͷଞͷ໰୊͕ى͖ͨΒ • ·ͱΊهࣄΛಡΉ • https://qiita.com/kishisuke/items/d201790aeae2129ff2e3 • CordovaͷIssueΛ֬ೝ͢Δ • https://issues.apache.org/jira/issues/? jql=project%20%3D%20CB%20AND%20labels%20%3D%20wkwebview- known-issues
30. ྑ͍͜ͱ΋͋Δ • ύϑΥʔϚϯεͷ޲্ • ApplePayɺSign in with AppleͳͲͷ࠷৽ػೳʹରԠ͍ͯ͠Δ • UIWebViewͷόά͕௚Δ