react native social login
react nativeシリーズは備忘録的にたいした編集もせずに書く殴っていたが、いがいに見てくれているひとがいるらしく申し訳なく思った。しかし、いまは編集の時間がもったいないのでこのままリリースまでは走る。
parseの設定
さてさて、ビューができてきたのでそろそろ画像などちゃんと表示させたくなる。ここまでくるとダミーデータをつくるのも非効率な気がしてきたので、サーバサイドから値を返すようにする。
サーバサイドには、MBaasのparseを選定した。理由は時間的に低コストでできそうだからMBaas。MBaasのなかでも評判が一番良さそうだった。これまでMBaasはKiiCloudくらいしかまともに使ったことがない。
dashbordからリレーションの設定
webのコンソールからいくつかダミーデータをつくっていく。最初普通にuserId
とかってカラムをつくって参照してたが、よくよくみるとRelation
って型を選択できる。webのコンソールからリレーションをはることはできないらしい。
と、思ったけどよくよくみるとこれは2年も前の記事で、実際にparseのdashboardで試してみるとRelation
型のカラムのView relation
ボタンから参照一覧に飛んで、そこで+
ボタンから追加できそう。
API経由でリレーションの設定
このあたりを参考にすると、API経由でリレーションの設定もできる。
columnNameのとこにカラム名を指定するの注意。
また、はまりポイントとしては、カスタムクラスのエンドポイントはAPI Consoleにウォーターマークでもでるように、classes/_User
みたいな感じでもいいんだけど、デフォルトであるUser
クラスのエンドポイントが間違っていてハマった。
ま、リファレンスにあるとおりなんだけど、/users
になるみたい。parseのUI好きだなあ。
SocialLoginの実装
ライブラリの選定
さてダミーデータ準備できたが、データをUser
に紐付けたので当然ながら認証の問題がでてくる。めんどくさいとは思いながらも、いい感じのライブラリないかなと思ってたら、react-native系のライブラリまとめを発見した。スターの数はやっぱり参考になる。
social login系ではreact-native-loginあたりがいいなとおもったけど、Warning: This project is running on React Native 0.5.0, which is a couple of months old. Pull requests welcome to update to the most recent version!
とのこと。0.5.0
はちょっと古すぎるなあ。いま0.17.0
つかってるし。Pull requestsの期待に応えられないことに歯がゆさを感じつつ、他をさがす。
とまあ、react-native-facebook-loginなるものもよさそう。package.json
みる感じ0.14.0
なのでまあまあ期待できる。なのでこれを導入してみる。
react-native-facebook-loginの導入
FacebookSDKは個別に落とす必要はなく、ライブラリに含まれている。
QuickStartに従って設定を進める。(facebook for developersにログインしたら見られる)
Xcodeのビルドが通ったので設定はできた模様。とりあえずexsample
にあるサンプルを動かしてみようと思ったが動かず。
RCTRootView.h' file not found
違うライブラリのissueだが、これを参考にRCTRootView.hを追加してあげたら解決できた。
FBSDKCoreKit.h' file not found
またなにかしらでてくるが、このあたりを参考にnpm install
してみる。いちどした気がしたけどな。
example.xcodeproj Applications using launch screen files and targeting iOS 7.1 and earlier need to also include a launch image in an asset catalog.
こいつはとりあえず対象OSバージョンを9.2とかにして消して、
sourcecode.c.h in Frameworks & Libraries build phase
こいつは、どうやらさっきLink Binary with Libraries
に.h
ファイルを追加したことがよくないらしく、それらを消す。
ld: warning: Auto-Linking supplied '../node_modules/react-native-facebook-login/FacebookSDK/FBSDKCoreKit.framework/FBSDKCoreKit', framework linker option at ../node_modules/react-native-facebook-login/FacebookSDK/FBSDKCoreKit.framework/FBSDKCoreKit is not a dylib
example/Frameworks
に残っていた.h
ファイルも削除する
FBSDKCoreKit.h' file not found
と、ここにまた戻ってきた。。。
反省
どう考えてもiOSアプリのプロジェクト構成やビルド、リンク周りの仕組みを理解せずにやってみてるから問題が解決できないわけ。ヘッダファイルが見えてないのだから、原因は明白なわけで。ちょっと一旦仕切りなおそう。