javascript 使い方 - 新しいAPIの2つの別々のファイルでFirebaseのリファレンスを初期化する





webアプリ 入門 (5)


これは私がFirebaseの新しいバージョンにアップグレードしたのと同様の問題です。 他の答えで説明されているように、2つの別々のfirebaseアプリを初期化したいかもしれませんが、アプリの2つの異なる場所でrefsを使いたいと思っていました。

このような状況のために必要なのは、firebaseを一度初期化しただけのfirebaseモジュールを作成してから、アプリケーションの別の場所にインポートまたは要求することです。

これはかなりシンプルです、ここに私のです:modules / firebase.js

import firebase from 'firebase';
var firebaseConfig = {
  apiKey: "some-api-key",
  authDomain: "some-app.firebaseapp.com",
  databaseURL: "https://some-app.firebaseio.com",
  storageBucket: "some-app.appspot.com",
};

var FbApp = firebase.initializeApp(firebaseConfig);
module.exports.FBApp = FbApp.database(); //this doesnt have to be database only

そして、あなたのアプリケーションの他の場所で簡単に:

import FBApp from '/your/module/location'
var messagesRef = FBApp.ref("messages/");

私は新しいAPIにアップグレードし、2つの別々のファイルでFirebaseリファレンスを初期化する方法を知らない:

    /* CASE 1 */
    // 1st file
    var config = {/* ...  */};
    firebase.initializeApp(config);
    var rootRef = firebase.database().ref();

    // 2nd file - initialize again
    var config = {/* ...  */};
    firebase.initializeApp(config);
    var rootRef = firebase.database().ref();

結果:bundle.js:535 Uncaught Error: 'DEFAULT'という名前のFirebaseアプリが既に存在します。

    /* CASE 2 */
    // 1st file
    var config = {/* ...  */};
    firebase.initializeApp(config);
    var rootRef = firebase.database().ref();

    // 2nd file - don't initialize
    var rootRef = firebase.database().ref();

結果:bundle.js:529 Uncaught Error:Firebase App '[DEFAULT]'が作成されていません - Firebase App.initializeApp()を呼び出してください。

新しいAPIを呼び出す前に

var myFirebaseRef = new Firebase("https://<YOUR-FIREBASE-APP>.firebaseio.com/");

各ファイルで、それは大丈夫だった。




私はこのようにインポートして間違いを犯しました。

import firebase from 'firebase'

const firebaseConfig = {
  apiKey: 'key',
  authDomain: 'domain',
  databaseURL: 'url',
  storageBucket: ''
};

firebase.initializeApp(firebaseConfig);

これは数日間はうまくいきましたが、 カスタムトークンでサインインしようとしたときに、authオブジェクトは変更されませんでした。 更新するためにページを更新しなければならなかったので、自分自身の認証資格情報ルールで保護されていたデータベースに特定の呼び出しを行うことができました。

 ".read": "$uid === auth.uid || auth.isAdmin === true || auth.isTeacher === true",

私はこれに私の輸入を変更したときに再び働いた。

import firebase from 'firebase/app';
import 'firebase/auth';
import 'firebase/database';

const firebaseConfig = {
  apiKey: 'key',
  authDomain: 'domain',
  databaseURL: 'url',
  storageBucket: ''
};

firebase.initializeApp(firebaseConfig);

Firebaseを特定のモジュールで使用する必要があるときはいつでも、これをインポートします(Firebaseの代わりにFirebase / Appからインポートすることに注意してください)。

import firebase from 'firebase/app';

そして、次のような特定のサービスに話してください。

firebase.auth().onAuthStateChanged((user) => {
  if (user) {
    // Authenticated.
  } else {
    // Logged out.
  }
});

firebase.database().ref('myref').once('value').then((snapshot) => {
  // do stuff with the snapshot
});



Firebaseがインスタンス化される場所を制御できない場合は、次のようなことができます:

 try {
    let firApp = firebase.app(applicationName);
    return firApp;
  } catch (error) {
    return firebase.initializeApp({
      credential: firebase.credential.cert(firebaseCredentials),
      databaseURL: firebaseUrl
    }, applicationName);
  }

Firebaseがアプリケーションを取得しようとしますが、それが存在しない場合は、自由に初期化できます。




異なるインスタンスに名前を付ける必要があります(Firebaseが呼び出すApps)。 デフォルトでは[DEFAULT] Appで作業していますが、これは最も一般的な使用例ですが、複数のAppsで作業する必要がある場合は、初期化するときに名前を追加する必要があります:

// Intialize the "[DEFAULT]" App
var mainApp = firebase.intializeApp({ ... });

// Intialize a "Secondary" App
var secondaryApp = firebase.initializeApp({ ... }, "Secondary");
...
mainApp.database().ref("path/to/data").set(value);
secondaryApp.database().ref("path/to/data").set(anotherValue);

追加のシナリオ例は、JavaScriptプロジェクトにFirebaseを追加するガイドの更新された複数のアプリケーションの初期化セクションを参照してください。




あなたはいくつかのことを間違っている。 説明は修正されたコードに従います:

<label id="LblTextCount"></label>
<textarea name="text" onKeyPress="checkLength(this, 512, 'LblTextCount')">
</textarea>

idの周りの引用符に注意してください。

function checkLength(object, maxlength, label) {
    charsleft = (maxlength - object.value.length);

    // never allow to exceed the specified limit
    if( charsleft < 0 ) {
        object.value = object.value.substring(0, maxlength-1);
    }

    // set the value of charsleft into the label
    document.getElementById(label).innerHTML = charsleft;
}

まず、あなたのキープレスイベントでは、ラベルIDを文字列として送信して正しく読む必要があります。 次に、InnerHTMLには小文字のiがあります。 最後に、文字列idを関数に渡したので、そのidで要素を取得できます。

それがどのようにあなたのために働くか教えてください

EDIT charsleftをvarとして宣言しないことによって、暗黙的にグローバル変数を作成しているわけではありません。 より良い方法は、関数内で宣言するときに次のようにすることです。

var charsleft = ....




javascript firebase