Uncaught ReferenceError: Firebase is niet gedefinieerd

Ik probeer de tutorial over het ontwerpen van een database in Firebase te volgen, maar ik krijg de volgende foutmelding in de JavaScript-console:

Uncaught ReferenceError: Firebase is niet gedefinieerd

Hier is de link naar de tutorial en het codefragment dat ik probeerde uit te voeren in de JavaScript-console is: https://www.firebase.com/blog/2014-11-04-firebase-realtime-queries.html

var ref = new Firebase("https://dinosaur-facts.firebaseio.com/dinosaurs");
ref.orderByChild("height").on("child_added", function(snapshot) {
  console.log(snapshot.key() + " was " + snapshot.val().height + " meters tall");
});

Antwoord 1, autoriteit 100%

Er is een handleiding voor het migreren naar de nieuwe versie.
Je kunt het vinden op: https://firebase.google.com/support/guides/firebase -web

En hier is het relevante fragment voor jou

voer hier de afbeeldingsbeschrijving in


Antwoord 2, autoriteit 76%

Vermeld in de kop het volgende:

<head>
    <script src='https://cdn.firebase.com/js/client/2.2.1/firebase.js'></script>
    <script src='https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js'></script>
    <link rel='stylesheet' type='text/css' href='/resources/tutorial/css/example.css'>
  </head>

Antwoord 3, autoriteit 14%

als u firebase web-api gebruikt, is het erg belangrijk om de core firebase SDK eerst in de body-tag op te nemen. Deze SDK biedt firebase-toegankelijkheid. zoals weergegeven in afbeelding.

,Daarna moeten we alle gerelateerde api-code opnemen. die beschikbaar is


1

scripties zullen nuttig voor u zijn, en het zal uw probleem nors oplossen, dat is firebase is niet gedefinieerd, u hoeft geen ander script toe te voegen

2


Antwoord 4, autoriteit 10%

<head>
    <script src='https://cdn.firebase.com/js/client/2.2.1/firebase.js'></script>
    <script src='https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js'></script>
    <link rel='stylesheet' type='text/css' href='/resources/tutorial/css/example.css'>
  </head>

Antwoord 5, autoriteit 10%

Als u Firebase Hosting gebruikt zoals ik was (en <script src="/__/firebase/7.14.5/firebase-app.js"></script>gebruikt ), dan kom je deze fout tegen als je lokaal probeert te testen zonder firebase serveuit te voeren.


Antwoord 6, autoriteit 5%

Ik had hetzelfde probleem toen ik Firebase installeerde via “ionic add firebase”. Deze toegevoegde firebase-versie 3.2.0. Toen ik op zoek was naar antwoorden probeerde ik de cdn met versie 2.4.2 en de fout verdween, dus ik kwam erachter dat de via ionic gedownloade versie de fout veroorzaakte, dus ik downloadde versie 2.4.2 en nu werkt het.

Ik hoop dat dit helpt.


Antwoord 7, autoriteit 5%

ik heb het probleem met firebase.util lib, zoals Rodrigo zei, ik denk dat het een probleem is met de versie.

Vroeger:

   var ref = new Firebase('url');

Nu:

   firebase.initializeApp(config);

Omdat het firebase-object anders is gedefinieerd, wordt het niet gevonden. In mijn geval moet ik de bibliotheek bijwerken om compatibel te zijn met versie 3.0 van firebase. Ik denk niet dat het een goed idee is om de oude bibliotheek te gebruiken, uit de pas lopen is prima, maar zal de codes moeten updaten naar versie 3. Als nog niemand dat heeft gedaan, is dit misschien onze kans om bij te dragen aan de community.


Antwoord 8

maak de verbindingsvariabele van de firebase.

con = {
    "apiKey": "your key",
    "authDomain": "example.firebaseapp.com",
    "databaseURL": "https://example.firebaseio.com/",
    "projectId": "example",
    "storageBucket": "example.appspot.com",
    "messagingSenderId": "id"
};

initialiseer hiermee de firebase

firebase.initializeApp(con);

Antwoord 9

Als iemand dit probleem heeft in juli 2021, hier is mijn oplossing:

1.) GEBRUIK DE CLI!!! Het is zoveel makkelijker!!! (doe gewoon npm install -g firebase-tools

2.) CD naar de directory van uw voorkeur en doe firebase login

3.) Log in op uw firebase acc.

4.) Voer firebase inituit en doorloop alle stappen

5.) maak een app.js-bestand in uw public/-map

6.) Voeg deze code toe:

document.addEventListener('DOMContentLoaded', event => {
        const app = firebase.app();
});

En je zou nu allemaal goed moeten zijn, zorg er gewoon voor dat je code schrijft die interageert met FireBase in de EventListener

Uw project zou er ongeveer zo uit moeten zien:

Afbeelding van map in VSCode


Antwoord 10

Ik zat ook met hetzelfde probleem. Het probleem was met mijn api.js-bestand.

const api = liveAPi;
var firebaseConfig = {
  apiKey: "xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx",
  authDomain: "xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx",
  projectId: "xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx",
  storageBucket: "xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx",
  messagingSenderId: "xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx",
  appId: "xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx",
  measurementId: "xxxxxxxxxxxxx"
};
  // Initialize Firebase
firebase.initializeApp(firebaseConfig);

Het laat duidelijk zien dat het geen toegang had tot het firebase-object.
Firebase stelt voor om het js-bestand toe te voegen via <script src="https://www.gstatic.com/firebasejs/8.7.0/firebase-app.js">,

<!-- The core Firebase JS SDK is always required and must be listed first -->
<script src="https://www.gstatic.com/firebasejs/8.7.0/firebase-app.js"></script>
<!-- TODO: Add SDKs for Firebase products that you want to use
     https://firebase.google.com/docs/web/setup#available-libraries -->
<script src="https://www.gstatic.com/firebasejs/8.7.0/firebase-analytics.js"></script>
<script>
  // Your web app's Firebase configuration
  // For Firebase JS SDK v7.20.0 and later, measurementId is optional
  var firebaseConfig = {
    apiKey: "xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx",
      authDomain: "xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx",
      projectId: "xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx",
      storageBucket: "xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx",
      messagingSenderId: "xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx",
      appId: "xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx",
      measurementId: "xxxxxxxxxxxxx"
  };
  // Initialize Firebase
  firebase.initializeApp(firebaseConfig);
  firebase.analytics();
</script>

Maar ik had toegang tot de firebase-objecten in het js-bestand.

Dus om dit op te lossen: voeg deze toe aan het firebase-object net voordat u het api.js-bestand in HTML opneemt, zoals dit:-

<script src="https://www.gstatic.com/firebasejs/8.7.0/firebase-app.js"></script>
<script src="../js/fetch/api.js"></script>

Hierdoor krijgt api.js toegang tot het firebase-object.

Er zijn ook enkele andere methoden om toegang te krijgen tot die firebase-objecten in javascript-bestanden, maar de standaardconfiguratie die door firebase wordt geboden via het globale object is veilig.

En de methode om alle Javascript-code in APP.js te schrijven en toegang te krijgen tot firebase-objecten en -methoden is ook een goede keuze, maar erg pijnlijk voor grotere projecten. Omdat je je code moet herstructureren en bundelen/opnemen in één bestand App.js.

LEAVE A REPLY

Please enter your comment!
Please enter your name here

9 − 2 =

Other episodes