こんにちは、アプリ開発担当のエモトです。待望の映画 SHIROBAKO が地方映画館でも上映される矢先、昨今の事情で休館になり、悲しみに暮れております。しかしながら、首都圏中心だったIT技術系の勉強会がリモート開催されるようになったりと、新しい世界を楽しもうと思った田舎民です。
さて、先日のアップデートでオーディオブックアプリは iOS / Android ともに Sign in with Apple に対応しました。今回は、その話を少ししたいと思います。Webでの話は こちら をご覧ください。
Sign in with Apple
Sign in with Apple は、アップル社が Apple ID を使った認証システムを提供します。ユーザーはパスワード不要で Face ID / Touch ID でアプリに登録やログインできる、サービス提供側は承認済みの Apple ID なのでメール確認不要など、様々な利点のもとで利用することができます。
React Nativeアプリで実装する
弊社サービスは自社の会員登録に加えて、Facebookでのログインをサポートしているので、Sign in with Apple は開発ガイドラインからも対応必須でした。アプリは React Native でクロスプラットフォーム開発を行っていますが、この実装は iOS / Android それぞれ別々に実装をしました。
iOS
こちらのライブラリ invertase/react-native-apple-authentication を使用しました。iOS の SDK をラッパーしているので、一連の認証フェーズは問題なく実装できました。手前味噌ですが、このライブラリのネイティブ部分のコードに不足があったので、私の方でPRを出して、コードを修正しました。
検証中に気づいた点として、シミュレーターでは Sign in with Apple はサポートされてないようなので、実際の認証を確認する場合は実機でデバッグするとよいです。また、当初は iPod touch で実機検証していたのですが、検証のたびに Apple ID のパスワードを入れるのが億劫でして、検証機を Touch ID がある iPhone 8 に入れ替えました。開発時は、利点でもある Touch ID や Face ID がある端末を利用するのがおすすめです。
Android
Android で Sign in with Apple を用いるのは個人的にもレアケースだと思います。弊サービスは iOS / Android / Web と複数のプラットフォームで提供しており、スマホは Android だけどタブレットは iPad などのケース（その反対も）も考えられるので、Android でも実装しました。
アップルが Android 用のネイティブ開発の SDK を用意していないのもあり、開発時点で React Native で利用できるライブラリは見つけることはできませんでした。そこで、直接認証URLにアクセスして、認証を行いました。
こちらのサイト Incorporating Sign in with Apple into Other Platforms / Send the Required Query Parameters を参考にして、https://appleid.apple.com/auth/authorize の認証URLを生成しました。redirect_uri に指定したURLに認証結果が戻ってくるので、それからユーザー情報を取得して、アプリを実装しました。
当たり前ですが、SDK で組んだ iOS に比べて、Android の方が手間がかかりました。
まとめ
実装自体は簡単にできると思います。しかしながら、名前が取得できるタイミングが最初の認証時のみなど、Sign in with Apple の仕様面を自社サービスに組み込むところに苦労しました。通常な使い方では問題ないと思いますが、開発時や、ユーザーがいったんサービスを退会してから再登録する場合など、いろいろ考えて作りました。
Sign in with Apple の既存アプリの対応締め切りが6月末と迫ってきています。まだ、React Native アプリで実装がまだの方はがんばっていきましょう。
最後に、オトバンクではエンジニアを募集中です。オーディオブックや、React Native開発に少しでも興味があれば、是非どうぞ。
お待ちしております。
