Summary:
I would like to connect an EmberJS application to Firebase via Google login
Versions:
Ember : 3.1.2, Ember Data : 3.1.1, Firebase : 3.9.0
config/environment.js
'use strict';
module.exports = function(environment) {
let ENV = {
modulePrefix: 'myApp',
environment: environment, // : environment,
rootURL: '/',
locationType: 'auto',
firebase: {
apiKey: "CORRECT_API_KEY",
authDomain: "CORRECT_DOMAIN.firebaseapp.com",
databaseURL: "https://CORRECT_PREFIX.firebaseio.com",
projectId: "CORRECT_ID",
storageBucket: "CORRECT_BUCKET.appspot.com",
messagingSenderId: "CORRECT_NUMBER"
},
torii: {
sessionServiceName: 'session'
},
EmberENV: {
FEATURES: {
// Here you can enable experimental features on an ember canary build
// e.g. 'with-controller': true
},
EXTEND_PROTOTYPES: {
// Prevent Ember Data from overriding Date.parse.
Date: false
}
},
APP: {
// Here you can pass flags/options to your application instance
// when it is created
}
};
if (environment === 'development') {
// ENV.APP.LOG_RESOLVER = true;
// ENV.APP.LOG_ACTIVE_GENERATION = true;
// ENV.APP.LOG_TRANSITIONS = true;
// ENV.APP.LOG_TRANSITIONS_INTERNAL = true;
// ENV.APP.LOG_VIEW_LOOKUPS = true;
}
if (environment === 'test') {
// Testem prefers this...
ENV.locationType = 'none';
// keep test console output quieter
ENV.APP.LOG_ACTIVE_GENERATION = false;
ENV.APP.LOG_VIEW_LOOKUPS = false;
ENV.APP.rootElement = '#ember-testing';
// ENV.APP.autoboot = false;
}
if (environment === 'production') {
}
return ENV;
};
app/torii-adapters/application.js
import ToriiFirebaseAdapter from 'emberfire/torii-adapters/firebase';
export default ToriiFirebaseAdapter.extend({
});
app/adapters/application.js
import Ember from 'ember';
import FirebaseAdapter from 'emberfire/adapters/firebase';
export default FirebaseAdapter.extend({
firebase: Ember.inject.service()
});
app/routes/application.js
import Ember from 'ember';
export default Ember.Route.extend({
session: Ember.inject.service(),
beforeModel: function() {
return this.get('session').fetch().catch(function() {});
},
actions: {
signIn: function(provider) {
this.get('session').open('firebase', { provider: provider}).then(function(data) {
console.log(data.currentUser);
});
},
signOut: function() {
this.get('session').close();
}
}
});
app/templates/login.hbs
<div>
<button class="sign-out" >Sign Out</button>
</div>
<div>
<button class="auth-as-google" >Sign in with Google</button>
</div>
<div class="jumbo">
<h3>User Data</h3>
<table class="user-data-table">
<tr>
<td class="bold">session.isAuthenticated</td>
<td class="user-data-is-authenticated">
false
</td>
</tr>
<tr>
<td class="bold">session.provider</td>
<td class="user-data-provider">
</td>
</tr>
<tr>
<td class="bold">session.uid</td>
<td class="user-data-uid">
</td>
</tr>
</table>
</div>
Browser error:
Mirage: Your Ember app tried to POST 'https://www.googleapis.com/identitytoolkit/v3/relyingparty/verifyAssertion?key=CORRECT_API_KEY', but there was no route defined to handle this request. Define a route that matches this path in your mirage/config.js file. Did you forget to add your namespace?
Console error:
.../app/routes/application.js 32:9 error Unexpected console statement no-console
Question:
Please review and help. I have searched for these errors and tinkered with the Mirage config.js, but not sure if that is necessary (or if I am doing it correctly).
Aucun commentaire:
Enregistrer un commentaire