【ReactNative】FirebaseStoreの設定でcryptoが無いと怒られた

雑記
Alexas_Fotos / Pixabay
この記事は約3分で読めます。

こんにちは。やらしみずです。

先日リリースした元素記号早押しアプリ & 数字の早押しアプリにランキング機能を付ける関係で、Firebaseのデータベース?、FireStoreの設定をしている時に小一時間ハマってしまったエラーがあったので備忘録を残しておきます。

エラー

// firebaseをインストール
$ expo install firebase

// App.js等のファイルにFirebaseの設定を書く
$ emacs App.js
→ FirebaseのDocを見ながら設定

$ expo start
→ iosシュミレーターを起動

// エラー表示される
[Unhandled promise rejection: ReferenceError: Can't find variable: crypto]
...
...

対応方法1

私が使っているFirebaseのバージョンが、firebase 7.13.0だったのですが、firebase 7.9.0より上のバージョンを使っていると、次のエラーが出るらしいです。
なので、素直にバージョンを下げてみます。

// 既存のバージョンを削除
$ npm remove firebase
// 安定しているやつ?をインストール
$ npm install --save firebase@7.9.0

ちなみに、他にも以下のようなエラーが出てくることもあるようですが、同じ対応で良さそうです。

[Unhandled promise rejection: ReferenceError: Can't find variable: atob]
...

対応方法2

対応方法1で解決するとStackOverflowには書いてあったのですが、それでもうまく行かない、、、

というときは、キャッシュの問題かもしれません。

私はそうだったようで、

1.キャッシュの削除

expo start -c

2.端末(エミュレーター)の再起動

3.MacPC自体の再起動

の3つをやって、3つ目でやっとエラーが解消されました。

おまけ

Firebase側でルールを変更していないと次のエラーが出ます。

[Unhandled promise rejection: FirebaseError: Missing or insufficient permissions.

パーミッションを変更してあげることで動作するようになります。

// (設定例)
// ちなみにこの設定だと誰でもID等を知っていればアクセス出来てしまうので、後で適切な設定に変更する必要あります。
rules_version = '2';
service cloud.firestore {
  match /databases/{database}/documents {
    match /{document=**} {
      allow read, write;
    }
  }
}

最後に

ReactNativeのFirebase、まだまだ不安定なところが多いですが、作り終わってソースを見るとシンプルな仕組みで感動しますね。

ただ謎のエラーばっかなのと日本語の情報が少ないのだけは辛い、、、

日本人のReactNativeユーザもっと増えてほしい!!

コメント

タイトルとURLをコピーしました