A Unity package that makes use of the Firebase Javascript SDK to implement the basic Realtime Database functions on WebGL builds.
Home Page: https://rotolonico.github.io/FirebaseWebGLImplementation/
When try to play the demo scene ("AuthExampleScene") in the project, to test the sign in with google and Facebook functionality.
It doesn't work and produce an error:
"An error occurred running the Unity content on this page. See your browser JavaScript console for more info. The error was:
ReferenceError: unityInstance is not defined".
I have placed the required code (firebase project setting code) in the index.html and enabled both (google and Facebook) of them in the firebase console also. Also try many things, but nothing worked for me.
Setup:
Also followed the links:
https://firebase.google.com/docs/auth/web/facebook-login
https://firebase.google.com/docs/auth/web/google-signin
I dont see any query for database like StartAt EndAt OrderBy etc
How to get current user and signout?
GetJSON works as expected in my game but Post, Push, and Update do not work. I've imported each of them but still get the error:
{"stack":"SyntaxError: Unexpected token p in JSON at position 0\n at JSON.parse ()\n at_PostJSON
any tips?
This is the closest implemention I found that is almost drop in over the real one, maybe needs a layer on top of it to match the API of firebase, and from what I find messages that go from callback are all sent togheter, maybe needs an id parameter to always be sent so that you can differentiate between messages.
I'm taking a look to see if it's doable as I have a game that would just love to port on web and works with firebase. I'll let you know of progress and ask for help if needed and if you want I can create a PR after with changes.
I keep getting "firebase is not defined" text output. I read all the comments and I have updated with the current changes that were posted. I am running Unity 2020.3.20 and firebase 9.1.3 which is the current link when registering a web app.
This project is awesome but I found out when I call the PostJSON function:
PostJSON: function(path, value, objectName, callback, fallback) { ... firebase.database().ref(parsedPath).set(parsedValue).then(function(unused) {...} }
and I pass JSON string from C# to its 'value' parameter, the realtime databse will not receive properly formatted JSON but some escaped string version of it like this:
"{\"Player\":\"Lukas\"}"
which prevents firebase to properly construct database structure since it treats this like a one line string (which it is).
After hours of searching I found out that set() function expects JavaScript object, not a JSON string so instead of calling
set(parsedValue)
I had to use JSON.parse like this:
set(JSON.parse(parsedValue))
which converts 'parsedValue' string into proper JS object. Also I found here that Pointer_stringify function is obsolete and is being replaced by UTF8ToString.
As soon as I added that JSON.parse call and replaced all Pointer_stringify calls by UTF8ToString it all stared working although the Pointer_stringify replacement might not be necessary here.
I hope this helps someone in the future.
JL
Hey! thanks for your great work, please add to your plugins : firebaseauth.jslib, and too FirebaseAuth.cs
SignInAnonymously: function (objectName, callback, fallback){
var parsedObjectName = Pointer_stringify(objectName);
var parsedCallback = Pointer_stringify(callback);
var parsedFallback = Pointer_stringify(fallback);
try {
firebase.auth().signInAnonymously().then(function (result) {
unityInstance.Module.SendMessage(parsedObjectName, parsedCallback, "Success: signed up for " + result);
}).catch(function (error) {
unityInstance.Module.SendMessage(parsedObjectName, parsedFallback, JSON.stringify(error, Object.getOwnPropertyNames(error)));
});
} catch (error) {
unityInstance.Module.SendMessage(parsedObjectName, parsedFallback, JSON.stringify(error, Object.getOwnPropertyNames(error)));
}
},
Hi, I'm trying to read a Firebase Timestamp from the Cloud Firestore and convert the seconds and nanoseconds to a DateTime. The only examples I can find online are using Firebase's .ToDate() but I don't believe that's possible when building on Unity to WebGL.
Any ideas?
Thanks!
Hello everyone,
To fix that issue go to:
\Assets\FirebaseWebGL\Plugins\firebasedatabase.jslib
And cange the entire code with the code listed below:
mergeInto(LibraryManager.library, {
GetJSON: function(path, objectName, callback, fallback) {
var parsedPath = Pointer_stringify(path);
var parsedObjectName = Pointer_stringify(objectName);
var parsedCallback = Pointer_stringify(callback);
var parsedFallback = Pointer_stringify(fallback);
try {
firebase.database().ref(parsedPath).once('value').then(function(snapshot) {
unityInstance.Module.SendMessage(parsedObjectName, parsedCallback, JSON.stringify(snapshot.val()));
});
} catch (error) {
unityInstance.Module.SendMessage(parsedObjectName, parsedFallback, JSON.stringify(error, Object.getOwnPropertyNames(error)));
}
},
PostJSON: function(path, value, objectName, callback, fallback) {
var parsedPath = Pointer_stringify(path);
var parsedValue = Pointer_stringify(value);
var parsedObjectName = Pointer_stringify(objectName);
var parsedCallback = Pointer_stringify(callback);
var parsedFallback = Pointer_stringify(fallback);
try {
firebase.database().ref(parsedPath).set(JSON.parse(parsedValue)).then(function(unused) {
unityInstance.Module.SendMessage(parsedObjectName, parsedCallback, "Success: " + parsedValue + " was posted to " + parsedPath);
});
} catch (error) {
unityInstance.Module.SendMessage(parsedObjectName, parsedFallback, JSON.stringify(error, Object.getOwnPropertyNames(error)));
}
},
PushJSON: function(path, value, objectName, callback, fallback) {
var parsedPath = Pointer_stringify(path);
var parsedValue = Pointer_stringify(value);
var parsedObjectName = Pointer_stringify(objectName);
var parsedCallback = Pointer_stringify(callback);
var parsedFallback = Pointer_stringify(fallback);
try {
firebase.database().ref(parsedPath).push().set(JSON.parse(parsedValue)).then(function(unused) {
unityInstance.Module.SendMessage(parsedObjectName, parsedCallback, "Success: " + parsedValue + " was pushed to " + parsedPath);
});
} catch (error) {
unityInstance.Module.SendMessage(parsedObjectName, parsedFallback, JSON.stringify(error, Object.getOwnPropertyNames(error)));
}
},
UpdateJSON: function(path, value, objectName, callback, fallback) {
var parsedPath = Pointer_stringify(path);
var parsedValue = Pointer_stringify(value);
var parsedObjectName = Pointer_stringify(objectName);
var parsedCallback = Pointer_stringify(callback);
var parsedFallback = Pointer_stringify(fallback);
try {
firebase.database().ref(parsedPath).update(JSON.parse(parsedValue)).then(function(unused) {
unityInstance.Module.SendMessage(parsedObjectName, parsedCallback, "Success: " + parsedValue + " was updated in " + parsedPath);
});
} catch (error) {
unityInstance.Module.SendMessage(parsedObjectName, parsedFallback, JSON.stringify(error, Object.getOwnPropertyNames(error)));
}
},
DeleteJSON: function(path, objectName, callback, fallback) {
var parsedPath = Pointer_stringify(path);
var parsedObjectName = Pointer_stringify(objectName);
var parsedCallback = Pointer_stringify(callback);
var parsedFallback = Pointer_stringify(fallback);
try {
firebase.database().ref(parsedPath).remove().then(function(unused) {
unityInstance.Module.SendMessage(parsedObjectName, parsedCallback, "Success: " + parsedPath + " was deleted");
});
} catch (error) {
unityInstance.Module.SendMessage(parsedObjectName, parsedFallback, JSON.stringify(error, Object.getOwnPropertyNames(error)));
}
},
ListenForValueChanged: function(path, objectName, callback, fallback) {
var parsedPath = Pointer_stringify(path);
var parsedObjectName = Pointer_stringify(objectName);
var parsedCallback = Pointer_stringify(callback);
var parsedFallback = Pointer_stringify(fallback);
try {
firebase.database().ref(parsedPath).on('value', function(snapshot) {
unityInstance.Module.SendMessage(parsedObjectName, parsedCallback, JSON.stringify(snapshot.val()));
});
} catch (error) {
unityInstance.Module.SendMessage(parsedObjectName, parsedFallback, JSON.stringify(error, Object.getOwnPropertyNames(error)));
}
},
StopListeningForValueChanged: function(path, objectName, callback, fallback) {
var parsedPath = Pointer_stringify(path);
var parsedObjectName = Pointer_stringify(objectName);
var parsedCallback = Pointer_stringify(callback);
var parsedFallback = Pointer_stringify(fallback);
try {
firebase.database().ref(parsedPath).off('value');
unityInstance.Module.SendMessage(parsedObjectName, parsedCallback, "Success: listener removed");
} catch (error) {
unityInstance.Module.SendMessage(parsedObjectName, parsedFallback, JSON.stringify(error, Object.getOwnPropertyNames(error)));
}
},
ListenForChildAdded: function(path, objectName, callback, fallback) {
var parsedPath = Pointer_stringify(path);
var parsedObjectName = Pointer_stringify(objectName);
var parsedCallback = Pointer_stringify(callback);
var parsedFallback = Pointer_stringify(fallback);
try {
firebase.database().ref(parsedPath).on('child_added', function(snapshot) {
unityInstance.Module.SendMessage(parsedObjectName, parsedCallback, JSON.stringify(snapshot.val()));
});
} catch (error) {
unityInstance.Module.SendMessage(parsedObjectName, parsedFallback, JSON.stringify(error, Object.getOwnPropertyNames(error)));
}
},
StopListeningForChildAdded: function(path, objectName, callback, fallback) {
var parsedPath = Pointer_stringify(path);
var parsedObjectName = Pointer_stringify(objectName);
var parsedCallback = Pointer_stringify(callback);
var parsedFallback = Pointer_stringify(fallback);
try {
firebase.database().ref(parsedPath).off('child_added');
unityInstance.Module.SendMessage(parsedObjectName, parsedCallback, "Success: listener removed");
} catch (error) {
unityInstance.Module.SendMessage(parsedObjectName, parsedFallback, JSON.stringify(error, Object.getOwnPropertyNames(error)));
}
},
ListenForChildChanged: function(path, objectName, callback, fallback) {
var parsedPath = Pointer_stringify(path);
var parsedObjectName = Pointer_stringify(objectName);
var parsedCallback = Pointer_stringify(callback);
var parsedFallback = Pointer_stringify(fallback);
try {
firebase.database().ref(parsedPath).on('child_changed', function(snapshot) {
unityInstance.Module.SendMessage(parsedObjectName, parsedCallback, JSON.stringify(snapshot.val()));
});
} catch (error) {
unityInstance.Module.SendMessage(parsedObjectName, parsedFallback, JSON.stringify(error, Object.getOwnPropertyNames(error)));
}
},
StopListeningForChildChanged: function(path, objectName, callback, fallback) {
var parsedPath = Pointer_stringify(path);
var parsedObjectName = Pointer_stringify(objectName);
var parsedCallback = Pointer_stringify(callback);
var parsedFallback = Pointer_stringify(fallback);
try {
firebase.database().ref(parsedPath).off('child_changed');
unityInstance.Module.SendMessage(parsedObjectName, parsedCallback, "Success: listener removed");
} catch (error) {
unityInstance.Module.SendMessage(parsedObjectName, parsedFallback, JSON.stringify(error, Object.getOwnPropertyNames(error)));
}
},
ListenForChildRemoved: function(path, objectName, callback, fallback) {
var parsedPath = Pointer_stringify(path);
var parsedObjectName = Pointer_stringify(objectName);
var parsedCallback = Pointer_stringify(callback);
var parsedFallback = Pointer_stringify(fallback);
try {
firebase.database().ref(parsedPath).on('child_removed', function(snapshot) {
unityInstance.Module.SendMessage(parsedObjectName, parsedCallback, JSON.stringify(snapshot.val()));
});
} catch (error) {
unityInstance.Module.SendMessage(parsedObjectName, parsedFallback, JSON.stringify(error, Object.getOwnPropertyNames(error)));
}
},
StopListeningForChildRemoved: function(path, objectName, callback, fallback) {
var parsedPath = Pointer_stringify(path);
var parsedObjectName = Pointer_stringify(objectName);
var parsedCallback = Pointer_stringify(callback);
var parsedFallback = Pointer_stringify(fallback);
try {
firebase.database().ref(parsedPath).off('child_removed');
unityInstance.Module.SendMessage(parsedObjectName, parsedCallback, "Success: listener removed");
} catch (error) {
unityInstance.Module.SendMessage(parsedObjectName, parsedFallback, JSON.stringify(error, Object.getOwnPropertyNames(error)));
}
},
ModifyNumberWithTransaction: function(path, amount, objectName, callback, fallback) {
var parsedPath = Pointer_stringify(path);
var parsedObjectName = Pointer_stringify(objectName);
var parsedCallback = Pointer_stringify(callback);
var parsedFallback = Pointer_stringify(fallback);
try {
firebase.database().ref(parsedPath).transaction(function(currentValue) {
if (!isNaN(currentValue)) {
return currentValue + amount;
} else {
return amount;
}
}).then(function(unused) {
unityInstance.Module.SendMessage(parsedObjectName, parsedCallback, "Success: transaction run in " + parsedPath);
});
} catch (error) {
unityInstance.Module.SendMessage(parsedObjectName, parsedFallback, JSON.stringify(error, Object.getOwnPropertyNames(error)));
}
},
ToggleBooleanWithTransaction: function(path, objectName, callback, fallback) {
var parsedPath = Pointer_stringify(path);
var parsedObjectName = Pointer_stringify(objectName);
var parsedCallback = Pointer_stringify(callback);
var parsedFallback = Pointer_stringify(fallback);
try {
firebase.database().ref(parsedPath).transaction(function(currentValue) {
if (typeof currentValue === "boolean") {
return !currentValue;
} else {
return true;
}
}).then(function(unused) {
unityInstance.Module.SendMessage(parsedObjectName, parsedCallback, "Success: transaction run in " + parsedPath);
});
} catch (error) {
unityInstance.Module.SendMessage(parsedObjectName, parsedFallback, JSON.stringify(error, Object.getOwnPropertyNames(error)));
}
}
});
Dear Nico,
I'm trying to run the Storage example but failed.
Where I have to add my gs://bucket.appspot.com?
Also what other changes I need to do to upload image and get the link of the image?
Thanks.
Hi, thanks for this phenomenal repository, it's just what I needed.
The installation instructions say I should copy the FirebaseWebGL directory into my assets folder, but this by itself is not sufficient; it threw errors involving "proyecto." I also needed to copy the RestClient directory, which seems to have fixed it. Hopefully this is all, but unsure; recommend updating the readme. thank you!
I've tried the code keep getting this error No Firebase App '[DEFAULT]' has been created - call Firebase App.initializeApp()
Hello Guys, I have an issue. I have implemented everything correctly but still there is an error in my webGL build which says that "there was an error: firebase is not defined". I did everything as in the video. What should i do to solve this problem?
It's unclear to me how the login as Google functionality is supposed to work. The method to initiate the redirect is included, but there is no method to retrieve the result, i.e. https://firebase.google.com/docs/reference/js/v8/firebase.auth.Auth#getredirectresult
How is it supposed to work?
I added unitypackage in the project and then call functions for auth and build WebGL, then I added my firebase config to the built index.html file and this.unityInstance = unityInstance line also, then I uploaded the build zip file on unity play. but now I am getting an error called: unityinstance is not defined.
is there something I am missing or to add?
Please help.
Could you please let me know if I can use this in a Windows/Mac app built using Unity? Thanks in advance
Hello. Awesome repo!! keep up the good work!!
I found related to issue #5 that the js funtions are not recognized for versions newwe that 8.10 because firebase is not defined when the firestore function were called (in my particularcase for firestore use).
Seems that for these versions firebase is initialized a bit differently and the firebase object is not accesible globally, as for newer versions there is no <script src="https://www.gstatic.com/firebasejs/8.10.0/firebase-app.js"></script> tag at the top.
not working firebase provided sample :
<script type="module">
// Import the functions you need from the SDKs you need
import { initializeApp } from "https://www.gstatic.com/firebasejs/9.6.1/firebase-app.js";
import { getAnalytics } from "https://www.gstatic.com/firebasejs/9.6.1/firebase-analytics.js";
// TODO: Add SDKs for Firebase products that you want to use
// https://firebase.google.com/docs/web/setup#available-libraries
// Your web app's Firebase configuration
// For Firebase JS SDK v7.20.0 and later, measurementId is optional
const firebaseConfig = {
//....
};
// Initialize Firebase
const app = initializeApp(firebaseConfig);
const analytics = getAnalytics(app);
</script>
I tried substituting const app = initializeApp(firebaseConfig); by const firebase= initializeApp(firebaseConfig); and var firebase = initializeApp(firebaseConfig); but that was not working. I also tried this.firebase =firebase; in the script.onload as suggested in #5. Not working either.
Maybe a import needs tobe added to the respective .jslib. I did not try that.
I do not know what needs to be done for the newer versions, but in my case downgrading version and pasting this html instead that the one provided by firebase itself solved it momentarily:
<script src="https://www.gstatic.com/firebasejs/8.10.0/firebase-app.js"></script>
<script type="module">
import { } from "https://www.gstatic.com/firebasejs/8.10.0/firebase-firestore.js";
const firebaseConfig = {
//....
};
firebase.initializeApp(firebaseConfig);
</script>
I was wondering what the plugin's equivalent is to this web call?
https://firebase.google.com/docs/database/web/read-and-write#update_specific_fields
// Get a key for a new Post.
var newPostKey = firebase.database().ref().child('posts').push().key;
I am adding scores to a table and would like to get the score id returned immediately after pushing the score. I will eventually work it out (and will update the post when I do), but just looking to see if anyone else has their implementation at hand!
Apologies if this is a very stupid question, but I cant' find the firebase.libjs file that corresponds to the Firebasebridge.cs example that is included in the project files.
Additionally, I get a cross origin request error when trying to run a webGL build of the provided examples.
Access to XMLHttpRequest at 'file:///Users/***/***/build/Build/build.data.gz' from origin 'null' has been blocked by CORS policy: Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, chrome-untrusted, https.
Am I missing something?
More of a question than an issues.
But have you had any job getting the firebase analytics package working with webGL or any pointers on trying to get it working?
At its core i understand i need a .jslib file with the analytics functions inside and then use the dllImport to call the functions, but cant find a .jslib for this feature/know where to start to create one.
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
Django
The Web framework for perfectionists with deadlines.
Laravel
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
Microsoft
Open source projects and samples from Microsoft.
Google
Google ❤️ Open Source for everyone.
Alibaba
Alibaba Open Source for everyone
D3
Data-Driven Documents codes.
Tencent
China tencent open source team.